shayans2/awesome-react-typescript-boilerplate

A boilerplate for React applications with all the latest and greatest technologies and practices 🏎

Awesome React TypeScript boilerplate

A boilerplate for React applications with all the latest and greatest technologies and practices.

Table of content

---

• Core Technologies
• Prerequisites
• Getting started
• Testing
• Useful scripts

🏎 Core technologies

• Typescript

• Hooks

• Code-Splitting with Lazy and Suspense

• Error Boundaries

• React Router DOM

• Connected React Router

• Redux

• Redux Thunk

• Immer

• react-i18next

• Selector

🖍️ Style

• SCSS
• 7-1 Pattern
• BEM Architecture

🛠 Build tools

• Webpack
• Babel

🔥 Rapid development workflow

• React Hot Loader
• Redux DevTools
• Redux Logger

💎 Rich utilities: Git hooks and code formatting

• Prettier
• Husky
• Lint-staged
• TSLint

🛡 Testing

• Jest
• react-testing-library

🏆 Contious integration

• TravisCI

📲 Networking

• Axios

🎁 Other NPM modules

• DotEnv

Prerequisites

---

• NodeJS.
• IDE of your choice.
• Command Line Tools.

Getting started

---

Install dependencies

  npm install

Start development server

  npm start

Testing

---

Run test suites:

  npm run test

In watch mode:

  npm run test:watch

Useful scripts

---

Format code and write based on Prettier rules

  npm run format

Analyse Webpack bundles

Development bundle

  npm run analyze:dev

Production bundle

  npm run analyze:prod