Rocket screenshot

Rocket

Author Avatar Theme by Alexsergey
Updated: 14 Jan 2016
79 Stars

Boilerplate for React and Backbone

Overview:

This is a test boilerplate for creating a single page application using React, Babel, Backbone, Node, and MongoDB. The application connects to a server using RESTful service and allows users to create works and descriptions from it. The project uses various tools and frameworks for building, testing, and documentation.

Features:

  • Gulp: Build system
  • NPM: Package manager
  • Browserify: CommonJS in the browser
  • Babel: Transpile ES6 (including JSX) to ES5
  • babelify: Babel transform for Browserify
  • React: React framework
  • Backbone: Backbone framework
  • react.backbone: Connect Backbone model and collection to React
  • wolfy87-eventemitter: Publish Subscriber module
  • react-router: A complete routing library for React
  • Mocha: Testing framework
  • Chai: Assertion library
  • Sinon: Mocking library
  • jsdom: Server side DOM
  • jsdoc: Documentation generator with custom theme and settings
  • Node: Platform for building fast, scalable network applications
  • Express: Fast, minimalist web framework for Node.js
  • MongoDB: Cross-platform document-oriented NoSQL database
  • Mongoose: Elegant MongoDB object modeling for Node.js
  • Winston: Multi-transport async logging library for Node.js

Installation:

To install the theme, follow these steps:

  1. In the main directory, run the following command:
npm install
  1. In the server directory, run the following command:
npm install
  1. Build the project to the development version by running the following command in the main directory:
gulp build-dev
  1. Build the project to the production version (uglify, slice console.logs and debuggers) by running the following command in the main directory:
gulp build-prod
  1. Watch and run the server by running the following command in the main directory:
gulp watch-server
  1. Generate JSDoc documentation, supporting JSX files, by running the following command in the main directory:
gulp generate-docs
  1. Scan for JSHint errors by running the following command in the main directory:
gulp jshint
  1. Check for JS errors. If everything is done correctly, the project will be deployed to FTP. Run the following command in the main directory:
gulp deploy
  1. Build the test files by running the following command in the main directory:
gulp build-test
  1. Apply test watcher by running the following command in the main directory:
gulp watch-test

Important: The documentation builder has a bug where you cannot use arrow functions and the this symbol inside strings. Refer to ‘show_test_results.html’ to see all tests after the build.

To change the configuration and add custom things, you need to modify the gulpfile.js, task folder, and config in the task folder.

Summary:

This test boilerplate provides a comprehensive setup for creating a single page application using React, Babel, Backbone, Node, and MongoDB. It includes various tools and frameworks for building, testing, and documentation. The installation guide provides step-by-step instructions for setting up the project and customizing the configuration.