Another project template for React

DEPRECATION WARNING: This is not maintained anymore, please use react-quickstart instead.

This is the minimal project template to get started with react-app-controller and react-app-middleware which provides server-side rendering, CommonJS modules in a browser (via browserify) and routing via History API while using express server-side.

Project structure

Project structure is the following:

├── README.md
├── package.json
├── client.js
└── server.js

Files client.js and server.js contain client and server code correspondingly.

Quickstart

To install dependencies:

% npm install

To start development execute:

% npm start

and edit client.js or server.js in your favourite text editor or IDE. Code will be automatically rebuilt after you made some changes.

If you encounter EMFILE error you can workaround it by raising the number of file descriptors allowed to be open:

% ulimit -n 10000

Doing XHR

You can XHR both on client and server (this package uses xhr2 node module to polyfill XHR API in Node.js). You can see how AboutPage defines fetchPage method for prefetching needed data.

Code size

The code size when minified and gzipped is pretty small:

% NODE_ENV=production browserify -r ./client.js:./app -t reactify \
  | uglifyjs -cm \
  | gzip \
  | wc -c
29270

It's slightly more than 29KB.