강의

멘토링

로드맵

BEST
Programming

/

Front-end

[React Part 1] Learning React by Building and Comparing

Master React now. Easiest course to grasp React's features & roles, comparing to pure JS!

(4.8) 114 reviews

1,978 learners

  • jeonghwan
실습 중심
실무
핵심원리
React
MVC
JavaScript
Web Application

Reviews from Early Learners

What you will learn!

  • Understanding React.js core concepts through hands-on web application development

  • Comparison of Pure JavaScript Development and React Development

  • Benefits of Applying Design Patterns Through Practical Exercises

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.

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

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

I also wrote content related to React technology.


Q&A for students 🙋

Q. Is this a lecture that non-majors can also take?

No, you need to have some experience in web development to take this course.

Q. Why should I learn React?

The current job market is looking for developers with knowledge of modern web frameworks.

If you have the most popular React skills, you will be in demand by many companies.

Q. What are the benefits of learning React?

React solves many common problems in user interface development.

Developers can focus more on developing business logic and gain the power to create products faster.

Q. Is there anything I need to prepare before attending the lecture?

If you have any experience with web development, it's worth taking this class.

This is because the class is conducted on the assumption that you are familiar with HTML and JavaScript grammar.

For those who are still lacking in web basics, I recommend learning first and then taking the course.

Q. What level of content is covered in the class?

This content is based on the main concepts and some advanced guides from the official React documentation.

It covers the core parts of React.

Q. Are there any notes regarding course registration?

There are four tools we will use in class: Node.js, a development editor, a web browser, and Git.

You can also check it out in the preview class. (Link: 🎥 Class Preview )

Recommended for
these people

Who is this course right for?

  • Those who've read the React official docs, but are still unsure where to begin.

  • Those who prefer to start with "Hello world" (hands-on practice) rather than theory

  • React users who can't pinpoint its exact benefits.

Need to know before starting?

  • Basic knowledge of web development

Hello
This is

13,835

Learners

859

Reviews

586

Answers

4.8

Rating

9

Courses

수업 중 궁금한 사항은 질문 사항에 올려주세요.
매일 한 번씩 확인하고 답변 드리겠습니다.

Curriculum

All

96 lectures ∙ (8hr 44min)

Course Materials:

Lecture resources
Published: 
Last updated: 

Reviews

All

114 reviews

4.8

114 reviews

  • pyw82061918님의 프로필 이미지
    pyw82061918

    Reviews 8

    Average Rating 5.0

    5

    100% enrolled

    すでにreactプロジェクトに参加した開発経験がありますが、少し時間が過ぎたりして、もう一度講義を聞きながら基礎勉強をするのに多くのお役に立ちました。 ありがとうございます。

    • 9ma님의 프로필 이미지
      9ma

      Reviews 3

      Average Rating 5.0

      5

      100% enrolled

      リアクトを初めて勉強し、どのように始めるのか難しいことがありましたが、簡潔に講義を構成してくださったおかげで多くの助けを受けています。ある講義党、そして全体の講義構成が長くないおかげで何度も何度も何度も見られそうな点もメリットです:) 一方、バニラのJavaScriptも扱ってくれたので、リアクトがどのような問題を解決するために現れたフレームワークなのかを把握することが容易になりました。しかし、まだ両方とも難しいのは同じですね..ㅎ_ㅎ その後も何度も見て実装していき、フロントエンド開発の基礎をよく固めるようにしなければなりません。 良い講義ありがとうございます。

      • 04209904047님의 프로필 이미지
        04209904047

        Reviews 9

        Average Rating 4.8

        4

        100% enrolled

        - 利点! 1. 講義でReact公式文書の "主な概念"で扱うすべての内容を扱う。 2. 公式文書には重要性が落ちると判断したのか、大きく言及せずに進む内容まで使ってみて、なぜこのような方法があまり推奨されないのかについてもわかった。 3. 単に、リエクトラという概念を超えて抽象化の必要性についても学習できた。 - 欠点ではなく..講義中難しかった点!!! 1. MVCパターンと抽象化に対する理解度が弱い筆者は、バニラJSパーツ初めて聞いたとき、コードを見て激しいヒョンタがやってきた。 =>私のレベルでは、コードはとても難しかったㅠ。 だが、クンビョン我慢しながら、紙でロジックを書いてコードを出して作れば、ますます成長していく自分の姿を発見することができる。 もし、私のような難しさを経験する受講生であれば、リエクト編を先に見て、バニラJS編に近づいてみると、より簡単にコードが理解できる。 - 総評!!! 正直、リアクトを使うことはしたが、私の実力は泡の上に浮いているように深さがなかったが、この講義を通じて、リアクトをより深く理解することができた。

        • jeonghwan
          Instructor

          私も授業準備しながら序盤部が難しくなるような懸念をしました。大変そうですㅜㅜそれでも最後まで聞いてくれてありがとう。

      • wepungsan님의 프로필 이미지
        wepungsan

        Reviews 36

        Average Rating 5.0

        5

        100% enrolled

        おすすめです。 リアクトの概念について総合的に扱う講義です。 リアクトフックまではあまり扱いません。

        • jeonghwan
          Instructor

          バックエンド開発者のフィードバックを残していただきありがとうございます。良い一日をお過ごしください。

      • kkhkim20027309님의 프로필 이미지
        kkhkim20027309

        Reviews 2

        Average Rating 5.0

        5

        100% enrolled

        良い講義ですが…少し難しいです。

        • jeonghwan
          Instructor

          ありがとうございます。

      Limited time deal

      $5,013.00

      23%

      $42.90

      jeonghwan's other courses

      Check out other courses by the instructor!

      Similar courses

      Explore other courses in the same field!