Vue Chapter Index

Introduction

This index lists all 31 chapters in the Hello Code Vue track, grouped by topic. Use it to jump to a lesson or compare coverage with frontend/gen_article_plan/vue.md.

Prerequisites

None—this page is a map, not a lesson

Getting Started (01–03)

#	Chapter
01	What Is Vue
02	Environment and create-vue Project
03	First Vue Application and SFC

Templates and Reactivity (04–06)

#	Chapter
04	Template Syntax and Directives
05	Reactivity: ref and reactive
06	Computed and Watch

Style and Forms (07–08)

#	Chapter
07	Class, Style, and Transitions
08	Forms and v-model

Components (09–12)

#	Chapter
09	Components: Props and Emits
10	Slots
11	Lifecycle Hooks
12	Provide/Inject and Dynamic Components

Composables (13)

#	Chapter
13	Composables

Router (14–15)

#	Chapter
14	Vue Router Basics
15	Router Guards and Lazy Routes

State and API (16–18)

#	Chapter
16	Pinia State Management
17	Fetching API and CORS
18	TypeScript With Vue

Test, Build, and SSR (19–21)

#	Chapter
19	Testing Vue Components
20	Build, Preview, and Deploy
21	SSR and Nuxt Intro (optional read)

Performance (22)

#	Chapter
22	Performance and Best Practices

Projects (23–26)

#	Chapter
23	Project: Todo With Pinia
24	Project: Blog Reader With API
25	Project: Admin Dashboard With Auth
26	Project: Multi-Step Form (optional)

Operations and Wrap-Up (27–31)

#	Chapter
27	Vue Docker and CI (optional read)
28	Vue Troubleshooting
29	Resources and Book Recommendations
30	Learning Paths and Wrap-Up
31	Vue Chapter Index (this page)

Suggested Learning Paths

API-ready SPA: 01 → 03 → 05 → 09 → 14 → 16 → 17 → 24

Systematic: 01–20 → 23–25 → 28–31

Full-stack: Vue 17, 24, 25 + FastAPI or Django REST + Git CI

From vanilla JS: DOM in JavaScript → 01–06

Track Metadata

Logo: /category-logos/vue.png
Plan file: frontend/gen_article_plan/vue.md
Article guidelines: frontend/GEN_ARTICLE_ROLE.md

Cross-Track Links

Need	Hello Code track
JavaScript basics	JavaScript
TypeScript types	TypeScript
REST API backend	FastAPI, Flask, Django
SPA deploy	Nginx
Styling / a11y	CSS

FAQ

Where do I start?

What Is Vue, then Environment and create-vue Project.

Is chapter 21 required?

No—SSR/Nuxt is optional unless you need SEO or server rendering.

Is chapter 26 required?

No—multi-step form is optional practice for forms and slots.

Skip Docker (27)?

Yes for pure frontend learning; read it before production deploy with Compose.

Vue vs React on Hello Code?

Vue has a full 31-chapter track; React is covered via JS/TS + external docs—see What Is Vue comparison table.

PostgreSQL blog schema?

Align Blog reader with PostgreSQL blog project.