Day 1: The Vue Way - Introduction & Setup
Start your Vue 3 journey. Learn how Vue differs from React, set up a Vite project, and explore the Single File Component (SFC).
Day 2: Reactivity Core - ref() vs reactive()
Master the engine of Vue. Understanding ref, reactive, and how to bind data to your template.
Day 3: Logic & Control Flow
Control what appears on screen. Master v-if, v-else, v-show, and rendering lists with v-for.
Day 4: User Interaction - Events & Forms
Make your app interactive. Deep dive into event listeners, modifiers, and the magic of v-model for form handling.
Day 5: Computed Properties & Watchers
Don't clutter your template with logic. Learn to use computed properties for derived state and watchers for side effects.
Day 6: Lifecycle Hooks & Template Refs
Tap into the component lifecycle. Learn when to fetch data, destroy timers, and how to access raw DOM elements.
Day 7: Component Basics - Props & Events
The core of Vue architecture. Learn One-Way Data Flow, passing props down, and emitting events up.
Day 8: Slots & Dynamic Components
Flexibility is key. Learn how to inject content into components using Slots and switch components on the fly.
Day 9: Reusability with Composables
The superpower of Vue 3. Learn to extract and reuse stateful logic with Composables (custom hooks).
Day 10: Vue Router Fundamentals
Navigate the Single Page App (SPA). Learn to set up Vue Router, link pages, and render views.
Day 11: Dynamic Routing & Guards
Advanced Vue Router. Master dynamic paths, route parameters, and protecting routes with navigation guards.
Day 12: State Management with Pinia
Goodbye Vuex, Hello Pinia. Learn the modern, type-safe way to manage global state in Vue applications.
Day 13: Handling Async State
Dealing with the real world. Learn how to handle API calls, loading states, and the experimental Suspense feature.
Day 14: Final Project - Task Master
The Graduation Ceremony. Build a complete Task Management application integrating everything you've learned.