Starter Project for React using TypeScript that allows customization of all components. Dedicated to my projects. Maybe it works for you as well :)
npm init react-ts-web-starter
This project goal is to learn and explore modern frontend technologies and serve as a base for my personal projects since I prefer to control mostly libs involved (for some reason 🙄).
create-react-app might be a better choice for most cases, but if you like the project, check below how to use it :)
www.npmjs.com/package/create-react-ts-web-starter
A new React project can be bootstrapped using this repository as a template using the following command:
npm init react-ts-web-starter
Without parameters, the project will be created on a folder my-app in the same directory where you executed the command.
All parameters available:
--destination=<FOLDER_DESTINATION> Defaults to the current directory
--app=<APP_NAME> Defaults to my-app
The final folder will be the parameter destination
concatenated with the parameter app
.
NPM is the project package manager.
Run the following command to install dependencies and prepare the environment with Git hooks:
npm i
npm start
make up
npm run build
make dist
WebPack is the module bundler used here.
Some build configurations can be changed using environment variables. These variables can also be set using DotEnv. Just place a .env on project root dir and modify the
values
you want.
Check this Joi schema to see all variables and their respective default and allowed values.
Jest and Playwright are the testing frameworks for this project.
Check the jest.config.ts and playwright.config.ts configuration files.
The mix of tools used to ensure code and commit style and best practices:
- ESLint
- Prettier
- Stylelint
- Commitlint
- Lint Staged
- Husky
- GitHub Actions for continuous integration
- Codecov for test coverage reports
- Codacy and CodeClimate for code analysis
Check the Makefile for some useful commands.
Execute make
to show the help.