Overview

This product is a starting template or boilerplate for a front-end Typescript + React project. It was created by ejecting a create-react-app project and adding additional features. While the ejecting was done a couple of years ago in 2018 and may lack some recent features, it offers simplicity in updating, extending, and troubleshooting compared to more recent create-react-app versions. This boilerplate is ideal for quick prototyping or trying new versions of libraries, but for serious projects, it is recommended to use a non-ejected create-react-app, vite, Next-js, or Razzle.

Features

Typescript: Version 4.0.2
React: Version 16.13 with support for hooks
Redux: Optional integration, use the no-redux branch to avoid Redux
Jest + Enzyme: Installed with example basic tests included
connected-react-router: Supports navigation with Redux
TSLint: Custom rules to discourage certain practices like using "object" or "any" in a static typed language
TSLint errors: Displayed as warnings in the browser's console for better visibility
Prettier: Configured with pre-commit hooks to automatically fix files before commit
Webpack: Exposes Webpack configuration
Styled Components: Installed with an example theme for the project
CSS Modules: Configured as an alternative to Styled Components
PostCSS: Includes basic plugins to automatically transform CSS/SASS code for better cross-browser compatibility
Environment variables (.env) webpack plugin: Supports environment variables configuration
Axios: Installed with an example HTTP request function implemented using React hooks
HMR (Hot Module Replacement): Enables fast component reload during development

Summary

This product is a starting template for front-end Typescript + React projects. It offers simplicity in updating, extending, and troubleshooting compared to recent create-react-app versions. It includes features like Typescript, React with hooks support, Redux integration (optional), Jest + Enzyme for testing, connected-react-router for navigation with Redux, TSLint with custom rules, Prettier for code formatting, Webpack configuration, Styled Components and CSS Modules for styling, PostCSS for automatic CSS/SASS transformations, support for environment variables, Axios for HTTP requests, and HMR for fast component reload. The installation process involves running npm install and optionally installing TSLint and Prettier extensions for your text editor.

Fermmm

Boilerplate Typescript React Redux Webpack