Blaze React (devel)
Blaze React is a Meteor package which give you templates for React in a familiar Blaze API (giving you helpers, events, onRendered, onCreated etc) with a subset of Spacebars (aka Meteor flavored Handlebars).
Why React? – Well it gives us faster pageloads, SEO without Spiderable, accessibility for users without JavaScript and general improvements in page rendering speed.
Why a Blaze/Spacebars API? – Well it's way easier to learn and get started with, can't argue against that right (see examples below)?
Installation
meteor add timbrandin:blaze-react
Demo
- XXX Add new demo here... I.e. Microscope.
- http://spacedropcms.org (https://github.com/spacedrop/spacedrop)
- http://timbrandin.com (https://github.com/timbrandin/timbrandin)
Getting started
Currently this project is in flux until we have a preview-release, partly due to the announcement from MDG in developing a similar package that builds templates for React, but we think we can give this to you earlier than within a few months and with support for most of Blaze 1 features and Spacebars.
XXX Add example code to get started.
Features
- .html to ReactTemplate
- Blaze helpers
- Blaze helper context (with the data from the context)
- Blaze onCreated @TwinTailsX
- Blaze events
- Blaze onRendered @TwinTailsX
- Blaze onDestroyed @TwinTailsX
- Blaze autorun @TwinTailsX @facespacey
- Blaze subscribe @TwinTailsX @facespacey
- Spacebars {{helper}} (SafeString)
- Spacebars {{helper ..args}} (SafeString) (with arguments)
- Spacebars {{{helper}}} (raw HTML)
- Spacebars {{{helper ..args}}} (raw HTML) (with arguments)
- Spacebars "{{helper}}" (SafeString – In Attribute Values)
- Spacebars ={{helper}} (SafeString – Dynamic Attribute Value)
- Spacebars {{#if}}
- Spacebars {{else}} {{/if}}
- Spacebars {{else}} {{/if}} (nested)
- Spacebars {{#each}}
- Spacebars {{#each in}}
- Spacebars {{else}} {{/each}}
- Spacebars {{else in}} {{/each}}
- Spacebars {{else}} {{/each}} (nested)
- Spacebars {{#with}}
- Spacebars {{else}} {{#with}}
- Spacebars {{else}} {{#with}} (nested)
- Spacebars {{#unless}}
- Spacebars {{else}} {{/unless}}
- Spacebars {{else}} {{/unless}} (nested)
- Spacebars {{#helper}}} (Block helpers)
- Spacebars {{#helper ...args}}} (Block helpers with arguments)
- Spacebars {{/helper}}} (Block helpers)
- Spacebars parentData()
- Spacebars {{../../helper}}
- Throw notice when the syntax is broken.
- Transpilation as a Babel plugin, i.e. babel-preset-react