Prototyping with Vue Single File Component

on YouTube ↗37m

" summary

Demo shows Vue Single File Component used as a rapid notebook: a mini Vue SFC framework prescribes setup and coding style, serves files with vue serve in @vue/cli 3.0, and pushes real-time updates (sub-50ms style/script refresh) without full page reloads. Editor integration uses Vetur for completions and type validation in template with TypeScript. Output emits readable per-file scripts and performs simple no-bundle code splitting so prototypes run instantly and remain inspectable.

AI-written summary · about

" chapters (15)

1. 0:00Introduction
2. 0:40Bio
3. 1:18VS Code
4. 3:01Vetur
5. 4:20Atom/Vim/Emacs
6. 5:17Mini Demo
7. 7:39Type Validation in Template
8. 8:43TBH
9. 10:21Status quo of Prototyping
10. 10:56Problem with online prototyping
11. 12:22Problem with local prototyping
12. 13:55vue serve in @vuc/cli 3.0
13. 14:28Proun
14. 15:17Larger demo
15. 30:23Why?

" related talks

• 45mInside Vue ComponentsEvan You · Laracon EU 2017
• 36mRapid Prototyping with Vue.jsBermon Painter · Web Unleashed 2018
• 27mDemystifying the Dark Art of SFC CompilationRahul Kadyan · Connect.Tech 2018
• 32mVue, simple yet scalableEduardo San Martin Morote · Frontend Developer Love 2018
• 23mVue + Django: Combining Django Templates and Vue Single File Components without compromiseMike Hoolehan · DjangoCon US 2023
• 40mVue.js - developer friendly, fast and versatileAlexander Schwartz · Jfokus 2018
• 12mLet's Vue Like It's 1999Mike Dodge · Vueconf.US 2020
• 38mAn Introduction to the Vue EcosystemHassan Djirdeh · Web Unleashed 2019