Inflearn Clone Coding Part 2: From Enrollment to Deployment, Completing the Real Inflearn

🥇 Implementation from course navigation to detailed page

• Category, pagination based course search

• Detailed page with star rating and knowledge sharer information

• Implemented favorite function and course registration/shopping cart function

  
  

📺 Implementing a course page that works like a real one

• Developing your own video player component

• Completed viewing time saving and resume functions

• Includes a mission to create a custom play button

  
  

📝 Establishing a course evaluation and question system

• Star-based course review list and writing UI

• Complete the flow from question writing/review/answer

• Direct implementation of management page for knowledge sharers

  
  

💳 Complete actual payment flow

• Design your own shopping cart/payment API

• PortOne Server SDK and Toss Payments PG Integration

• From actual payment, exception handling, to reflection in learning list after payment

  
  

💻 From distribution to monitoring to infrastructure automation

• Sentry integration, daily statistics batch job development,
  Deep learning up to in-memory caching

• EC2 + Docker + Route53 deployment configuration

• Complete CI/CD automation with GitHub Actions

  
  

Section 2
Complete the flow before taking the course, from course exploration to detailed page

Implement search functionality including categories and pagination features, and create a course list screen and category search page.

The detailed page displays the star rating and information about the knowledge sharer, and the course registration button operates differently depending on whether you are logged in and the course type.

Section 3
Course page where you can save viewing time and continue watching

Create your own video player component ,
It even implements viewing time saving and resume viewing logic .

In the backend, we design an API that stores and responds to course information .
On the front, we create a learning experience close to the actual Inflearn by configuring a UI and custom play buttons that operate depending on the viewing status .

Section 4
Course Evaluation and Questioning Function - Students & Knowledge Sharers

Students leave ratings and reviews,
You can register a question and receive an answer.

Knowledge sharers design their own role-appropriate UIs so they can reply to course reviews or leave answers to questions on the management page.

Section 5
Developing the entire purchase flow from shopping cart to checkout

Add the course to your cart,
Implement real payment by linking PortOne SDK and Toss Payments .

When payment is successful, it will be automatically reflected in the learning list.
Complete user experience by considering the entire payment flow and exceptions.

Sections 6-7
From field-level backend operation experience to actual deployment

Automatically collect daily statistics with NestJS's Cron function, and improve response speed with in-memory caching for frequently called APIs.

Connect to Sentry to monitor errors in real time
Configure an actual deployment environment using EC2, Docker, GitHub Actions, and Route 53 .

We will also practice connecting domains with HTTPS .

Part 1

Focused on knowledge sharing functions

Student-focused function

Register for classes, create curriculum, upload videos

Part 2

Explore lectures, register for classes, watch videos, pay, and distribute

JWT authentication, S3 upload, admin page configuration

Viewing history storage, questions/reviews, payment API, EC2 deployment