Jump Start with Vue 3

Beginner

48 Lessons

16h

Certificate of Completion

AI-POWERED

Explanations

This course includes

1 Project

48 Playgrounds

6 Quizzes

30 Illustrations

This course includes

1 Project

48 Playgrounds

6 Quizzes

30 Illustrations

Course Overview

Vue 3 brings forth an improved reactivity system, introduces the Composition API for organizing component logic in a modular fashion, enhances performance with a fresh virtual DOM and offers enhanced TypeScript integration. These enhancements position Vue 3 as an appealing option for constructing contemporary, scalable, and easily maintainable web applications. In this course, you’ll cover the fundamental concepts of Vue 3. You’ll start with learning the fundamentals of Vue.js, such as Vue instance, templ...Show More

What You'll Learn

An understanding of Vue instance, template syntax, interpolations, methods, computed properties, and directives

Proficiency in using Vue components, custom components, component options, and component lifecycle

Working knowledge of routes, navigation, and navigation guards in Vue

Proficiency in Vuex state management: state, getters, mutations, and actions

Hands-on experience with Nuxt.js like Nuxt component options, assets, store, middleware, and plugins

Course Content

Vue 3 Overview

Introduction to the Course

Vue.js: The Basics

Vue 3 Fundamentals: Setup, Instances, and Reactive Data Templates and Dynamic Interpolations Template Syntax: Directives Methods and Computed Properties Quiz: Vue Basics Challenge: Create a Simple To-Do List App

Components

General and Custom Components Component Options Component Lifecycle Methods Props and Default Properties Communication with the Parent Component Named and Scoped Slots Quiz: Components Challenge: Creating a Reusable Universal List Component

The Composition API

The setup() Function Dealing with Data: ref() and reactive()Computed and Watched Values Lifecycle Hooks Quiz: The Composition API Challenge: The Composition API

Routing

Routes Navigation Navigation Guards Example: Authorized Routes Quiz: Routing Challenge: Create a Minimal Blog Engine Using Vue Router

State Management

6 Lessons

Nuxt.js

6 Lessons

Staff Navigator App

Project

Wrapping Up

1 Lesson

Appendix

8 Lessons

COURSE AUTHOR

How You'll Learn

You don’t get better at swimming by watching others. Coding is no different. Practice as you learn with live code environments inside your browser.

Videos are holding you back. Educative‘s interactive, text-based lessons accelerate learning — no setup, downloads, or alt-tabbing required.

Learn faster and smarter with adaptive AI tools embedded in every Educative course.

Built-in assessments let you test your skills. Completion certificates let you show them off.

Recommended Courses

BEFORE STARTING THIS COURSE

AFTER FINISHING THIS COURSE

FOR TEAMS

Interested in this course for your business or team?

Unlock this course (and 1,000+ more) for your entire org with DevPath