React Gold

Skeleton SPA; ready for production.

Tech Stack: React, Synthetic-Redux (Redux + Redux-Saga), Material-UI, React Testing Library, Jest, ESLint, Docker, CircleCI

This project was bootstrapped with Create React App.

Dive right in npm start

Runs the app in the development mode.
Open http://localhost:4140 to view it in the browser.

Code organization

1. apiUrls.js -> API endpoints organized as exported consts per application feature
2. redux: Types.js - 1 action type per action (synthetic redux dynamically creates error and success type)
3. /pages -> Each feature is an app directory. The page handles the API communication & error handling
4. /pages/.redux.js -> Synthetic Redux configuration for the page
5. /components -> Each feature has multiple pure components orchestrated by one pure component
6. /components/common -> Common ReactJS components
7. Theme.js -> Material UI Opinions & Overrides
8. Tests -> unit: For services, redux functions
9. Tests -> integration: For React components

To recreate from scratch

npx create-react-app
npm i react-router-dom react-redux redux-saga 
npm install @material-ui/core @material-ui/icons ( Add appropriate Fonts in index.html)
npm i eslint eslint-config-airbnb eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react --save-dev