# React Architecture

## Starter

- [Create React App](https://create-react-app.dev/)
- [React](https://reactjs.org/)
- [Webpack](https://webpack.js.org/)

## Preprocessors

- [TypeScript](https://www.typescriptlang.org/)
- [Sass](https://sass-lang.com/)
- TSX

## CSS architecture

- [CSS modules](https://github.com/css-modules/css-modules)
- [Sass guidelines](https://sass-guidelin.es/)
- [Atomic design](https://bradfrost.com/blog/post/atomic-web-design/)

## CSS layout

- [Flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
- [CSS Grid](https://css-tricks.com/snippets/css/complete-guide-grid/)

## UI Components

- Library: [Material UI](https://material-ui.com/)
- Explorer: [Storybook](https://storybook.js.org/)

## JavaScript standard library

- Utility library: [Lodash](https://lodash.com/)
- Async: [RxJS](https://rxjs-dev.firebaseapp.com/)
- Polyfills: [CoreJS](https://github.com/zloirock/core-js)
- RxJS

## Router

- [React router](https://reactrouter.com/)

## State

- State management: [Redux](https://redux.js.org/)
- State mutation: [Immer](https://immerjs.github.io/immer/docs/introduction)

## Ajax

- [RxJS.ajax](https://rxjs-dev.firebaseapp.com/api/ajax/ajax)
- Interceptors
- [Redux Observable](https://redux-observable.js.org/)

## Business rules

- [Custom Hooks](https://reactjs.org/docs/hooks-custom.html)

## Code quality

- [Editorconfig](https://editorconfig.org/)
- Code formatter: [Prettier](https://prettier.io/)
- Linter: [ESLint](https://eslint.org/)
- Git hooks: [Husky](https://github.com/typicode/husky)

## Unit testing

- [Jest](https://jestjs.io/)
- [Marble testing](https://rxjs-dev.firebaseapp.com/guide/testing/marble-testing)

## Backend

- Rest API: [Express](http://expressjs.com/)
- Database: [LowDB](https://github.com/typicode/lowdb)
- API documentation: [Swagger](https://swagger.io/docs/open-source-tools/swagger-ui/usage/installation/)

## CI / CD

- [Gitflow](https://nvie.com/posts/a-successful-git-branching-model/)
- [Docker](https://www.docker.com/)
- [Github pages](https://pages.github.com/)
- Travis CI / Circle CI / Github actions