WIP: Ractive #8
WIP: Ractive #8
Conversation
…Ractive templates.
DONE:
remove gulp task for pattern book
set up Ractive pattern-book as a file that loads in data from a separate file
create ractive template in the pattern book
fix any template problems
TO-DO
turn template into partials
get partials out into separate files
get a header and footer working
gulp watch has to work with live reload
CHANGES FROM HANDLEBARS:
no use of variable names with minus signs in them e.g. new-item - they are interpreted as expressions
can’t use {{else}} in {{#unless}}
Ancestor references work differently in Ractive - ‘../‘ steps up from an item into the array/object it is in, whereas in Handlebars ‘../‘ steps up from the array/object itself to its parent
Ractive steps up the context stack looking for existing variables, whereas handlebars does not, so sometimes you have to use e.g. .myVar to restrict the scope to the current context
|
Great! Why do the templates need to be in separate files? So they can be reused? (I missed the thinking on the gulp server thing) |
|
If it's to demonstrate different combinations of partials (e.g. all in a list, together as an Edit screen, etc.) perhaps the simplest thing is to have them all in the same page as well? |
|
Yeah, it's a good point. I was thinking about this some more yesterday. I think we could probably start with all the templates together in one page and see if that works; or have them loaded into a single file from a single directory. Then you'd have all the partials/templates available for the pattern-book. And I'm thinking about how this then continues to be useful further down the development path - what's the easiest way to make views from the pattern-book, what's the easiest way to add behaviour to the templates (I suspect the idea of components being wrapped up in a single HTML file with HTML and JS (and CSS if you want it there) together is intriguing). |
An attempt to replace gulp http server + handlebars with gulp build process + ractive.