React/create-react-app/Redux/TravisCI/Heroku/VSCode/Jest/Enzyme/TDD

Simple project with best practices and conventions to develop a high quality React JS application. It is ready to use with TDD with the basic setup for unit, integration and end to end tests.

Based on this repository

Status
CI service Build Status
Tests Coverage Status

Live demo

View the live demo on Heroku or the individual UI components of my Storybook on Github Pages.

Tech stack

  • Create-react-app, which includes: React, JSX, ES6, Webpack, Babel and other amazing projects.
  • Prettier Code Formatter + ESLint setup with Airbnb's style guide + VSCode integration
  • Jest + Enzyme for tests, including @storybook/addon-storyshots to snapshot test my Storybook and puppeteer for e2e tests.
  • Storybook of my UI components
  • Travis CI to build the production bundles and deploy it to Heroku, run the tests, creating and publishing the test coverage report and the UI documentation as a Storybook on Github Pages.

Usage

  • Setup your repository based on this boilerplate repository following the instructions provided on the next sections.

Start the server

npm start

Debug the tests

Open Visual Studio and debug. Run the tests by default.

If you want to run the integration tests too, type from the terminal:

npm test -- --coverage --no-cache

Run the Storybook

npm run storybook

Then open http://localhost:9009/