The README generated by Create React App was moved to README-CRA.md
Click here.
- Basics: React + React Router + React Helmet + Axios
- State management: Rematch (a better Redux)
- UI lib: Bulma + Font Awesome 5
- Get rid of
../../../by link-module-alias - Auto polyfill for old browsers, powered by Polyfill.io
$ git clone https://github.com/kenberkeley/tmdb-react.git
$ cd tmdb-react/
# Install dependencies
$ npm i
# Run!
$ npm startThen open http:https://localhost:3000
For the whole project structure, please turn to Folder Structure (CRA Doc).
Only src/ will be elaborated below.
# Trivial folders/files had been omitted
src/
├── assets/
├── constants/ # All global scope keys (URL query, storage, etc) should go here to avoid name collisions
├── layouts/
│ └── default/
│ ├── comps/ # Use by default layout only
│ │ └── Header.js
│ └── index.js
├── pages/
│ ├── home/
│ │ ├── comps/ # Use by home page only
│ │ └── index.js
│ ├── watchlist/
│ │ ├── comps/
│ │ └── index.js
│ └── index.js # routes config
├── store/ # https://github.com/rematch/rematch
│ ├── models/
│ └── index.js
├── types/ # Centralized proptypes (https://bit.ly/2G3V6Ou)
├── utils/
├── App.js
└── index.js
Reference:
- Folder-by-type or Folder-by-feature (Stack Exchange)
- How to better organize your React applications? (Medium)
- Why using nested connect(react-redux) components is good? (Medium)
$ npm run deployCheck out Deployment (CRA Doc) for more information.
- Testings (Unit & E2E)
- Responsive layout