Parcel + Typescript + React/Preact + Router + CSS Modules + SASS + Jest + Api-Now + Github Actions CI
And more:
- Lazy loading (code splitting) for a page (Route).
- CSS scoping using CSS Modules: just import a local CSS or SASS file and use it.
- Store management with react-easy-state (easier than Redux, MobX).
- Component unit testing with Jest & Enzyme.
- Making Ajax requests using Whatwg-fetch Req with Mock APIs (json-server).
- Mock API server with api-now.
Clone this project:
git clone https://github.com/ngduc/parcelui.git your-app
cd your-app
rm -rf .git
yarn
- Update
package.json
with your information. - Run
yarn dev
then open http://localhost:1234/
yarn mock-api launch mock API Server using https://github.com/ngduc/api-now
yarn dev launch DEV mode takes 1.4s (tsc watch, parcel & mock-api)
yarn test:watch run jest --watch (auto run test files)
yarn build build for PROD to static directory ./dist
yarn serve serve static built dir "./dist" using api-now (or any web server)
- SCSS is recommended, but optional. You can also use ".css" files normally.
- .github/workflows.ci.yml - build, deploy (vercel), cleanup.
Recommend:
- React syntax
- VSCode & prettier addon