UMC 8๊ธฐ Web ํํธ ์ํฌ๋ถ ์ค์ต์ ์ ๋ฆฌํ ๋ ํฌ์งํ ๋ฆฌ์
๋๋ค.
React, TypeScript, Tailwind CSS๋ฅผ ๊ธฐ๋ฐ์ผ๋ก ๋จ๊ณ๋ณ ๊ณผ์ ๋ฅผ ์ํํ๋ฉฐ ์ค๋ฌดํ ํ๋ก ํธ์๋ ์ญ๋์ ์๋ ๊ฒ์ ๋ชฉํ๋ก ํ์ต๋๋ค.
- ๐น Mission 1 (๊ธฐ์ด): React ์ปดํฌ๋ํธ, ์ํ ๊ด๋ฆฌ, ์ด๋ฒคํธ ์ฒ๋ฆฌ
- ๐น Mission 2 (SPA): Router ํ์ฉ, API ์ฐ๋, ์๋ฌ & ๋ก๋ฉ ์ฒ๋ฆฌ
- ๐น Mission 3 (๋ฐ์ดํฐ ํจ์นญ): TanStack Query, Infinite Scroll, ์บ์ฑ ์ ๋ต
- ๐น Mission 4 (์ต์ ํ): useMemo, useCallback, React.memo๋ฅผ ํตํ ์ฑ๋ฅ ๊ฐ์
| Frontend | Styling | State | Data Fetching | Build |
|---|---|---|---|---|
.
โโโ mission1/ # 1~3์ฃผ์ฐจ: React ๊ธฐ์ด, ์ํ ๊ด๋ฆฌ
โโโ mission2/ # 4~6์ฃผ์ฐจ: Router, API ์ฐ๋
โโโ mission3/ # 7~9์ฃผ์ฐจ: TanStack Query, Infinite Scroll
โโโ mission4/ # 10~12์ฃผ์ฐจ: ์ฑ๋ฅ ์ต์ ํ(useMemo, useCallback ๋ฑ)
โโโ README.md
- React ์ปดํฌ๋ํธ์ ์ํ ๊ด๋ฆฌ ๊ธฐ์ด ํ์ต
- Router์ API ์ฐ๋์ ํตํ SPA ๊ตฌ์กฐ ์ดํด
- TanStack Query๋ฅผ ํ์ฉํ ๋ฐ์ดํฐ ๊ด๋ฆฌ ๋ฐ ๋ฌดํ ์คํฌ๋กค ๊ตฌํ
- ์ฑ๋ฅ ์ต์ ํ ๋ฐ ํ์ ์ค์ฌ ์ฝ๋ ์ค๊ณ ๊ฒฝํ
- ์ฑ์ฅ ํฌ์ธํธ : ์ฌ์ฌ์ฉ์ฑ๊ณผ ์ ์ง๋ณด์๋ฅผ ๊ณ ๋ คํ ์ปดํฌ๋ํธ ์ค๊ณ ์ต๊ด
- ๋์ ๊ณผ์ : ์ํ ๊ด๋ฆฌ์ ๋น๋๊ธฐ ์ฒ๋ฆฌ์ ํ์ด๋ฐ ์ด์ โ TanStack Query + Zustand๋ก ํด๊ฒฐ
- ์ฑ๊ณผ : ํ ํ๋ก์ ํธ์ ๊ฐ์ธ ๊ณผ์ ๋ฅผ ๋ณํํ๋ฉฐ ์ค๋ฌดํ ํ์คํ ์ญ๋์ ํฌ๊ฒ ์ฑ์ฅ