Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ngduc/parcelui
Parcel + Typescript + React/Preact + Router + CSS Modules + SASS + Jest + Api-Now + Github Actions CI
https://github.com/ngduc/parcelui
css css-modules enzyme jest parcel parcel-bundler react react-router sass typescript
Last synced: about 1 month ago
JSON representation
Parcel + Typescript + React/Preact + Router + CSS Modules + SASS + Jest + Api-Now + Github Actions CI
- Host: GitHub
- URL: https://github.com/ngduc/parcelui
- Owner: ngduc
- License: mit
- Created: 2019-08-23T08:11:49.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2020-05-24T04:32:23.000Z (over 4 years ago)
- Last Synced: 2024-11-14T16:17:57.762Z (about 1 month ago)
- Topics: css, css-modules, enzyme, jest, parcel, parcel-bundler, react, react-router, sass, typescript
- Language: TypeScript
- Homepage:
- Size: 2.42 MB
- Stars: 35
- Watchers: 3
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-parcel - React + TypeScript + CSS Modules + SASS - Boilerplate to create a webapp with: React + TypeScript + CSS Modules + SASS. (Examples)
README
# 🚀 Parcel UI
[](https://travis-ci.org/ngduc/parcelui)
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](https://github.com/ngduc/api-now).
### 🔧 Installation
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/
### ⚙️ Commands
```
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)
```
### CSS
- SCSS is recommended, but optional. You can also use ".css" files normally.
### Github Actions CI
- .github/workflows.ci.yml - build, deploy (vercel), cleanup.
### Others
Recommend:
- [React syntax](https://syntax.wiki)
- VSCode & prettier addon
