Create React App example with Material-UI, TypeScript, Redux and Routing
This is a new verison with React Hooks, Material-UI 4 and React-Redux 7 (with hooks!). We use this template for all our new projects. If you want to bootstrap a project with the classic approach without hooks but with class components, you are welcome to use the previous version.
Inspired by:
Contains
- Material-UI
- Typescript
- React
- Redux
- Redux-Thunk
- Redux-Persist
- React Router
- Redux DevTools Extension
- TodoMVC example
- PWA Support
Roadmap
- Make function based components and use hooks for state etc.
- Implement Material-UIs new styling solution based on hooks
- use react-redux hooks
- Hot Reloading -> Waiting for official support of react-scripts
How to use
Download or clone this repo
git clone https://github.com/innFactory/create-react-app-material-typescript-redux
cd create-react-app-material-typescript-redux
Install it and run:
npm i
npm start
Enable PWA ServiceWorker [OPTIONAL]
Just comment in the following line in the index.tsx:
// registerServiceWorker();
to
registerServiceWorker();
Enable Prettier [OPTIONAL]
- Step: Install the Prettier plugin (e.g. the one of Esben Petersen)
- Add the following snippet to your settings in VSCode:
"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
"source.organizeImports": true // optional
},
Enable project snippets [OPTIONAL]
Just install following extension:
After that you can start to type fcomp (for function component) and you get a template for a new component.
The idea behind the example
This example demonstrate how you can use Create React App with TypeScript.
Contributors
Powered by innFactory