Skip to content
였예림 Ria Oh edited this page May 1, 2025 · 74 revisions

μ½”λ“œ 리뷰λ₯Ό ν•˜λ©΄μ„œ νŒ€μ› 간에 ν•©μ˜ν•œ 개발 κ΄€μŠ΅μ„ λ¬Έμ„œν™”ν•©λ‹ˆλ‹€. 항상 μ΅œμ‹ μ˜ μƒνƒœλ₯Ό μœ μ§€ν•˜κΈ° μœ„ν•΄μ„œ νŒ€μ› λͺ¨λ‘ λ…Έλ ₯ν•΄μ£Όμ…¨μœΌλ©΄ μ’‹κ² μŠ΅λ‹ˆλ‹€.

ν”„λ‘œμ νŠΈ ꡬ쑰

  • src/components μ•„λž˜μ— 폴더λ₯Ό λ§Œλ“€κ³ , κ·Έ μ•ˆμ— μ»΄ν¬λ„ŒνŠΈ 파일, μŠ€ν† λ¦¬ 파일, ν…ŒμŠ€νŠΈ νŒŒμΌμ„ μœ„μΉ˜μ‹œν‚΅λ‹ˆλ‹€.
  • 폴더 이름, 파일 이름, μ»΄ν¬λ„ŒνŠΈ 이름은 λͺ¨λ‘ PascalCase둜 letter caseλ₯Ό ν†΅μΌν•©λ‹ˆλ‹€.
  • λ³€μˆ˜ 이름, ν•¨μˆ˜ 이름, prop 이름은 λͺ¨λ‘ camelCase둜 letter caseλ₯Ό ν†΅μΌν•©λ‹ˆλ‹€.
  • index.tsx νŒŒμΌμ„ ν†΅ν•΄μ„œ re-exportν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€.
β”œβ”€β”€ src
β”‚   β”œβ”€β”€ components
β”‚   β”‚   β”œβ”€β”€ Checkbox
β”‚   β”‚   β”‚   β”œβ”€β”€ Checkbox.stories.tsx
β”‚   β”‚   β”‚   β”œβ”€β”€ Checkbox.test.tsx
β”‚   β”‚   β”‚   └── Checkbox.tsx

μ½”λ“œ μž‘μ„± 및 κ²€ν† 

  • μ»΄ν¬λ„ŒνŠΈ 섀계와 κ΅¬ν˜„μ€ κ΅¬λΆ„ν•΄μ„œ Pull Requestλ₯Ό μ œμΆœν•©λ‹ˆλ‹€. λ°”λžŒμ§ν•œ μ»΄ν¬λ„ŒνŠΈ API에 λŒ€ν•œ 사전 ν•©μ˜λ₯Ό μ§„ν–‰ν•¨μœΌλ‘œμ¨ μ—‰λš±ν•œ κ΅¬ν˜„μ„ λ°©μ§€ν•˜κΈ° μœ„ν•¨μž…λ‹ˆλ‹€.
  • PR 병합을 ν•˜κΈ° μœ„ν•΄μ„œλŠ” μ΅œμ†Œ 1λͺ…μ˜ λ™λ£Œ κ°œλ°œμžλ‘œλΆ€ν„° μŠΉμΈμ„ λ°›μ•„μ•Ό ν•˜μ§€λ§Œ, ν’ˆμ§ˆ ν–₯상을 μœ„ν•΄μ„œ κΈ΄κΈ‰ 건이 μ•„λ‹ˆλΌλ©΄ 2개의 μŠΉμΈμ„ λ°›λŠ” 것이 ꢌμž₯λ©λ‹ˆλ‹€.
  • [Proposed] "Resolve conversation" λ²„νŠΌμ€ μ½”λ“œ κ²€ν† μžκ°€ ν”Όλ“œλ°±μ΄ 본인이 μ˜λ„ν•œ λŒ€λ‘œ μ‘°μΉ˜λ˜μ—ˆλŠ”μ§€ ν™•μΈν•˜λŠ” μ°¨μ›μ—μ„œ λˆ„λ¦…λ‹ˆλ‹€. μ½”λ“œ μž‘μ„±μžκ°€ μž„μ˜λ‘œ Resolved ν‘œμ‹œν•  μ‹œ λΆˆν•„μš”ν•œ μ˜€ν•΄κ°€ 생길 수 μžˆμŠ΅λ‹ˆλ‹€.

μ»΄ν¬λ„ŒνŠΈ

  • ν•¨μˆ˜ μ»΄ν¬λ„ŒνŠΈ μž‘μ„±ν•  λ•ŒλŠ” function ν‚€μ›Œλ“œλ‘œ μ„ μ–Έν•΄μ£Όμ„Έμš”.
  • 이벀트 ν•Έλ“€λŸ¬λ₯Ό μž‘μ„±ν•  λ•ŒλŠ” ν™”μ‚΄ν‘œ ν•¨μˆ˜λ₯Ό μ„ μ–Έ 후에 λ³€μˆ˜μ— ν• λ‹Ήν•΄μ£Όμ„Έμš”.

μŠ€ν† λ¦¬

  • μŠ€ν† λ¦¬ 제λͺ©μ΄ μ»΄ν¬λ„ŒνŠΈ 경둜λ₯Ό ν†΅ν•΄μ„œ μžλ™μœΌλ‘œ μœ μΆ”λ  수 μžˆλ„λ‘ title μ†μ„±μ˜ 값은 μƒλž΅ν•΄μ£Όμ„Έμš”. λ¬Έμžμ—΄λ‘œ 직접 λͺ…μ‹œν•˜λ©΄ νƒ€μž… μ•ˆμ „ν•˜μ§€ μ•Šκ³ , μ»΄ν¬λ„ŒνŠΈ 이름을 λ°”κΏ€ λ•Œ 싱크가 κΉ¨μ§€κΈ° μ‰½μŠ΅λ‹ˆλ‹€.
  • μ—¬λŸ¬ μŠ€ν† λ¦¬μ— κ±Έμ³μ„œ ν•„μš”ν•œ argsλŠ” μŠ€ν† λ¦¬ μˆ˜μ€€μ—μ„œ μ€‘λ³΅ν•˜μ§€ λ§ˆμ‹œκ³  μ»΄ν¬λ„ŒνŠΈ μˆ˜μ€€μ—μ„œ μ§€μ •ν•΄μ£Όμ„Έμš”.

ν…ŒμŠ€νŠΈ

  • ν…ŒμŠ€νŠΈ νŒŒμΌμ€ λ³„λ„μ˜ 디렉토리에 쀑앙화 ν•˜μ§€ μ•Šκ³  μ• ν”Œλ¦¬μΌ€μ΄μ…˜ 파일 λ°”λ‘œ μ˜†μ— λ‘‘λ‹ˆλ‹€.
  • λ‹¨μˆœν•œ ν…ŒμŠ€νŠΈ ꡬ쑰λ₯Ό μœ„ν•΄μ„œ ν…ŒμŠ€νŠΈ λŒ€μƒ λͺ¨λ“ˆμ˜ ꡬ쑰가 λ³΅μž‘ν•˜μ§€ μ•Šλ‹€λ©΄ describe()-it() λŒ€μ‹ μ— test()λ₯Ό μ”λ‹ˆλ‹€.
  • 이벀트λ₯Ό λ°œμƒμ‹œν‚¬ λ•ŒλŠ” fireEvent λŒ€μ‹ μ— @testing-library/user-event νŒ¨ν‚€μ§€λ₯Ό μ‚¬μš©ν•΄ μ£Όμ„Έμš”. λΈŒλΌμš°μ € μž…μž₯이 μ•„λ‹Œ μ‚¬μš©μž μž…μž₯μ—μ„œ ν…ŒμŠ€νŠΈλ₯Ό μž‘μ„±ν•˜κΈ° μœ„ν•¨μž…λ‹ˆλ‹€.

μ˜μ‘΄μ„±

  • 항상 μ˜μ‘΄μ„±μ„ μ΅œμ‹  μƒνƒœλ‘œ μœ μ§€ν•˜κΈ° μœ„ν•΄μ„œ Dependabot을 μ½”λ“œ μ €μž₯μ†Œμ— μ„€μ •ν•΄λ†“μ•˜μŠ΅λ‹ˆλ‹€.
  • Dependabot이 올린 PR을 λŠ¦μ§€ μ•Šκ²Œ κ²€ν†  및 λ³‘ν•©ν•˜κ³  μƒˆλ‘œμš΄ 버전이 μΌμœΌν‚€λŠ” breaking changesλ₯Ό λŒ€μ‘ν•˜λŠ” μž‘μ—…μ€ νŒ€ 개발자 λͺ¨λ‘μ˜ 곡동 μ±…μž„μž…λ‹ˆλ‹€.
  • Dependabot이 올린 PR을 λ°˜λ“œμ‹œ PR μ½”λ©˜νŠΈλ₯Ό ν†΅ν•΄μ„œ Dependabotμ—κ²Œ μ›ν•˜μ‹œλŠ” μž‘μ—…μ„ μ‹œμΌœμ£Όμ„Έμš”. 직접 μˆ˜μ •ν•˜μ‹œλ©΄ Dependabot은 ν•΄λ‹Ή PR을 더 이상 μžλ™μœΌλ‘œ 관리해주지 μ•ŠμŠ΅λ‹ˆλ‹€.

Clone this wiki locally