I am currently taking the course, and I am learning a lot thanks to your clear and kind explanations.

jjongseung3065

Now it's time to take on a real-world challenge 🔥 We will develop a production-grade SNS using React.js + TypeScript + Supabase, building features such as authentication & authorization, infinite scroll, image uploads, likes, infinitely nested comments, and dark mode. In the process, we will also explore server and global state management techniques using Zustand and Tanstack Query.

winterlood

2026 새해 복 마🐴니 할인

Bite-Sized React.js Practical Project - SNS Edition

이론과 실습 한 번에

이론 실습 모두

real projects

실전프로젝트

한입시리즈

react.js

supabase

이제는 실전에 도전할 차례입니다 🔥 React.js + TypeScript + Supabase로 실무급 SNS를 함께 개발해보며 인증&인가, 무한스크롤, 이미지 업로드, 좋아요, 무한 중첩 댓글, 다크모드 등의 기능을 만들어 봅니다. 이 과정에서 Zustand와 Tanstack Query를 이용한 서버 및 전역 상태 관리 기법도 살펴볼 예정입니다.

이정환 Winterlood

효빈 Hyobin

입문

초급

중급이상

리액트

React

타입스크립트

TypeScript

react-query

zustand

한 입 크기로 잘라먹는 React.js 실전 프로젝트 - SNS 편

들어가며

사전준비 - 스타일링과 라우팅

사전준비 - Zustand를 이용한 전역 상태관리

사전준비 - 서버 상태관리와 Tanstack Query

한입 로그 구현 - 프로젝트 준비하기

한입 로그 구현 - 인증 처리하기

한입 로그 구현 - 포스트 기능 구현하기

한입 로그 구현 - 좋아요 기능 구현하기

한입 로그 구현 - 프로필 구현하기

한입 로그 구현 - 댓글 구현하기

한입 로그 구현 - 테마 변경 기능 구현하기

한입 로그 구현 - 배포 및 마무리