JavaScript All-in-One: From Vanilla JavaScript to SPA Development
hyobin
Let's develop an SPA with Vanilla JavaScript while learning everything from basic syntax to advanced concepts🔥
Basic
JavaScript, SPA, DOM
BEST
First Steps in JavaScript for Web Frontend
Do you want to become a web frontend developer? Take your first step with a fun JavaScript course✨
JavaScript
JavaScript
DOM
DOM
Reviews from Early Learners
Reviews from Early Learners
4.8
5.0
일론 머스크
100% enrolled
The lecture content is really stuck in my head. Other lectures are honestly boring and I often find it hard to focus, so I sometimes just zone out while watching, but this lecture makes me focus and follow along. Even though I don't have any background knowledge about the technology, I can still enjoy the lecture and focus on it, so I think the teacher's communication skills are amazing. Thank you for creating such a great lecture.
5.0
Ch.3
100% enrolled
I worked as an operating publisher for about 3 years. I always used jQuery a lot, so I had a thirst for JavaScript. For those who want to study JavaScript for the first time like me, this is the best lecture! It implements and explains in detail not only the basics but also advanced learning. It was also great that it emphasized important parts and did not miss them, and it was helpful for practical work. The reasonable price and lecture time were a great help in completing the lecture. It made me want to study JavaScript harder!! Thank you!! I look forward to the next lecture!
5.0
시콜라킹
100% enrolled
Today, I completed the project. I was learning React, but I purchased this course to solve my shortcomings, review, and regrets about JavaScript. The instructor's clear pronunciation and voice were great, and I was able to relearn and review parts of JavaScript that I had been confused or had forgotten. I can see the text that was organized in the same way as the video, so I will read it from time to time and continue studying. Thank you. Highly recommended!
What you will gain after the course
Reasons to learn JavaScript
Basic concepts of web development
JavaScript syntax frequently used in practice
Developing a project for actual use
A stepping stone for learning TypeScript, React.js, and Next.js
Take your first steps in JavaScript, from
basic concepts to building web pages🚀
🎁 High school and college students can purchase at a 50% discount through the link.
(If you do not receive the coupon, please check your spam folder)
-> Coupon Request Link
-> Coupon Request Link
📙 "JavaScript First Steps" has been published
The 'JavaScript First Steps for Web Frontend' course has received so much love from students that it has been released as a book titled
'JavaScript First Steps' 🙇🏻♀️
Since the book contains the contents of the course, it would be great to read as a reference while taking the class :)
We are grateful to all our students and ask for your continued interest.
🧐 Why should we learn JavaScript?
JavaScript is a globally popular language and is a programming language actually used by many companies. Currently, the most widely used libraries and frameworks in web front-end, such as React, Vue, and Next, are all based on JavaScript, so you must learn JavaScript to use them flexibly.
JavaScript First Steps for Web Frontend is!!
Learn easily from
basic to advanced grammar
Provision of all lecture materials used in the course
Developing unique projects all the way to completion
🙋🏻♀️ Recommended for these people
Case 1
I want to become a front-end developer!
Those who want to meticulously learn JavaScript, the foundation of front-end development,
from basic to advanced concepts
Case 2
I'm new to development and looking for a course that's easy to understand!
We explain everything kindly and in detail so that even beginners and non-majors can follow along.
(Lecture scripts are also provided on the web page.)
Case 3
I want to develop a unique project!
Instead of a common project like a Todo List,
you can develop and even use your very own "Personalized Chrome Start Screen."
🚀 From concepts to projects all at once
Stop taking courses that only teach language and syntax!
Learn the basics and advanced syntax of JavaScript, along with the reasons why you should learn it, how it works, and
how to do web programming with JavaScript step-by-step. Learn JavaScript effectively by applying what you've learned to develop a real-world project that you can actually use.
.gif "2023-05-28 15-45-47 (online-video-cutter.com).gif")
The JavaScript First Steps for Web Frontend course is...
- Even those who are new to JavaScript or programming in general can easily understand it.
- Lecture materials and a handbook are provided to help students understand the content.
- You can immediately apply what you've learned by developing your own Chrome extension together.
⭐️ A course proven by a 4.9 rating and 55 reviews
These are actual reviews from students who took the "First Steps in JavaScript for Web Frontend" course.
🧑🎓
The visual materials are clean and the instructor's delivery is excellent. They explain the core concepts so clearly that it was great even for reviewing purposes! The lecture materials provided were also helpful for organizing what I learned. Thank you for the great lecture!
👩🏻💻
Clean PPTs, examples that are easy to understand, I think this is the best lecture that teaches necessary functions without any fluff!! My only regret is that Hyobin has only one lecture. Please make more lectures :)
🙆♂️
The lecture content is so easy to understand. Honestly, other lectures are often boring and hard to focus on, so I found myself spacing out, but this lecture keeps me focused and following along. Even though I have no background knowledge of this technology, the fact that I can stay focused and enjoy the lecture makes me think the teacher's delivery is incredible. Thank you for creating such a great lecture.
🕵️♀️
Things I didn't quite understand while studying on my own are clicking perfectly as I listen to the lectures. I especially love how you explain difficult JavaScript terminology and concepts easily along with example code. I think this is a must-listen before learning React, Vue.js, etc.! I hope there's an advanced JavaScript course as well😍
📖 Check out what you will learn in the course.
Section 1. Why should you learn JavaScript?
What kind of language is JavaScript? Why is it so popular and used by so many companies? We will tell you
the reasons why you should learn JavaScript.
Section 2. Getting Started with JavaScript
First, we will look at where and how JavaScript operates.
Next, we will learn in detail about the basic concepts of JavaScript by examining various example codes one by one in an easy-to-use online editor.
Section 3. Applying JavaScript
You will learn advanced concepts that are slightly more challenging than those in the previous section, accompanied by various visual aids. After picking out and mastering only the essential concepts, you will learn in detail about asynchronous processing, an important concept in JavaScript.
Section 4. DOM and DOM API
You will learn in detail about the DOM object, which is used to manipulate web pages. Through live coding, we will practice using various JavaScript DOM APIs one by one. We will focus on frequently used DOM APIs and explore different ways to manipulate web pages.
Section 5. Preparing for the Project
We will take the time to learn the additional concepts in detail beforehand that are necessary for creating "My Own Chrome Start Page." Since we cover the required concepts in depth in advance, you will be able to develop the project in the next section without much difficulty.
Section 6. Project: My Own Chrome Start Page
Using everything learned from Sections 1 to 5, we will develop "My Own Chrome Start Screen".
Since we will develop slowly while reviewing each concept one by one—even those already covered—you can review what you've learned while simultaneously building the project. Finally, we will go through the setup together so you can actually use the project you've developed.
Bonus. Essential CSS You Must Know
Although this is a course for learning JavaScript, in Section 6, you can learn about the two most frequently used and useful CSS properties for project development.
If you are already proficient in CSS, you may skip this section.
Q&A 💬
Q. I'm new to programming; is it okay for me to take this course?
Yes. This course explains various JavaScript concepts in such a detailed and friendly manner that even those new to programming can follow along without much difficulty. Since all the PPT slides and scripts used in the lectures are provided for free, following along with these study materials will be much more helpful in understanding the course content.
Q. Is it okay if I don't have any knowledge of HTML and CSS?
Knowledge of HTML and CSS is only required in Sections 5 and 6. Since HTML and CSS codes are provided separately, you can learn JavaScript without any issues even if you don't know HTML and CSS.
Additionally, for HTML, I briefly explain the function of each line of code as we write it, so you can follow along without much difficulty. As for CSS, properties that require conceptual explanations are covered in detail separately in the [Appendix] section. Therefore, those who need it can watch that section first before taking the main course to follow along smoothly.
Q. What should I study after finishing the course?
If you took this course to become a web front-end developer, I first recommend trying to build the final project, "Your Own Chrome Start Page," on your own. Afterwards, you could study JavaScript in more depth, covering more advanced concepts, or move on to learning JavaScript-based libraries and frameworks such as React.js, Vue.js, or Next.js.
💾 Please check before taking the course!
- The PPT used in the lecture can be downloaded from the corresponding lesson.
- The script used in the lecture can be found in Section 0 [Learning Materials Lecture Script Webpage].
- Please make sure to take the Section 0 [How to take the course] lesson.
- I will respond to your questions as quickly as possible.
- If you study along with the learning materials, you will be able to understand the content much more easily.
Recommended for
these people
Who is this course right for?
Those who are new to programming
Those who want to complete a unique project
Those who aspire to be frontend developers
Those who want to learn JavaScript quickly and effectively.
Those who are looking for a JavaScript lecture with friendly explanations
Those who wish to take the course along with the lecture materials
Those who lack a basic foundation in JavaScript
Need to know before starting?
CSS (This concept is only required in Section 6)
HTML (This concept is only required in Section 6)
Hello
This is hyobin
12,034
Learners
441
Reviews
137
Answers
4.9
Rating
14
Courses
Hello, I'm Hyobin Kim 😊
I provide easy and friendly lectures for those who aspire to become front-end developers.
(Current) Frontend Development Instructor
(Former) Startup Frontend Lead Developer
Web page
Online Courses
Books
External Activities
Conducted special lectures at Udemy, Codeit, Hanyang Women's University, etc.
Curriculum
All
42 lectures ∙ (6hr 47min)
Course Materials:
Lecture resources
9. operator
10:17
12. Scope
07:56
13. Hoisting
06:18
15. object
15:07
16. array
10:54
17. Loop
18:14
Published:
Last updated:
Reviews
All
98 reviews
4.8
98 reviews
- kycasdzxc
Reviews 1
∙
Average Rating 5.0
5
100% enrolledI'm starting to understand things that I didn't understand well while studying on my own through the lectures. I especially like how the terms and concepts of JavaScript, which can be difficult, are explained easily with example codes. I think it's a must-listen before learning react, vue.js, etc.! I wish there were lectures for the advanced JavaScript course😍
- hyobinInstructor
As you said, understanding JavaScript is essential before learning libraries or frameworks like react and vue!! I'm glad you found the lecture content easy to understand. I'll also consider taking an in-depth JavaScript course😊 Thank you.
wlsdyd6202374Reviews 1
∙
Average Rating 5.0
5
34% enrolledI took this course because I wanted to learn JS and front-end. This course explains grammar in detail so that even non-majors can fully understand the content. Also, the curriculum includes advice based on practical work, actual project unit implementation, etc., so I was personally very satisfied. I think this is a course that beginners or those who are interested in web front-end development who are inexperienced like me can definitely feel their capabilities have improved by one level.
- hyobinInstructor
wlsdyd620, I feel like it was worth making the lecture since you grew a level through my lecture😃 Thank you for listening attentively!!
- ramirosol26354
Reviews 1
∙
Average Rating 5.0
5
10% enrolled**A lecture that gave hope that even a dropout can code** After entering computer science, even the professor gave up on me, This lecture saved me No matter how much I read the book, I couldn't understand what it was saying, but it's amazing that it goes into my head without subtitles I highly recommend this to anyone who needs a lecture at eye level like me!!
- hyobinInstructor
I'm so glad that my lecture was helpful to Hansol😃 Thank you for listening attentively!
- elonmusk
Reviews 64
∙
Average Rating 4.8
5
100% enrolledThe lecture content is really stuck in my head. Other lectures are honestly boring and I often find it hard to focus, so I sometimes just zone out while watching, but this lecture makes me focus and follow along. Even though I don't have any background knowledge about the technology, I can still enjoy the lecture and focus on it, so I think the teacher's communication skills are amazing. Thank you for creating such a great lecture.
- hyobinInstructor
I'm so glad that the lecture wasn't boring and was well-conveyed. Thank you for taking the class diligently!!
- winterlood
Reviews 2
∙
Average Rating 5.0
5
20% enrolledI think this is the most friendly and detailed lecture among the JavaScript lectures for beginners. It goes over even the most detailed concepts accurately, and on top of that, it explains all the codes in detail, so I think it's a good lecture that you can take without having to Google it separately. 1. The visuals are very intuitive and pretty. 2. It's so nice to listen to without getting tired because of the accurate diction! 3. There are many lectures that usually only teach you grammar and end, but the process of applying what you've learned and creating a practical project is very impressive.
- hyobinInstructor
Thank you, Jeonghwan😀
hyobin's other courses
Check out other courses by the instructor!
Similar courses
Explore other courses in the same field!
![Solid Frontend Bootcamp for Full Stack (HTML, CSS, Vanilla JavaScript + ES6) [Full Stack Part2]Course Thumbnail](https://cdn.inflearn.com/public/course-326306-cover/4ea213de-f786-4af1-a9d0-b8932263885a?w=420)
