BEST

Front-end

Learn Vue.js 3 with Projects

Name: Learn Vue.js 3 with Projects
Price: 33000 KRW

We'll help you learn how to use Vue.js 3 and get familiar with it as you apply it to your projects.

(4.9) 98 reviews

945 learners

kossiecoder

Vue.js

Vuex

Web Application

Reviews from Early Learners

What you will learn!

Vue.js Composition API
Web App
How to create a project with Vue CLI
Vue 3 New Features
How to use Vue Router
How to use Vuex

Meet the latest Vue 3,
An easy and powerful introduction to front-end development!

Lecture Introduction

Popular front-end framework, Vue.js
Take a look at the latest version of Vue 3 ,
Try it out yourself and practice with your own hands!

This introductory course will help you get started with the popular front-end framework Vue.js. Using the new Composition API added to Vue.js 3, you'll learn the fundamental features needed to build a project, one by one, and immediately apply them to your own projects. Each video is short, with most videos lasting less than 10 minutes.

Expected Questions Q&A

Q. Can I take the course even if I don't know anything about Vue.js?
A. Yes! This is a Vue.js introductory course, so you can learn from the basics even if you don't know anything about it. By the end of this course, you'll have the basics to work on your own projects with Vue.js. However, I recommend that you already have a basic understanding of HTML, CSS, and Javascript (ES6+). There will also be explanations related to ES6+ throughout the course. 😊

Q. I watched the Vue.js 2 Basics tutorial on the Cozy Coder YouTube channel. Is it very different from this course?
A. The Vue.js 2 Basics course on YouTube only covers basic grammar, but its application to real-world projects is somewhat limited. This course covers Vue.js features and explains how to apply them to your projects. Specifically, this course uses the new Composition API in Vue.js 3. The explanations are much more detailed, helping you gain a comprehensive understanding of single-page applications. 😊

Q. What is the Composition API?
A. In Vue.js 2, we used the Options API for development, but it wasn't easy to reuse code when working on large-scale projects. So, in Vue.js 3, a new feature called the Composition API was added, facilitating logic reuse and code maintenance. 😊

Introduction to lecture materials

I've uploaded the source code at the end of each video as a branch on GitHub. If you get stuck with an error, you can compare the source code on GitHub. 😁 To make it easy to find, I've uploaded the video number as the branch name.

_{Cozy Coder GitHub (shortcut)}

Introduction of knowledge sharers

Cozy Coder

I work as a web developer in Australia and run the YouTube channel 'Cozy Coder'.
YouTube link: https://www.youtube.com/kossiecoder

Recommended for
these people

Who is this course right for?

For those who want to learn the basics of Vue.js 3
Anyone who wants to create a web app with Vue.js
Anyone who wants to develop using Composition Api
For those who are new to Vue.js

Need to know before starting?

HTML
CSS
Javascript

Hello
This is

1,288

Learners

132

Reviews

Answers

4.8

Rating

Courses

Curriculum

All

88 lectures ∙ (9hr 30min)

Section 1. Course Introduction and Development Environment Setup

3 lectures ∙ (17min)

1. 00 Course Introduction
05:55
2. 01 Installing a Vue Project
04:30
3. 02. Looking at the folder structure
06:35

Section 2. Create a To-Do Add Form

6 lectures ∙ (20min)

Section 3. Create a To-Do List

15 lectures ∙ (1hr 37min)

10. 08 Data Binding
08:44
11. 09 Two-way binding (v-model)
09:00
12. Add a new To-Do to the list 10
09:46
13. 11 Create To-Do Cards
04:17
14. 12 v-for
04:55
15. 13 v-show vs v-if
09:32
16. 14 Checkbox Binding
04:23
17. 15 class/style binding
06:03
18. 16 Deleting items from an array
05:57
19. 17 Creating Form Components
04:47
20. 18 emit
09:03
21. 19 props
07:17
22. Things to watch out for when using 20 props
06:59
23. 21 Delete To-Do
03:59
24. 22 emits
03:07

Section 4. To-Do Search Function

2 lectures ∙ (15min)

Section 5. Json-Server local development database

8 lectures ∙ (40min)

Section 6. Add Pagination

3 lectures ∙ (22min)

Section 7. Improved search function

5 lectures ∙ (40min)

Section 8. Getting Started with Vue Router

5 lectures ∙ (27min)

Section 9. Create a To-Do Edit Page

8 lectures ∙ (1hr 5min)

Section 10. Create a Toast Notification Component

4 lectures ∙ (38min)

Section 11. Create a To-Do creation page

4 lectures ∙ (24min)

Section 12. Scoped Style

1 lectures ∙ (4min)

Section 13. Toast animation applied and bugs fixed

2 lectures ∙ (8min)

Section 14. Create a modal window

4 lectures ∙ (30min)

Section 15. refactoring

8 lectures ∙ (47min)

Section 16. Using Vuex

7 lectures ∙ (57min)

Section 17. refactoring

2 lectures ∙ (12min)

Section 18. At the end of the course...

1 lectures ∙ (0min)

Published:

Last updated:

Reviews

All

98 reviews

4.9

98 reviews

zhwanhwang4538
Reviews 1
∙
Average Rating 5.0
5
100% enrolled
The instructor explains it well step by step. It was a great help to me to start something with the latest version of Vue3. Thank you.
- kossiecoder
  Instructor
  Thank you, Mr. Hwang Ji-hwan, for your course review ^^
canon48597291
Reviews 1
∙
Average Rating 5.0
5
100% enrolled
Like👍👍
durusk930845
Reviews 2
∙
Average Rating 5.0
5
100% enrolled
I really enjoyed learning the basic structure of Vue.js 3 and how to create components efficiently.
krrubric0041
Reviews 1
∙
Average Rating 5.0
5
100% enrolled
This was a great lecture! Please make an intermediate version too~
kjlee03287439
Reviews 2
∙
Average Rating 5.0
5
100% enrolled
great!

$26.40

kossiecoder's other courses

Check out other courses by the instructor!

Learn React.js with Projects

kossiecoder

You can learn React basics through blog projects.

초급

React, Redux, ES6

Learn React.js with Projects

kossiecoder

Similar courses

Explore other courses in the same field!

Getting Started with Vue 3

captain

This is a course for those who are starting with the latest version of Vue.js, Vue 3. Learn the operating principles of Vue.js and the basic concepts you need to know when developing in practice.

초급

Vue.js, Vue 3, JavaScript

Getting Started with Vue 3

captain

Kakao, Google SNS login (springboot3, vue3)

bradkim

Implementing Kakao and Google login using Spring Boot. JWT token-based login is implemented. A simple screen is configured through Vue3.

초급

OAuth, oauth2, JWT

Kakao, Google SNS login (springboot3, vue3)

bradkim

Vue.js Intermediate Course - Learn Vue.js, ES6, and Vuex by creating a web app

captain

Vue.js Intermediate Course - This is a Vue.js usage course that helps anyone create a 'great', 'easy', and 'excellent' web application. Based on a basic understanding of Vue.js, you will learn practical, code-centered knowledge by creating a Todo app.

중급이상

JavaScript, Vue.js, ES6

Vue.js Intermediate Course - Learn Vue.js, ES6, and Vuex by creating a web app

captain

Creating a job search site with Vue3 and Supabase

Michael Kwon

From developing your own full-stack application to a Progressive Web App (PWA)!

초급

Vue.js, supabase, Vue 3

Creating a job search site with Vue3 and Supabase

Michael Kwon

Learn Vue js and UI at once / Build a real-time weather app with Nuxt3 + OpenWeatherMap

gis

You can easily learn Nuxt UI, Nuxt SEO, Nuxt Server Api, Pinia, PWA, Firebase, Email Login, Google Login~~

초급

Vue.js, PWA, Firebase

Learn Vue js and UI at once / Build a real-time weather app with Nuxt3 + OpenWeatherMap

gis

The Latest Vue 3 Complete Guide: Project Setup & Specifications

gymcoding

This is a follow-up lecture to "Vue 3 Perfect Master", and it will teach you how to set up a project and learn the latest specifications of the latest Vue 3 version. This lecture is provided free of charge to those who have taken the Vue Basics or Practical Course.

초급

Vue.js, Vue 3, TailwindCSS

The Latest Vue 3 Complete Guide: Project Setup & Specifications

gymcoding

Learn React and Firebase by following along - Creating a Chat Application [Renewed in December 2023]

John Ahn

In this course, you will learn how to create a chat application using React and Firebase.

초급

React, Firebase, Web Application

Learn React and Firebase by following along - Creating a Chat Application [Renewed in December 2023]

John Ahn

A complete summary of basic web front-end concepts with keywords and practice

ronpark

A compass for beginners in web development, a guided lecture to discover what you don't know about web front-end and move forward systematically.

입문

Network, Google Chrome, Chrome DevTools

A complete summary of basic web front-end concepts with keywords and practice

ronpark

Creating web and apps that anyone can easily follow (from basics to practical use)

jocoding

We will create easy coding that anyone can learn. Our goal is to understand what coding is and create serviceable web and apps by utilizing external resources such as libraries and APIs as much as possible.

입문

Web Application

Creating web and apps that anyone can easily follow (from basics to practical use)

jocoding

A Guide to Elm, a Purely Functional Front-End Language

hatemogi

Study the Elm programming language guide to building front-end web apps with pure functional programming in just 3 hours.

초급

elm, Functional Programming, SPA

A Guide to Elm, a Purely Functional Front-End Language

hatemogi

Learn Vue.js 3 with Projects

Reviews from Early Learners

What you will learn!

Lecture Introduction

Expected Questions Q&A

Introduction to lecture materials

Introduction of knowledge sharers

Recommended for these people

HelloThis is .css-1q3zd4q{text-decoration-line:underline;text-underline-position:under;text-underline-offset:1px;}

Curriculum

Reviews

kossiecoder's other courses

Similar courses

Recommended for
these people

Hello
This is