Skip to main content
grasp.study
About
Explore
Pricing
Log in
Try it for free
Back to course
👋
Welcome to a Grasp lesson
Create a free account
to keep studying and create your own study path.
Full-stack web development with Vue.js
·
Module 7
Vue.js: Foundations and Reactivity
1
Vue 3 Project Setup and Folder Structure
Set up a Vue 3 project using create-vue (Vite) and describe the project folder structure.
2
Composition API with `<script setup>`
Create a Vue component using the Composition API with <script setup> syntax.
3
Vue Reactivity: ref() and reactive() for State Management
Manage component state using ref() and reactive(), explaining Vue's reactivity system.
4
Core Directives: Logic & Interactivity
Use core directives (v-if, v-for, v-bind, v-on) for conditional rendering, list rendering, and event handling.
5
Two-Way Binding with v-model
Implement two-way data binding on form inputs using v-model.
Computed Properties: Derived Reactive Values
Define and use computed properties to create derived reactive values from existing state.
7
Building a To-Do List Application
Mini Project: Build a to-do list application that allows adding and displaying tasks.
Previous module
Modern CSS with Tailwind
Next module
Vue.js: Building with Components