sgi

sails-generate-isoreact

A `isomorph reactjs` generator for use with the Sails command-line interface

Showing:

Popularity

Downloads/wk

13

GitHub Stars

16

Maintenance

Last Commit

6yrs ago

Contributors

0

Package

Dependencies

3

License

MIT

Type Definitions

Tree-Shakeable

No?

Categories

Readme

sails-generate-isoreact

A isomorphic react app generator for use with the Sails command-line interface.

Certain generators are installed by default in Sails, but they can be overridden. Other generators create entirely new things. Check the Sails docs for information on installing generator overrides / custom generators and information on building your own generators.

Isomorphic bootstrap App with react

install by default

  • react,
  • react-router, for routing app
  • sails-react-store : wrap sails.socket.io with bluebrint method with 2 reactComponent (Item and CollectionItem)

dependencies : Browserify

$ npm install -g browserify

Installation

Generate your sails app

$ sails generate new myApp

$ cd myApp

$ npm install sails-generate-isoreact

Maybe, you need install grunt-browserify with sudo

Usage

On the command line

First install with :
$ sails generate isoreact

$ npm i --save sails-hook-babel grunt-browserify

maybe use sudo

then do
$ browserify -r react -r react-router -r sails-react-store > assets/js/dependencies/build.js
finally add this in your layout.ejs before your scripts
<script type="text/javascript"><%- locals.state||'' %></script>

Starting

see components's folder for starting

Example Simple controller
var React = require('react')
  , Router = require('react-router')
  , routes = require('../../components/routes.js');

module.exports = {
  home: function(req, res) {
    Router.run(routes, "home", function(Root){
        res.view("layout", {
          locals: {
            title: 'My home',
            description: 'my sweet home'
          },
          body: React.renderToString(<Root />)
        });
      });
    });
  },

...

Example with renderTo service
var routes = require('../../components/routes.js');

module.exports = {
  home: function(req, res) {
    renderTo(routes, res.view, '/', {title:'home'})
  },
  articles: function(req, res) {
    Post.find().exec(function(err, posts){
      renderTo(routes, res.view, '/articles', {title:'articles'}, {items:posts});
    });
  },

...

example routes
...

  '/': 'HomeController.home',

  '/articles': 'HomeController.articles'

...

Development

To get started quickly and see this generator in action, ...

Also see CONTRIBUTING.md for more information on overriding/enhancing existing generators.

Questions?

See FAQ.md.

More Resources

License

MIT © 2015 balderdashy & contributors

As for Sails? It's free and open-source under the MIT License.

image_squidhome@2x.png

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100
No reviews found
Be the first to rate

Alternatives

No alternatives found

Tutorials

No tutorials found
Add a tutorial