I've been using create-react-app
for React project initialization for a while. And I've been using Material-UI React components library for a while. Also, I've been using eslint
and prettier
for enforcement of coding style for a while.
The thing is, it's been kinda cumbersome for initial set up that before I can actually starting building something meaningful.
I will have to finish following steps before I can write the React component code:
- Run
create-react-app
to initialize the project. npm install
andnpm install -D
dependency- Create
.eslintrc.json
and.prettierrc
and make ESLint and Prettier work together properly. - This is annoying. - Delete unnecessary files such as
index.css
,App.css
- I use JSS which is built into Material-UI and only one tiny SCSS file for template HTML. - Create directories under
src/
-assets/
,components/
,hooks/
,pages/
. Potentiallyredux/
andservices/
/graphql/
if any state management or external API calls are needed, which is the case for 95% of the time. - Add customized fonts and theme in
assets/styles/
- Basic router(
'/'
) and context provider set up inApp.js
Then I can finally write some components code.
So to simplify this workflow, I create this repo, to store pre-configured package.json
, .eslintrc.json
and .prettierrc
for now. Eventually I will have a shell script (maybe python script) to do this for me.