λ νΈλ‘ κ°μ±μ μμ λ―Έλμ΄ νλ«νΌ
μ¬μ©μλ€μ΄ μκ°κ³Ό μκ°μ 곡μ ν μ μλ νλμ μ΄λ©΄μλ ν₯μλ₯Ό λΆλ¬μΌμΌν€λ νΈμν° ν΄λ‘ νλ‘μ νΈμ λλ€.
π Live Demo
μ΄λ©μΌ: [email protected]
λΉλ°λ²νΈ: test1234567
- νμκ°μ & λ‘κ·ΈμΈ: iron-sessionμ νμ©ν μμ ν μΈμ κ΄λ¦¬
- λΉλ°λ²νΈ μνΈν: bcryptjsλ₯Ό ν΅ν μμ ν λΉλ°λ²νΈ ν΄μ±
- μ€μκ° μ ν¨μ± κ²μ¦: Zod μ€ν€λ§λ₯Ό νμ©ν ν΄λΌμ΄μΈνΈ/μλ² μλ°©ν₯ κ²μ¦
- νΈμ μμ±: 200μ μ νμ μ€μκ° κΈμ μ μΉ΄μ΄ν°
- νΈμ μμ & μμ : μμ μ κΆν νμΈμ ν΅ν μμ ν CRUD
- μ€μκ° μν νμ: λκ΄μ μ λ°μ΄νΈ(Optimistic Updates)λ‘ λΆλλ¬μ΄ UX
- μ’μμ μμ€ν : μ€μκ° μ’μμ ν κΈ λ° μΉ΄μ΄ν°
- λκΈ μμ€ν : νΈμλ³ λκΈ μμ±, μμ , μμ
- μ¬μ©μ νλ‘ν: κ°μΈμ 보 μμ , λΉλ°λ²νΈ λ³κ²½, νμ νν΄
- ν΅ν© κ²μ: νΈμ λ΄μ©κ³Ό μ¬μ©μλͺ λμ κ²μ
- νμ΄μ§λ€μ΄μ : ν¨μ¨μ μΈ λ°μ΄ν° λ‘λ©κ³Ό νμ
- μ¬μ©μ νλ‘ν νμ΄μ§: κ°μΈλ³ νΈμ λͺ¨μ λ° νλ κΈ°λ‘
- λ€ν¬λͺ¨λ μ§μ: λΌμ΄νΈ/λ€ν¬ ν λ§ ν κΈ
- λ νΈλ‘ λμμΈ: ν½μ ν°νΈμ λ νΈλ‘ μ€νμΌμ λ νΉν UI
- λ°μν λμμΈ: λͺ¨λ°μΌλΆν° λ°μ€ν¬ν±κΉμ§ μλ²½ λμ
- λ‘λ© μν κ΄λ¦¬: μ€μΌλ ν€ UI
- Next.js 15
- TypeScript
- TailwindCSS
- Lucide React
- Next.js API Routes & Server Actions
- Prisma
- iron-session
- bcryptjs
- Zod
5urf-twitter/
βββ app/
β βββ (auth)/ # μΈμ¦ νμ΄μ§ (λ‘κ·ΈμΈ/νμκ°μ
)
β β βββ log-in/
β β βββ create-account/
β βββ (tabs)/ # μ£Όμ ν λ€λΉκ²μ΄μ
λΌμ°νΈ κ·Έλ£Ή
β β βββ (home)/ # ν νΌλ
β β βββ search/ # ν€μλ κ²μ
β β βββ tweets/[id]/ # νΈμ μμΈ λ³΄κΈ° λ° μμ
β β βββ users/[username]/ # μ μ νλ‘ν νμ΄μ§
β β βββ settings/ # νκ²½μ€μ νμ΄μ§
β βββ api/ # API λΌμ°νΈ
β βββ actions/ # ν
λ§ λ± UI κ΄λ ¨ μλ² μ‘μ
βββ components/
β βββ auth/ # λ‘κ·ΈμΈ/νμκ°μ
UI
β βββ tweet/ # νΈμ μΉ΄λ λ° μ
λ ₯μ°½
β βββ response/ # λκΈ UI
β βββ search/ # κ²μ μ
λ ₯ λ° κ²°κ³Ό
β βββ profile/ # νλ‘ν μμ /미리보기
β βββ common/ # κ³΅ν΅ λ²νΌ, λ‘λ© λ±
β βββ layout/ # ν€λ, νλ° λ± λ μ΄μμ μ»΄ν¬λνΈ
βββ lib/ # κ³΅ν΅ μ νΈλ¦¬ν° λ° μ€μ
β βββ db.ts # Prisma DB μ°κ²°
β βββ session.ts # μΈμ
μ²λ¦¬
β βββ auth.ts # iron-session κΈ°λ° μΈμ¦ νΈλ€λ¬
β βββ constants.ts # μμ λ° μ ν¨μ± κ·μΉ
βββ types/ # 컀μ€ν
νμ
λ° μΈν°νμ΄μ€
βββ prisma/ # Prisma μ€ν€λ§ λ° λ§μ΄κ·Έλ μ΄μ
- λκ΄μ μ λ°μ΄νΈ: μ’μμ, λκΈ λ± μ¦μ λ°μμΌλ‘ λ°μμ± κ·Ήλν
- μ€μΌλ ν€ λ‘λ©: μ½ν μΈ λ‘λ© μ€ μμ°μ€λ¬μ΄ νλ μ΄μ€νλ
- μ€μκ° νΌ κ²μ¦: μ¬μ©μ μ λ ₯μ λν μ¦κ°μ μΈ νΌλλ°±
- μλ²μ¬μ΄λ μΈμ : ν΄λΌμ΄μΈνΈ λ ΈμΆ μλ μμ ν μΈμ¦
- κΆν κΈ°λ° μ κ·Ό μ μ΄: μμ μλ§ μμ /μμ κ°λ₯
- SQL μΈμ μ λ°©μ§: Prisma ORMμ ν΅ν μμ ν 쿼리
- Next.js μΊμ±: μλ μ΅μ νλ λ°μ΄ν° νμΉ
- λ νΈλ‘ ν λ§: Press Start 2P ν°νΈμ ν½μ μνΈ κ°μ±
- μΌκ΄λ λμμΈ μμ€ν : μ¬μ¬μ© κ°λ₯ν μ»΄ν¬λνΈ μν€ν μ²
