Vue 3 Essentials Course
Build Your First Vue 3 Project And Learn The Core Vue Concepts!
Learn the fundamentals of Vue 3 from creating your application using Vite all the way to building and deploying your final application.
We'll take you step-by-step through the process of building a complete Vue 3 app. Covering topics like the Composition API, lifecycle hooks, data, and tons more!
Most importantly, you'll get access to all the code in Github repos and there is no off-screen coding so you'll be learning everything you need!
Register Now - $30 What We're Building!
Already a student? Log in here
Start Your Vue Journey For Just $30
The Vue 3 Essentials Course is the perfect resource for new Vue developers or Vue developers looking to get more familiar with Vue 3.
In this course, we’ll cover topics like:
- Creating your Vue app with Vite - the new build tool from the creators of Vue.
- The Composition API and the Options API
- Coding Single File Components with Vue’s most important directives
- The basics of Vue Router
-
New Vue 3 features like
<teleport>and writing reusable composable functions -
Adding
<slots>and<transitions>to your Vite App - Building and deploying your app
- Much, much, more..
In our project, we’re going to be making a Recipe App by querying the free MealDB database. Here’s one of the pages that this course will teach you how to build.
The goal of the Vue 3 Essentials Course is to teach you both Vue and the main new features in Vue 3, but also to help you understand the core code and design principles you need to build your Vue apps.
Why The Vue 3 Essentials Course?
- Learn up-to-date Vue 3 code
- Start from scratch and get step-by-step instructions
- NO off-screen code so you don't miss anything!
- 2+ hours of perfectly-paced content; not too fast, not boringly slow
- Get access to the code repo at each step!
Prerequisites
- Some experience with Javascript
- Some experience with HTML/CSS
- NO experience with Vue is required
Course Curriculum
We want to make sure you're getting value from this course. Here's exactly what our Vue 3 Essentials Course offers.
| Chapter 1: Getting Situated in our Vue Environment |
| Touring Our Course Project – Recipe Finder App (2:48) |
| Creating Our Vue 3 App with Vite (6:59) |
| Our First Vue Component – SiteHeader.vue (8:53) |
| Chapter 2: Building Our Home Page in Vue 3 |
| Building Our Home Page with the Options API (7:07) |
| Fetching, Processing, and Displaying Results from the MealDB (9:18) |
| Creating Recipe Cards with Custom Prop Validation (9:06) |
| Filtering Our Search Results using <select> (6:37) |
| Converting Home.vue to the Composition API (8:58) |
| Chapter 3: Adding Our Recipe Page with Vue Router |
| Setting Up Vue Router in Vite (8:45) |
| Creating Our Recipe Page – Accessing and Parsing Data (8:49) |
| Creating Our Recipe Page – Template and Styles (8:16) |
| Building a Popup with Vue 3 <teleport> (10:57) |
| A Deeper Dive into the Composition API (6:59) |
| Chapter 4: Adding More Functionality with Essential Vue Features |
| Using Vue Router to Save Search History (5:57) |
| Using VueUse and Template Refs to Close Our Popup (5:25) |
| Using Vue <slots> to Create More Reusable Components (5:00) |
| Displaying a No Results Section with v-else (2:20) |
| Adding Animations with Vue <transition> (6:01) |
| Chapter 5: Finishing Up |
| Building & Deploying Our App to Github Pages (5:50) |
| Wrapping Up Our Course – Future Directions, Final Words (3:41) |
So what are you waiting for? Start learning today!