@dbenfouzari/react-typescript-starter
v6.0.19
Published
2019/07/16 - Redone all with new best practices. Removed all bad eslint rules etc. See diff at [Github](https://github.com/dbenfouzari/react-typescript-starter/compare/v5.1.1...v6.0.0)
Downloads
19
Readme
react-typescript-starter
2019/07/16 - Redone all with new best practices. Removed all bad eslint rules etc. See diff at Github
This project aims to simplify starting project. It contains so much useful things which are, in my opinion, useful to get a really robust application.
It contains :
- Docker
- docker-compose
- eslint
- jest
- commitlint
- etc...
Docker
My Dockerfile
is optimised to avoid useless build when no new dependencies were added, or when code did not update.
You can use the Makefile to build production app and run it
make build
make run
make build
This command will build project with default params.
Built image will be named react-typescript-starter-starter
and accessible port is 8080
.
make run
This one will run an nginx serving static build and expose it to default port 8080
.
docker-compose
I also included a docker-compose.yml file to ease up and down. To build and run development server simply run :
docker-compose up --build -d web
To build and run production server run :
docker-compose up --build -d web-prod
ESLint
I added custom plugins on top of initial ESLint configuration provided by create-react-app.
eslint-plugin-prettier
to ensure Prettier does not collide with ESLint rules
Prettier
Our code is automatically reformated when we save a file, or when we try to commit thanks to Prettier.
Final notes
Commands
You will find all available commands in package.json
.
Here the ones that you will use often :
yarn start
to start application if you don't use Docker
Lint :
yarn lint:js
to lint all application's JS files with ESLint. You can append--fix
if you want autofixyarn lint:js:changed
to lint ONLY changed JS filesyarn lint:css
to lint CSS-in-JS or CSS filesyarn lint:css:changed
to lint ONLY changed CSS-in-JS or CSS filesyarn lint
to lint all applicationyarn lint:changed
to lint all changed application files
... All commands are listed in package.json
and are pretty self-explanatory.
So I won't list them all here, cuz' they all are important and useful.
Contributions
We also lint your commit names thanks to conventional-commits
.
If commit content or commit name is not valid, we will be rejected.
So it helps you to keep maintainable code