hanse/asamoah

Opinionated frontend setup for Browserify, React, stylus, nib and GNU Make.

Opinionated frontend setup for Browserify, stylus, nib and GNU Make.

An opinionated setup for frontend development using Browserify, React, stylus, nib, GNU Make and git.

Getting Started

You will need to have node.js and npm installed. In addition, you should have python available for the development server.

$ git clone https://github.com/Hanse/asamoah
$ cd asamoah
$ rm -rf .git
$ git init
$ git add .
$ git commit -m "Initial commit"
$ npm install

Build the JS and CSS files by running

$ make

Try it in your browser

$ PORT=2345 make server
-> Server running on localhost:2345

Directory structure

All uncompiled JS and CSS/Stylus assets reside in the assets/ directory. They are by default compiled into public/app.js and public/app.css respectively. This can be changed in the Makefile. Having compiled files in the public directory makes it trivial to serve this folder from nginx without serving the source files for example.

Re-running make

It can be cumbersome to run make for every change. A way to solve this is to use visionmedia/watch for periodical runs combined with something that can run a Procfile. Having these installed, you can run:

$ make watch

The Procfile solution is used to easily capture output from both watchify and the css watch stuff at the same time.

Compress JS and CSS files

JS and CSS files are by default compressed when NODE_ENV is set to something other than development.

$ NODE_ENV=production make

License

MIT