Deprecated in favor of builtbybig/start

Starter

Start project for frontend applications using:

• Socket.io - Feature rich, stable real-time WebSockets library.
• React - One way view rendering framework by Facebook.
  • Reflux - A simple library for uni-directional dataflow application architecture inspired by ReactJS Flux.
• Browserify - Allows CommonJS (require('module') style) imports in your frontend JavaScript code.
• Gulp - A lightning fast task runner.
• LESS - A CSS preprocessor with variables, functions, and tons of utilities to make writing CSS suck less.
• fb-flo for automatic reloading of your HTML, CSS and JavaScript code without refresh.
• Mocha - JavaScript test runner.
• Bower - Front-end package management tool.
• Bootstrap - Front-end user interface library.
  • react-bootstrap - React components for common Bootstrap components.

Running the gulp scripts (see below), allows you to do some other awesome things like:

• Generate sourcemaps for you CSS and JavaScript.
• Automatically concatenate and minify your CSS and JavaScript.
• Run code linting on your JavaScript.
• Automatically run your test suite on any changes (with an awesome test runner to boot!).

Screenshots

Customer listing:

Bi-directional WebSocket communication:

Setup

To get started, make sure you have Node.js installed and then run:

npm install -g gulp

Gulp is a task runner, similar to Grunt but with a more code driven approach to defining tasks. See the gulpfile.js for all the available tasks.

Next, copy the .env.example file over to .env and adjust the settings in it as needed. The .env file is loaded by Gulp to configure your environment.

Usage

For local development, you'll most likely want to run the watch task:

gulp watch # or just "gulp" which is an alias to "gulp watch"

This will startup a webserver using fb-flo, watch for changes to your JavaScript, HTML and LESS files and automatically rebuild them and run the Mocha test suite.

Try running gulp watch in one tab in your terminal program and then edit a LESS, HTML or JavaScript file and watch the page reload automatically. Sexy.

Note: You'll need to install the fb-flo browser extension for fb-flo to work. Make sure to have developers tools open with the flo extension enabled or it won't work properly.

Testing

This project uses Mocha test runner and should.js assertion library for writing tests. See the spec folder for examples of testing the frontend and backend codebases.

TODO

• Model/form validation (https://github.com/insin/newforms ?)
• Griddle tables
• Jest test suite
• Login component
• JSfmt
• WebPack/Ugilfy
• Auth (passport)
• Procfile
• Server rendering of React views

Credits

Built by Dana Woodman and the rest of the BIG team.

Credit also goes to the authors of all the amazing tools used in this project. Without people like them, we'd still be in the dark ages of technology.

License

This source code is released under a liberal MIT license (which means you can use it in commercial projects). See the LICENSE file for details.