🌳
λ§ν•˜λ©΄μ„œ λ°°μ›Œμš” μŠ€ν„°λ””/
🌱
[32회차] λ§ν•˜λ©΄μ„œ λ°°μ›Œμš” ν™œλ™κΈ°λ‘ /
πŸ’¬
μ°½λ―Όλ‹˜ ν”Όλ“œλ°±
πŸ’¬

μ°½λ―Όλ‹˜ ν”Όλ“œλ°±

[인수]
  1. μžκΈ°μ†Œκ°œ
      • β€˜κΉ€μ°½λ―Όμ΄λ‹€!’
      • κ³„νš, λͺ©ν‘œ μ’‹μ•„ν•˜κ³  μž˜ν•œλ‹€.
        • ν˜‘μ—…μ—λ„ 도움 λœλ‹€.
      • Q. κ°œλ°œμžλ‘œμ„œ λͺ©ν‘œ, μ‚¬λžŒμœΌλ‘œμ„œ λͺ©ν‘œ
        • 개발자 λͺ©ν‘œλŠ” ν”„λ‘ νŠΈμ—”λ“œλ‘œ μ‹œμž‘ν•΄μ„œ, λ°±μ—”λ“œμ™€ λ‹€λ₯Έ λΆ€λΆ„
          • Q. ν”„λ‘ νŠΈμ—”λ“œλ‘œ κ²°μ •ν•œ 이유 / 강점
            • λ‘˜ λ‹€ ν–ˆμ„ λ•Œ ν”„λ‘ νŠΈλ₯Ό 쑰금 더 μž˜ν–ˆλ‹€ 쑰금 λ‹€ 좔상적인 λŠλ‚Œ
            • 강점은 잘λͺ¨λ₯΄λ‹€.
        • μ‚¬λžŒ λͺ©ν‘œλŠ” 아직 잘 λͺ¨λ₯΄κ² λ‹€.
  1. λΆ€νŠΈμΊ ν”„ μ†Œκ°œ 및 μ–΄λ–€ κ²½ν—˜μ„ ν–ˆλŠ”μ§€
      • [μ˜λ„] : μ™œ ν”„λ‘ νŠΈμΌκΉŒ μ—λŒ€ν•œ 의문 해결을 μœ„ν•΄
      • ~~ : μ½”λ“œ μ½λŠ” 것과 μ‹€λ ₯μ„±μž₯의 계기
      • [Q. κ°€μž₯ 많이 μ„±μž₯ν•œ 뢀뢄이 μžˆλ‹€λ©΄?]
        • 기술적: react ν™œμš©λ„
        • λ¬Έμ„œν™”, ν˜‘μ—… λ“±..
      • μ„€λͺ…ν•˜λŠ”λ° 잘 μ™€λ‹Ώμ§€λŠ” μ•ŠμŒ. ν‚€μ›Œλ“œκ°€ μ—†λŠ” λŠλ‚Œ?, μ’€ κΈΈμ–΄μ§€λŠ” λŠλ‚Œ
      • [Q. μ½”μŠ€ μ™Έμ˜ 개인 곡뢀 μ–΄λ–»κ²Œ ν•˜κ³  κ³„μ‹œλŠ”μ§€]
        • μ˜λ„
        • ν”„λ‘œμ νŠΈ λ¦¬νŒ©ν† λ§, ν”„λ‘œμ νŠΈμ™€ ν•¨κ»˜ ν•™μŠ΅
        • [Q. κ°œμΈν”„λ‘œμ νŠΈλŠ” μ–΄λ–€ λͺ©ν‘œλ₯Ό 가지고 계신지]
          • 이전은 μ»΄ν¬λ„ŒνŠΈ ꡬ쑰 κ°œμ„ 
          • λͺ©ν‘œ:
  1. 아바타 μ»΄ν¬λ„ŒνŠΈ λ¦¬νŒ©ν† λ§ μ„€λͺ…
      • 이미지 μ—…λ‘œλ“œ 성곡 ν›„ API Call 2번, μ‹œκ°„μ μΈ μΈ‘λ©΄
      • Q. μ΅œμ ν™” κ΄€λ ¨ 진행 κ²½ν—˜
        • 폼 κ΅¬ν˜„ μ‹œ, μƒμœ„μ»΄ν¬λ„ŒνŠΈμ—μ„œ κ΄€λ¦¬ν•˜λŠ” λΆ€λΆ„
        • μ œμ‹œν•œ λ°©ν–₯ λ§žλŠ”μ§€ 잘 λͺ¨λ₯΄κ² λ‹€?
 
  1. μΈμ¦μ—μ„œ λ³΄μ•ˆκ΄€λ ¨ 처리 ν•œ 것 μžˆλŠ”μ§€
      • 인증 jwt ν† ν°μœΌλ‘œ 진행
        • CSRF λ°©μ§€ν•˜κΈ° μœ„ν•΄ μΏ ν‚€ μ‚¬μš©κ°€λŠ₯
      • [Q. CSRFλž€ 무엇인지]
        • μš”μ²­μ„ μœ„μ‘°ν•΄μ„œ μ„œλ²„λ₯Ό 곡격
          • CSRF λ°©μ–΄ κ°€λŠ₯ν•œ λ°©λ²•μžˆμ§€λ§Œ 잘λͺ¨λ₯΄κ² λ‹€.
[μ€€ν˜]
  • AuthRoute κ΅¬ν˜„ 방법?
    • λ¦¬μ•‘νŠΈ λΌμš°ν„°μ—μ„œ μ œκ³΅ν•˜λŠ” λΌμš°ν„° μ»΄ν¬λ„ŒνŠΈκ°€ μž‘λ™ν•˜κΈ° 전에 인증 ν•˜λŠ” λ‘œμ§μ„ λ„£κΈ° μœ„ν•΄ AuthRoute μ»΄ν¬λ„ŒνŠΈ λ§Œλ“¬
    • μ„œλ²„ μš”μ²­ ν•΄μ„œ 인가
  • pre-commit hook?
    • git-hookμ—μ„œ λ™μž‘ν•˜λŠ” 원리
    • lint-staged
    • μž₯점과 단점
  • github-action
    • 2μ£Ό ν”„λ‘œμ νŠΈ β†’ κ·Έλ•Œ λ‹Ήμ‹œμ—λŠ” 잘 λͺ°λžλ‹€.
  • λ°±μ—”λ“œλ₯Ό μƒˆλ‘œ κ΅¬μΆ•ν•˜λŠ”λ° μžˆμ–΄μ„œ κ°€μž₯ 큰 λͺ©μ 
    • 주어진 APIκ°€ ν”„λ‘œμ νŠΈμ— μ΅œμ ν™” λ˜μ§€ μ•ŠμŒ
  • μƒνƒœ 관리
    • Context apiκ°€ μ „μ—­ μƒνƒœ 관리 도ꡬ인가?
    • Context apiλ₯Ό μ‚¬μš©ν•œ 이유?
      • μ „μ—­μ μœΌλ‘œ μƒνƒœλ₯Ό 관리할 뢀뢄이 인증 μ •λ³΄λ‚˜ ν€΄μ¦ˆ 정보 정도 λ§κ³ λŠ” μ—†λ‹€
      • prop-drilling μ΅œμ†Œν™”
    • Context APIλ₯Ό μ‚¬μš©ν•˜λŠ”λ° μžˆλŠ” 문제점?
      • λ¦¬λ Œλ”λ§
    • μ΅œμ ν™” ν•˜κΈ° μœ„ν•΄ μ‚¬μš©ν–ˆλ˜ 방법?
  • 개인적으둜 μ§„ν–‰ν–ˆλ˜ ν”„λ‘œμ νŠΈ?
    • 가계뢀 개인 ν”„λ‘œμ νŠΈ
    • 바닐라 JS둜 μ§„ν–‰ν–ˆμ—ˆκ³ , node.js ν’€μŠ€νƒ 진행
  • λ¦¬μ•‘νŠΈλ₯Ό μ‚¬μš©ν•˜λ©΄μ„œ λŠλ‚€ μž₯점?
    • μ»΄ν¬λ„ŒνŠΈ 기반 관리
    • λΌμ΄λΈŒλŸ¬λ¦¬μ΄μ§€λ§Œ, μ–΄λŠμ •λ„ 정해진 ν‹€
      • hook, useState, useEffect,
[수경]
  • CSR의 λ™μž‘ κ³Όμ • + μž₯단점
    • μž₯점
      • 화면이 λ°”λ€” λ•Œ μ›ν•˜λŠ” λΆ€λΆ„λ§Œ λ°”λ€œ
      • ν™”λ©΄ κΉœλΉ‘μž„ 적음
    • 단점
      • htmlν•˜λ‚˜λ‘œ μž‘λ™
      • SEO에 λΆ€μ‘±
  • ν”„λ‘ νŠΈμ—”λ“œ κ°œλ°œμžλ‘œμ„œ μ„±κ³΅ν•˜λŠ” κ²ƒμ΄λž€ ?
    • μ§€κΈˆμ²˜λŸΌ ν”„λ‘ νŠΈμ—”λ“œ κ°œλ°œμ— λ²„λ²…μž„X
    • 개발 속도도 μš”κ΅¬μ‚¬ν•­μ— 맞게, λΉ λ₯΄κ²Œ, λ§‰νž˜μ΄ μ—†λ‹€.
  • ν”„λ‘œμ νŠΈ νŒ€μž₯ κ²½ν—˜
    • νŒ€ 리딩이 μ‰½μ§€λŠ” μ•Šμ•˜λ‹€.
    • νŒ€ 의견 μ·¨ν•©, 정리, κ²°λ‘ λ‚΄λ¦¬λŠ” μ—­ν• 
    • λ…Έν•˜μš°?
      • ~λͺ¨λ₯΄κ² μ§€λ§Œ 자주 λ‚˜μ˜€λŠ” λ“―
      • νŒ€μ›λ“€μ˜ 생각을 μ΄λŒμ–΄ λ‚΄κΈ° μœ„ν•΄ κΎΈμ€€ν•œ 질문 β†’ 생각 μœ λ„
  • μΌν•˜κ³  싢은 쑰직 λ¬Έν™”
    • λΆ„μœ„κΈ°κ°€ νŽΈν•˜λ‹€
    • μžμ‹ μ˜ 생각을 νŽΈν•˜κ²Œ 많이 μ–˜κΈ°ν•  수 있으면 μ’‹κ² λ‹€.
      •  
[인수]
  • μ·¨λ―Έ
    • μ˜λ„: 슀트레슀 ν•΄μ†ŒλŠ” μ–΄λ–»κ²Œ ν• κΉŒ?
    • μ·¨λ―Έκ°€ μ—†μ—ˆλ‹€.
      • μš΄λ™
 
μ°½λ―Όλ‹˜ μ†Œκ°
  • μž˜ν–ˆλ‹€κ³ λŠ” μƒκ°ν•˜μ§„ μ•Šμ§€λ§Œ, μ†”μ§ν•˜κ²Œ λ§ν–ˆλ‹€.
    • μ§ˆλ¬Έμ— λŒ€ν•΄ μƒκ°ν•˜μ§€ μ•Šκ³  λ°”λ‘œλ°”λ‘œ λ§ν•œ λŠλ‚Œ