강의

멘토링

로드맵

BEST
Programming

/

Front-end

Full Stack React Live Coding - Creating a Simple Shopping Mall

From development to distribution! We will show you the arduous journey to complete a single service without filtering. You will be able to overcome the difficulties and difficulties by introducing a lot of new technologies!

(4.8) 15 reviews

1,279 learners

  • jaenam
React
GraphQL
Firebase

Reviews from Early Learners

What you will learn!

  • React web service development

  • GraphQL

  • React-Query

  • Firebase

Listen to a lecture that feels vivid and real
Start coding and build an online shopping mall service! 🩳

One service
The journey to completion 🚢

This course is conducted live with students, so you can quickly find and apply only the content you need right away.
We will show you the process of considering and solving various problems that arise during the development process without filtering them.

Through this lecture, I want to show you that you can somehow complete something even if you just start coding without any preparation.
With this, I hope to give courage to job seekers or juniors who are having difficulty creating something.
The full code is available on GitHub , so please refer to it!

"I learned React, but I feel lost when I try to work on a project on my own.
I'm also curious about how other people are studying development."
-Front-end job seeker-

"I have absolutely no knowledge of the backend side, so I feel lost just thinking about development.
I feel limited in the progress of the project ."

-Junior Front-end Developer-

"When I get stuck while coding, I don't know what to do and I'm at a loss.
Additionally, I would like to practice GraphQL and BFF
. "
-Front-end developer-


In live coding
Learn one thing every day 🎥

Day 1

  • Client environment settings (vite), router processing
  • Create a product list and detail page
  • React Query Cache Policy
  • Written by GNB

Day 2

  • Introducing Mock Service Worker
  • Creating a mock API for the product list and shopping cart
  • Create a shopping cart page

Day 3

  • Applying the shopping cart API
  • invalidateQueries vs. optimistic updates
  • Implementing the Delete Cart and Select Function

Day 4

  • Shopping cart status management (recoil)
  • Payment page

Day 5

  • Introducing a monorepo (yarn workspace)
  • Server environment settings
  • Schema and resolver definitions

Day 6

  • Create json DB
  • Reflect server changes to clients

Day 7

  • Infinite Scroll - Server Task
  • useInfiniteQuery
  • intersectionObserver

Day 8

  • Writing an Admin API
  • Admin page - implementing functions for adding, editing, and deleting lists and products

Day 9

  • Firebase application

Day 10

  • Finalize and deploy Firebase

🔔 Create a shopping mall service through coding that you learn through hands-on experience for 10 days.


After listening to all the lectures
A look at the students 😎

You will gain enough knowledge to carry out projects on your own.
You will gain the strength to solve various problems that arise during the project process.

I will generously share with you the various know-how I have gained from 9 years of practical experience .
Whenever I start a project without thinking and run into a problem,
We'll show you how to find a solution using a combination of search, debugging, and guesswork.

Q&A 💬

Q. I'm curious about the level at which I can take the course.

This course doesn't cover basic React or TypeScript, so you'll need some prior knowledge to successfully complete it. However, other knowledge isn't required; simply listening, thinking, and following along will allow you to acquire the material naturally.

Q. Is theory included in the lecture content?

This video includes information necessary for project progress, as well as real-time answers to questions from participating members during filming. Please note that there is no detailed theoretical explanation beyond this.

Q. Is this lecture content suitable for a portfolio?

Because I've focused solely on development and minimal styling, this course alone won't be enough to create a portfolio-quality piece. However, I believe you'll gain sufficient know-how to tackle new projects.

Q. Is there a special practice environment that I need to prepare for?

While the course focused on MacOS, it also provided some guidance on how to address issues that arise in Windows environments. While Visual Studio Code (VSCode) was used as the IDE, you are perfectly welcome to use any other development tool.


Knowledge sharer
Curious about other lectures? 💁‍♂️

Core JavaScript (click)

Understanding Javascript ES6+ - Beginner (Click)

Javascript ES6+: A Complete Guide - Intermediate (Click)

Understanding Javascript ES6+ Properly - Bonus (Click)

Recommended for
these people

Who is this course right for?

  • I am a front-end job seeker who has learned React but is at a loss when it comes to actually working on a project on my own.

  • A junior front-end developer who feels limited in project progress due to lack of back-end knowledge

  • Front-end developers and job seekers who want to practice GraphQL/BFF

Need to know before starting?

  • ReactJS

  • Typescript

Hello
This is

32,553

Learners

676

Reviews

395

Answers

4.8

Rating

11

Courses

안녕하세요, 시니어 프론트엔드 개발자 정재남 입니다.
서로 돕고 함께 발전하는 건전한 공유문화를 지향하여 다양한 활동을 하고 있습니다.

저서: 코어 자바스크립트

유튜브 채널: FE재남

아티클 및 인터뷰 영상:

Curriculum

All

48 lectures ∙ (8hr 1min)

Published: 
Last updated: 

Reviews

All

15 reviews

4.8

15 reviews

  • whe19150746님의 프로필 이미지
    whe19150746

    Reviews 8

    Average Rating 4.8

    5

    31% enrolled

    Tôi thích nó vì nó giống như một phiên bản nâng cao của bài giảng React. Thật tuyệt khi thử nhiều thứ hơn là chỉ đơn giản.

    • yoongeonung님의 프로필 이미지
      yoongeonung

      Reviews 12

      Average Rating 5.0

      5

      63% enrolled

      Tôi mới tham gia khóa học đến ngày đầu tiên nhưng nó rất thú vị và tôi đã học được rất nhiều điều, vì vậy tôi thực sự khuyên bạn nên tham gia khóa học này. Các bài giảng và mã hóa nhân bản hiện tại nhàm chán đến mức tôi thậm chí còn ngủ quên, nhưng các bài giảng của Jaenam Jeong, giống như một buổi học, lại rất thú vị! Tôi thực sự khuyên bạn nên làm điều đó và nếu có cơ hội vào lần tới, tôi hy vọng bạn sẽ tạo một khóa học kiểu tương tự dành cho những người mới bắt đầu chưa có khả năng chuyển từ trình độ sơ cấp sang trình độ trung cấp.

      • 0sun님의 프로필 이미지
        0sun

        Reviews 5

        Average Rating 5.0

        5

        100% enrolled

        Cuối cùng tôi đã cứng đầu! Trước hết, giọng nói của người hướng dẫn rất hay. Bản thân giọng nói đã hấp dẫn đến mức tôi rất bị cuốn hút vào bài giảng. Và... bài giảng này còn nhiều hơn những gì tôi nghĩ. Tôi đã học được nhiều hơn những gì tôi dự định ban đầu!!

        • ucopy님의 프로필 이미지
          ucopy

          Reviews 5

          Average Rating 5.0

          5

          94% enrolled

          Đó là một bài giảng thực tế.

          • khh23028104님의 프로필 이미지
            khh23028104

            Reviews 9

            Average Rating 5.0

            5

            27% enrolled

            Tôi thực sự rất thích bài giảng tốt. Tôi đặc biệt ấn tượng với lời giải thích trực tiếp.

            Limited time deal ends in 7 days

            $358,730.00

            25%

            $17.60

            jaenam's other courses

            Check out other courses by the instructor!

            Similar courses

            Explore other courses in the same field!