Skip to content
Go to file
This branch is even with jeffbski:master.

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time

JSConf 2015 React.js Training Workshop Code (Windows version)

This is the starter code for the Introduction / Getting started with React.js training workshop at JSConf 2015

This boilerplate is specifically for Windows users. Non-windows users should see

This boilerplate code has these features:

  • Windows support - Tested on WinXP, should work on anything newer. Also works with msys (but not required). Only restriction is that it needs to use local drives, not network drives.
  • React.js JSX example which fetches from REST source and renders
  • simple build and auto rebuild (watch) using npm run scripts
  • browser-sync for auto reloading in browser on change
  • ES6/7 and JSX compiling to ES5 with babeljs
  • eslint for linting
  • browserify (w/babelify) for bundling javascript for the browser
  • watchify to automatically rebuild on changes
  • uglify for js minification
  • less CSS style compiler
  • autoprefixer for automatically adding css prefixes
  • cleancss for css minification
  • axios for promise based HTTP client


  • package.json - dependencies and build commands
  • public/index.html - main HTML
  • public/fake-api.json - mock REST api returning json data
  • src/browser.jsx - React.js JSX code which fetches REST data and renders into the main HTML
  • src/util/polyfill.js - Import any core-js or other polyfills here
  • assets/site.less - CSS styles used by site, edit or import into
  • bs-config.js - browser-sync config, set browser to launch, middleware implementing a REST api used for the app
  • dist/ - contains compiled and minified css and js


Change branches to iterate through implementing features for the solution.

git checkout stepX # iterate through solution

  • master / step0
    • initial starting boilerplate
    • working autobuild react.js / babel dev environment
  • step1
    • fetch /pools
    • display all questions
    • shuffle-array
    • display first shuffled poll w/choices
  • step2
    • Display poll as form
    • Post { YOUR_ID: IDX } to /polls/${id}
    • that Returns poll result, display poll result
    • Use PieChart from react-d3-components to display
  • step3
    • Use state to display first poll
    • Use state to hold shuffled polls
    • Add next survey button which shifts poll
    • setState trigger update to show new poll
  • step4 / final
    • Add admin.html
    • Add conditional logic location.pathname = '/admin.html'
    • fetch /admin/polls, display all
    • Add question form
    • post { question: 'What', choices: [ 'Foo', 'Bar'] } to /polls


  • My default browser for browser-sync is Google Chrome, if you want to use a different browser like Google Chrome Canary or Mozilla Firefox edit bs-config.js


Requires node.js/iojs >= 0.10

npm install ## install dependent node modules


Primary use - auto build and reload browser

npm run watch # build and watch, auto recompile and load changes
# use control-c to exit the autobuild watch

Build only

npm run build # build only

Build for Production

npm run prod-build # sets NODE_ENV=production then builds

More info



JSConf 2015 React.js training workshop (Windows version)




No releases published


No packages published
You can’t perform that action at this time.