Vue 3 시작하기
장기효(캡틴판교)
Vue.js 최신 버전 Vue 3를 시작하는 분들을 위한 강좌입니다. Vue.js의 동작원리부터 실무 개발을 할 때 알아둬야 하는 기본 개념들을 배워보세요.
Basic
Vue.js, Vue 3, JavaScript
BEST
Getting Started with Nuxt.js
If you want your Vue.js site to be exposed to more people? This is a great course for those who have listened to the entire Vue.js series by Captain Pangyo and now want to try server-side rendering. Nuxt.js Getting Started Course!
Reviews from Early Learners
What you will learn!
Server Side Rendering
Vue.js Development
Front-end development
Server-side rendering with Nuxt.js!
Now, try out Vue.js more powerfully.
Vue.js, Want to use it better?
If you are a view developer, you can use Knockst
It is possible to implement server-side rendering .
however,
What is server-side rendering? 🤔
Server-side rendering is a technique that draws a page on the server, sends it to the client (browser), and then displays it on the screen. Server-side rendering technology is used to accurately convey my site information on search engine optimization (SEO: Search Engine Optimization) and social media.
Nuxt.js is a framework that many Vue.js developers use to implement this type of server-side rendering. It helps expose the site I created to more people.
However, since there are no specialized Nuxt.js lectures in Korea and not many reference materials, I have often received requests to open a class. I hope this lecture will be a useful resource for those who need to develop services with Nuxt.js.
For those who are starting with Nuxt.js
To help you.
From project creation to service deployment ,
What you must know when developing with Noxtro
We'll cover everything.
“I have to try Rust, but how is it different from Vue’s development method?”
This course is suitable for those who are unfamiliar with the concept of server-side rendering, and those who have to develop with Nuxt.js at work but have never used it before. Let's learn how the development methods of Nuxt.js and the existing Vue.js differ while creating some simple shopping mall sites.
✅ For those who are new to Nuxt.js
✅ Those who know the basic concepts of Vue.js development but are not familiar with server-side rendering
✅ People who are working on a Nuxt.js project at their company but have trouble figuring out where to start
✅ Front-end developers interested in server-side rendering
Created this course
Introducing the knowledge sharer 😎
For field development practitioners
Let me tell you the know-how 🎁
Unique features of this course
Check it out ✨
We provide lecture notes.
The key concepts related to Nuxt.js and server-side rendering covered in the course are made easy to understand through well-written lecture notes and illustrations.
Create your own site.
You can naturally learn the advantages and grammar of Nuxt.js while creating a shopping mall site. (Practical experience 70% or more)
Compare the structures naturally.
In order to naturally connect the Captain Pangyo Vue.js series content to the Nuxt.js lecture, we will explain it by comparing it to the structure of a single page.
📢 Check your player knowledge!
- This lecture is a lecture linked to the Captain Pangyo Vue.js series. This lecture is suitable for those who have learned (1) Getting Started with Vue.js - (2) Intermediate Vue.js - (3) Complete Guide to Vue.js - (4) Finishing Vue.js , so please make sure to take the prerequisite course 🙂
Learning in class
Let me tell you the content 🎈
Server side rendering
We will explain in detail the differences compared to developing a project created with the existing View CLI, how server-side rendering works, and its advantages.
Understanding How Server-Side Rendering Works
It helps you easily understand the concepts you have learned visually by comparing sites with and without actual SSR applied.
Understanding layout patterns
A schematic to help you understand the layout components in Nuxt.js and details how they differ from traditional single-page applications.
ESLint rules for Nuxt.js
Explains ESLint rules for Nuxt.js, which are more robust than Vue CLI projects. See how ESLint is actually applied in your code.
Configuring and connecting the backend API server
We will guide you through how to configure a backend API server for developing a shopping mall site. We will provide a guide for the procedure to configure the server so that you can proceed on your own even after class.
Component design approach
We will guide you through the component design methods that you should consider in component-based frameworks such as React and Vue, and review the implemented content.
Create a website similar to a shopping mall
We will create a website similar to a shopping mall, linked to an actual API. During the creation process, we will apply the concepts of Nuxt.js one by one and learn about the differences from existing Vue.js applications.
Markup & styling as needed
Only the main layout markup and styling for screen development are covered, and detailed styling is provided as a GitHub repository source code. You can focus on learning the concepts of Nuxt.js, enabling fast and efficient learning.
Frequently Asked Questions 💬
Q. I'm new to Vue.js. Can I still take this course?
This lecture is suitable for those who know the basic concepts of Vue.js. I think it would be good to think of Nuxt.js as a framework with a little more rules added to the basic knowledge you need to know when developing with Vue.js. I recommend that you take Captain Pangyo's Vue.js series lectures from beginning to end first and then listen to this lecture.
Q. I have no idea about server-side rendering. Can I still take the class?
Yes, you can. It covers not only the API and usage of Nuxt.js, but also why server-side rendering is good and the differences from the existing client-side rendering (single page application) in detail. After listening to the class, you will be able to clearly grasp the concept of server-side rendering.
Q. I'm new to front-end development. Is it okay for me to take this course?
This course is not suitable for those who are completely new to front-end development. The course is structured so that those who have basic knowledge of HTML, CSS, and JS can easily listen to it. I recommend that you listen to it after understanding at least the basic concepts of Vue.js and the concept of single-page applications using routers.
Q. Vue.js 3 has been released. Should we proceed with Vue 3 or Vue 2?
This course is based on Vue 2. The official version of Nuxt.js based on Vue 3 has not been released yet, and Vue 3 also has many limitations for use in the field, so it was created based on Vue 2, which can be applied immediately after learning. Please note that when the ecosystem based on Vue 3 becomes stable in the future, the contents of Vue 3 will be additionally updated :)
※ Everything you learned in Vue 2 can be applied to Vue 3. The difference between Vue 2 and Vue 3 is only one major API difference, and there is no significant difference.
Captain Pangyo's
Are you curious about other lectures?
Introducing the knowledge sharer 👨🏫
Jang Gi-hyo (Captain Pangyo)
- Current front-end developer
- Author of "Do it! Introduction to Vue.js" and "TypeScript: Easy to Start"
- Vue.js lectures by Naver, eBay Korea, Samsung, LG, SK Group, etc.
- Fast Campus Vue.js Conquest Camp Lecture
- Translator of the official Google Web Technologies website
- Tech Blog , Github
“Vue.js open source + with lecture revenue
Support Life Coding 😁”
Recommended for
these people
Who is this course right for?
Getting started with Nuxt.js
If you want to learn server-side rendering
If you want to create a site that will be exposed to many people using Vue.js
Front-end developer
publisher
job seeker
Need to know before starting?
Getting Started with Vue.js
Vue.js Intermediate
The Complete Guide to Vue.js
Mastering Vue.js
48,096
Learners
4,668
Reviews
3,812
Answers
4.9
Rating
17
Courses
인프런에서 8년째 지식을 공유하고 있습니다. 🏠 기술블로그, 📣 트위터, 💻 깃헙
📗 Do it! Vue.js 입문, 쉽게 시작하는 타입스크립트, 나는 네이버 프런트엔드 개발자입니다. 책 3권 집필
📖 Cracking Vue.js, 타입스크립트 핸드북, 웹팩 핸드북. 온라인 무료 가이드북 3권 집필
👨💻 캡틴판교의 프론트엔드 개발 유튜브 채널 운영 - 취준생, 주니어 개발자들의 고민을 들을 수 있는 곳
🥤 캡틴판교의 카카오톡 오픈 채팅방 운영 - 프런트엔드 개발 최신 정보와 업계 동료들의 생각과 고민을 들을 수 있는 곳
Curriculum
All
73 lectures ∙ (6hr 11min)
Published:
Last updated:
Reviews
All
119 reviews
4.9
119 reviews
toki mokiReviews 5
∙
Average Rating 5.0
- mj Song
Reviews 6
∙
Average Rating 5.0
- sujin3473
Reviews 1
∙
Average Rating 3.0
- 찬규
Reviews 1
∙
Average Rating 5.0
5
100% enrolled프론트엔드에 관심이 생기면서 2개월 동안 열심히 공부 중인 대학생입니다! 혼자서 막연하게 공부하다가 이해도 안 되고 너무 힘들었는데 우연히 캡틴 판교님을 접해 지금 강의까지 다 듣고 복습도 하는 중이에요! 덕분에 방향 잘 잡고 공부해 가는 것 같아요ㅜㅜ 진짜 강의들 너무 좋고 요번 nuxt강의도 도움 많이 되었어요 개인적으로 정말 감사드립니다! 앞으로 새로운 강의 나오면 바로 뛰어가서 수강하겠습니다 ㅠㅠ
- 장기효(캡틴판교)Instructor
아이고 찬규님 너무 좋은 평가 감사드려요! ㅋㅋ 앞으로 강의도 많이 기대해 주세요. 찐 강의 준비해 오겠습니다! :)
$42.90
captain's other courses
Check out other courses by the instructor!
Similar courses
Explore other courses in the same field!
![기획자님 이 정도 웹 개발은 배워보면 어떨까요? [이론+실습]Course Thumbnail](https://cdn.inflearn.com/public/courses/333579/cover/5bfdb903-721c-4e32-803b-ed0d4cfc28b7/333579.png?f=avif&w=420)
