- Requires npm version
>= 7.20.0. Install the latest npm using command
npm install -g npm@latest.
What it contains
- ReactJS support with TypeScript
- Testing support using Jest and React Testing Library
- Formatting support using Prettier
- ESLint support
- Ability to collect code coverage via Jest
- Support for Storybook
yarn installto install dependencies.
yarn startto develop locally.
yarn testto test and see the code coverage.
yarn buildto create a production build.
yarn build-for-pwato create a production build and generate
yarn start:prodto serve production build on port
yarn create:start:prodto create and start a production build.
yarn storybookto start storybook in development mode.
yarn build-storybookto create production build for storybook.
npx -y serve storybook-static -l 5858to serve production build for storybook on port
A note about routing
Since this is a React Single Page Application (SPA), you may find that if you refresh the page for a URL other than
/ in production build
that you get
404 message. This is because when you refresh the page at a deeper URL, your client-side router (
react-router) in this project
has not got chance to load and handle routing. Therefore, since your do not have a server (in this project), you
A nice explanation is available on this stackoverflow answer
There are 2 places we need to resolve this problem - at production build hosted locally, and production build hosted on provider.
Production build hosted locally
This project uses
serve which has a flag
-s (Github). This flag re-writes all non-found
/, which kicks off the client-side router, hence making URL
Production build hosted on Vercel (provider)
This project is hosted on Vercel, so we needed to write a configuration called
vercel.json, which is
If you are using Firebase Hosting, refer to their documentation on how to configure re-writes.
For other provides, I encourage folks to update this documentation by opening up a PR. If you do, please provide the reference to the official documentation.