- Full stack ES8+ with Babel
- Node LTS support (verified working on 8.x, 10.x and 12.x LTS releases)
- Express server
- React client with Webpack
- Linting with ESLint
- Unit and integration testing with Jest (and SuperTest)
- E2E testing with Cypress
- Dev mode (watch modes for client and server, proxy to avoid CORS issues)
- Production build (single deployment artifact, React loaded via CDN)
- Travis pipeline
- CircleCI pipeline
- Heroku deployment
- Cloud Foundry deployment
- Docker build
Various scripts are provided in the package file, but many are helpers for other scripts; here are the ones you'll commonly use:
dev: starts the frontend and backend in dev mode, with file watching (note that the backend runs on port 3100, and the frontend is proxied to it).
e2e: builds and starts the app in production mode and runs the Cypress tests against it.
e2e:dev: opens Cypress for local dev, instead of running it in the background. Doesn't start the app.
e2e:docker: runs the E2E tests using
docker-compose, as it runs in the
verify-*jobs in CircleCI. You can use
NODE_VERSIONto choose which Node image to run the app in (e.g.
NODE_VERSION=carbon npm run e2e:docker).
serve: builds and starts the app in production mode locally.
e2e; ideal before a
test: runs the Jest unit and integration tests.
test:watch: runs the unit and integration tests in watch mode.
Partly I wrote this to explore what things like Create React App (CRA) are doing under the hood with Babel and
Webpack. Partly it was to simplify a previous starter kit, so there aren't multiple package entry points complicating
the automation and it's not using
copy (which caused cross-platform issues on Windows).
- A single root ESLint configuration keeps the project's code consistent to minimise context switching
- Having Jest running once for the whole project means you can run
test:watchand see the tests related to changes anywhere in the codebase
- Less hidden "magic" config than when using CRA
- Simpler orchestration with a single NPM entry point
- The single
package.jsonis getting a bit unwieldy; there are 20+ scripts and it's unclear what part of the app each dev dependency is for
- Cypress only runs in Electron/Chrome (for a more cross-browser alternative, see Codecept)