0.1.0 • Published 7 years ago

react-redux-starter-app v0.1.0

Weekly downloads
3
License
MIT
Repository
github
Last release
7 years ago

Build Status

React Redux Starter App

This app is intended as an exemplar of how we like to build React apps. You can clone this, and start the app to see

It is built off the awesome React Redux Starter Kit, but unlike the starter kit, this repo is intended to be very opinionated.

We'll explain all our choices though and if you don't like them, just swap them out for something else!

What's Included?

  • React Redux, React Router (obviously)
  • Webpack & Babel (Un-changed from the starter kit, so all the same tasks work. See README-redux.md)
  • React Storybook - Separate your presentational components from your containers, then view your presentational components individually in an this cookbook-style app.
  • CSS Modules with SASS
  • Responsive grids with flex, via Bootstrap 4 - We use Bootstrap Loader to load only the normalize.css reset file, and the responsive grid classes. All other CSS should be written in your own CSS modules, but the grid classes are too handy not to use.

Setup Instructions

$ git clone https://github.com/DeloitteDigitalUK/react-redux-starter-app.git
$ cd react-redux-starter-app
$ npm install                   # Install project dependencies
$ npm start                     # Compile and launch

Common commands:

npm run <script>Description
startServes your app at localhost:3000. HMR will be enabled in development.
storybookLaunches React Storybook at localhost:9001, with HMR enabled.
compileCompiles the application to disk (~/dist by default).
devSame as npm start, but enables nodemon for the server as well.
dev:no-debugSame as npm run dev but disables devtool instrumentation.
testRuns unit tests with Karma and generates a coverage report.
test:devRuns Karma and watches for changes to re-run tests; does not generate coverage reports.
deployRuns linter, tests, and then, on success, compiles your application to disk.
deploy:devSame as deploy but overrides NODE_ENV to "development".
deploy:prodSame as deploy but overrides NODE_ENV to "production".
lintLint all .js files.
lint:fixLint and fix all .js files. Read more on this.

Bootstrap

We deliberately use as little of Bootstrap as possible. The grid functions and normalize.css are handy, but other than that, we'd rather write CSS modules with no outside dependency.

If you would like to use more of Bootstrap, edit the .bootstraprc file and enable the relevant modules.

If you want to enable any of the JavaScript features, look at Bootstrap Loader's setup instructions for some extra steps to take.