/React-Redux-ES6-Webpack-Boilerplate

Primary LanguageCSS

React+Redux/ES6/Pug/Webpack Boilerplate

This is a heavily modified repo based off Kliment Petrov's excellent work (which can be found here), but heavily restructured to be easier to read and understand. I prefer Vue over React for its readability, structure and syntax and tried to impose that order on this boilerplate.

This repo includes the same as stuff included in Petrov's build, namely:

  • React 16.3.2
  • ECMAScript 6 and JSX support
  • React Router v4
  • Component testing using Enzyme and Jest
  • Code Coveragenp
  • Latest Webpack (v.3.11.0) and Webpack Dev Server (v.2.9.5) with Scope Hoisting enabled
  • Hot Module Replacement using react-hot-loader
  • ES6 linting with continuous linting on file change
  • SASS support
  • Separate CSS stylesheets generation
  • Automatic HTML generation
  • Production Config
  • Custom Babel Preset with Decorators, Class Properties, Rest/Spread operator support

In addition:

  • Redux 4.x added
  • Pug added
  • Express 4 Support
  • Demo components
  • Reduced complexity for easy learning
  • Bulma CSS (can remove or replace easily)

Preview

Click here

Available Commands

  • npm start - start the dev server
  • npm clean - delete the dist folder
  • npm run production - create a production ready build in dist folder
  • npm run lint - execute an eslint check
  • npm test - run all tests
  • npm run test:watch - run all tests in watch mode
  • npm run coverage - generate code coverage report in the coverage folder

Starting the dev server

$ npm run dev

Build and Preview

$ npm run production
$ gulp 
// open browser, go to:  http://localhost:3030/