How to implement common patterns in each of these popular frameworks:
- Vue (+ Nuxt) → vue.webpro.now.sh
- Angular → angular.webpro.now.sh
- React (+ Next) → react.webpro.now.sh
- Svelte (+ Sapper)
Nuxt/Next/Sapper are included, as they solve things like routing and SSR out of the box.
- PWA (Lighthouse: 💯)
- List + detail view
- Dynamic routing + code-splitting
- SSR
- Global CSS
- Based on 7GUIs → CRUD
- Manage state with CRUD (create, read, update, delete) operations
- The Svelte CRUD example
| Feature | Vue | Angular | React | Svelte |
|---|---|---|---|---|
| Hacker News | ✔ | ✔ | ✔ | ✔ |
| CRUD | ✔ | x | ✔ | ✔ |
| Form | x | x | x | x |
| ...? | x | x | x | x |
| ...? | x | x | x | x |
Each framework has its own folder, and the same npm commands.
git clone https://github.com/webpro/vars.git
cd vars
cd [angular|react|svelte|vue]
npm install
npm run dev # development
npm run build # create production build
npm start # run production build