Example Template: React App

This is my personal, opinionated template for how a nontrivial React app should be organized and configured.

This template is currently in progress.

New project setup

1. Create a new repository from this template: https://github.com/spautz/example-template-app/generate
2. ./scripts/prepare-new-app.sh to remove files that the app doesn't need
3. Find/replace occurrences of "spautz" and "example-template-app" to match the new repository

Commands

General setup

This is built on top of react-scripts / create-react-app. Running yarn install will install everything you need.

Most standard commands and scripts are available: yarn build, yarn clean, yarn test, yarn start, yarn storybook, etc. See package.json for the full list.

Batch commands

There are also several batch commands to run useful groups of those scripts:

• yarn dev runs some quick "check the code" tools: prettier, eslint, typescript
• yarn dev:readonly runs the same tools as dev, but in read-only mode
• yarn all runs all the "check the code + app" tools, including tests and builds
• yarn all:readonly runs the same tools as all, but in read-only mode
• yarn test is an alias you can switch between watch mode and no-watch mode

Bash scripts

For more destructive operations and things outside of the repo:

• scripts/clean-everything.sh wipes ALL caches and temporary files. This includes global caches, so other projects will be affected.
• scripts/build-everything.sh runs ALL setup and build commands for the project.
• scripts/full-ci.sh does some environment checks and then runs a ci script

Docs

The opinions and experiences which shaped this template are written up under docs/.

• Scripts and commands
• src directory structure (long)