React Starter

A basic starter for a React App. I put this together to have something much more basic than Create React App.

What do you get?

TypeScript in both code and tests
Mock API
Docker based development and CI
Easy to upgrade individual packages
Simple build/bundling
Code quality like formatting, linting, coverage etc.

Included Libraries

Recommended Libraries

These libraries are not included, but recommended as needed

date-fns - Modern JavaScript date utility library
mantine - React components library with native dark theme support
remeda - The first "data-first" and "data-last" utility library designed especially for TypeScript.
zod - TypeScript-first schema validation with static type inference

Scaffolding a new project

Use ./scripts/scaffold-to to create a new project based on this starter.

Example:

# run from the root of this repo
./scripts/scaffold-to ~/my-new-project

This will create the ~/my-new-project dir and populate it with appropriate files.

Local Development

You can develop locally via Docker.

./scripts/dev

This will start a Bash session inside a container with development dependencies installed and the local source code mounted as a volume.

As an example try running:

npm run build

You can edit code on your local machine and re-run the command above (or any other command). The intent is to edit code from your local machine and operate on the code from within the container (compile etc.).

When you are done you can exit the container with ctrl + d.

Starting the development server

npm start

Open http://localhost:5174/

Running the tests

npm test

Runs the tests in watch mode.

Build the code

npm run build

Builds the code for distribution

Development without Docker

If you prefer to develop "on the metal" I would recommend using NVM.

Install nvm
nvm use
npm install

TODO:

Generate a new Vite react-ts app and configure this app in the same way
Use react-error-boundary
Clean up test coverage output to exclude unnecessary files like mocks