React + Scss + MUI + Formik + Yup + Typescript + Prettier + Eslint + i18n + Webpack

Packages in template:

• TypeScript

• React.js (v18)

• React-router-dom (v6)

• SCSS and MUI

• Axios

• Formik

• Yup Validator

• Lodash

• Code styles: prettier, eslint

• Pre-commit: husky

• Auto format when save prettier

How to use

Script	Description
npm i	Installs all packages.
npm start	Runs the app in the development mode.
npm run build	Builds the app for production to the build folder.

Environment

First, you need define key with prefix REACT_APP_[YOUR_KEY]="YOUR_VALUE"

You can access your .env variables by deconstructing 'process.env.REACT_APP_[YOUR_KEY]' object, both on client and server. Just make sure that you reboot the server when updating .env file

Some snippet to let you code faster

genHooks genHooksInifiniteScroll genComponent genComponentTable genDialog

Some extension (VS Code) recommended

• Better Comments
• Auto Import
• Auto Rename Tag
• Bracket Pair Colorizer
• Color Highlight
• Eslint
• Prettier - Code formatter
• GitLens
• Import Cost
• vscode-icons
• Visual Studio IntelliCode