[React Part 1] Learning React by making and comparing

The most popular front-end practice, React,
Get it for sure with just one lecture! 🚩

If you are having these concerns, pay attention! 💡

Case 1
React is said to be the most popular, but I don't know where to start!

"React, the most popular tool in the front-end hiring market,
But when it comes to actually getting started, I have no idea where to start or what to do."

Case 2
I'm not sure about my React development process.

"I somehow managed to develop it using React,
I have no idea how effective this method is .

We will teach you everything from React basics to practical use 🎯

Oh, that story. Sounds like my story? Then you should join this lecture!
The objectives of this lecture are as follows:

• By creating the results in JS and React versions , you can understand the role and advantages of React at a glance.
• You can learn the theory with your body and mind through coding practical applications and 12 assignments.

People like this will love hearing this! 🧑‍🎓

• Even after reading the official React documentation, I am still at a loss as to where to start.
• A practitioner type who prefers to start with Hello World rather than theory.
• I tried using React, but it's a bit confusing and hard to explain exactly what's good about it.

Unique features of my lecture 😎

• You can clearly understand the features of React.js!
  • Compare pure JavaScript and React development to gain a clearer understanding of React's features.
• A dense course based on the official React documentation!
  • This is a "React Core Course" based on the main concepts mentioned in the official React documentation.
• This is a lecture focused on thorough practice!
  
  • You can learn it firsthand by creating a shopping mall search screen through direct coding and solving 12 practical tasks.
• I prepared a Git Branch for each video.
  
  • For those who have difficulty following along during the practical training or are taking the class without the practical training, I have prepared a Git branch for each video.
  • You can easily see the code used in each video by moving to a branch.

• Lecture notes provided so you can view them right after reviewing!
  • All lecture notes used in class are available on the blog. (Link: 🖋Kim Jeong-hwan's Blog )
  • It's a good idea to read the entire text lightly before class. Preview👍
  • It's even better if you read it after class. Review👍👍

Learn about these things 📖

1. Preparation
   • Let's take a look at the design and requirements analysis documents to get a sneak peek of the deliverables we'll be creating in class.
   • As I was creating my results with pure JavaScript and the MVC design pattern, I realized the need for a UI library.
2. Introduction
   • You can learn about the concepts of React's reactive and virtual DOM and why to use React.
   • Learn the roles and usage of some tools used in React development and prepare for practice.
3. User Guide 1
   • You can learn the basic concepts of React by implementing the result from scratch using React.
   • You can understand the core principles of React, such as State, event handling, conditional rendering, forms, lists, and keys.
4. User Guide 2 (Component)
   • We introduce React components and improve the results we created in the previous part into React components.
   • You can learn about issues you encounter when working with components, such as class/function components, state lifting, inheritance, and composition.

Home screen

Search results screen

Recent searches screen

Next lecture

[React Part 2] Advanced Topics and Hooks

Introducing myself 🧑‍🏫

Kim Jung-hwan

A working developer who loves learning and organizing web technologies.
I run a technology blog about web technologies and my thoughts as a developer.

• Link: 🖋 Kim Jung-hwan's Blog

We also share the skills we have learned and the know-how we have learned in practice in the form of presentations or lectures.

• Link: 🎥 Inflearn
• Link: 🎥 YouTube

I work as a front-end developer at Elegant Brothers.

• Link: 🖋 Elegant Brothers Tech Blog

I also wrote content related to React technology.

• Links: 🖋 React related blog posts
• Links: 🎥 React-related YouTube videos

Q&A for students 🙋