🐧 λ¦¬νŒ©ν† λ§μ„ μ‹œμž‘ν•˜κΈ° μ•žμ„œ ν”„λ‘œμ νŠΈ μ†Œκ°œ

bindLogo.png

B1nd Team Project "도담도담(DodamDodam)"

B1nd νŒ€μ€ λŒ€κ΅¬μ†Œν”„νŠΈμ›¨μ–΄κ³ λ“±ν•™κ΅μ— μžˆλŠ” 개발 νŒ€μ΄λ‹€.

πŸ‘‰ 도담도담(DodamDodam)


🎬 배경

도담도담은 κΈ°μˆ™ν•™κ΅μ—μ„œ ν•™μƒλ“€μ˜ μƒν™œκ³Ό 관리λ₯Ό νŽΈν•˜κ²Œ ν•˜κΈ° μœ„ν•΄μ„œ λ§Œλ“€μ–΄μ§„ 학생 관리 μ‹œμŠ€ν…œμž…λ‹ˆλ‹€.

μ œκ°€ μ§€κΈˆ λ‹€λ‹ˆκ³  μžˆλŠ” λŒ€κ΅¬μ†Œν”„νŠΈμ›¨μ–΄κ³ λ“±ν•™κ΅λŠ” ν˜„μž¬ κΈ°μˆ™ν•™κ΅λ‘œ 운영되고 μžˆλŠ” λ§ˆμ΄μŠ€ν„°κ³ λ“±ν•™κ΅μž…λ‹ˆλ‹€.
학ꡐλ₯Ό μ§€λ‚΄λŠ” 학생듀은 κ΅κ³Όμ‹œκ°„μ΄ λλ‚œ 4μ‹œ 30λΆ„ μ΄ν›„μ—λŠ” 학ꡐ μ•ˆμ—μ„œ μžμ‹ μ΄ μ›ν•˜λŠ” κ³³μ—μ„œ 곡뢀λ₯Ό ν•  수 μžˆμŠ΅λ‹ˆλ‹€. ν•˜μ§€λ§Œ ν•™κ΅μ—μ„œλŠ” 관리λ₯Ό μœ„ν•΄ ν•™μƒλ“€μ—κ²ŒλŠ” μœ„μΉ˜λ₯Ό μ’…μ΄λ‘œλœ μž₯뢀에 ν•„μˆ˜λ‘œ 적도둝 ν•˜κ³  μžˆμŠ΅λ‹ˆλ‹€. λ˜ν•œ μ„ μƒλ‹˜λ“€λ„ μž₯λΆ€λ₯Ό λ“€κ³  λ‹€λ‹ˆμ‹œλ©° ν•™μƒλ“€μ˜ μœ„μΉ˜λ₯Ό νŒŒμ•…ν•΄μ•Όλ§Œ ν•©λ‹ˆλ‹€. 그리고 학생듀은 μ™ΈμΆœ, 외박을 ν•˜κΈ° μœ„ν•΄μ„œλŠ” λΆ€λͺ¨λ‹˜μ˜ ν—ˆλ½μ„ λ°›κ³ λ‚˜μ„œ μ„ μƒλ‹˜κ»˜ 신청을 ν•΄μ•Όλ§Œ ν•©λ‹ˆλ‹€. 그리고 μ„ μƒλ‹˜κ»˜μ„œλŠ” κ·Έ 기둝을 μž₯뢀에 기둝해 λ‘¬μ•Όν•©λ‹ˆλ‹€.

μ΄λŸ°μ‹μœΌλ‘œ ꡉμž₯히 λΆˆνŽΈν•˜κ³  νž˜λ“€κ²Œ κΈ°μˆ™ν•™κ΅μ—μ„œ 학생듀이 μƒν™œν•˜κ³  μ„ μƒλ‹˜λ“€κ»˜μ„œ κ΄€λ¦¬ν•˜κ³  κ³„μ‹­λ‹ˆλ‹€. μ΄λŸ¬ν•œ λΆˆνŽΈν•¨κ³Ό λ¬Έμ œμ λ“€μ„ κ°œμ„ ν•΄ λ‚˜κ°€κ³  νŽΈν•˜κ²Œ 학ꡐ μƒν™œμ„ ν•˜κ³ μž ν•΄μ„œ λ“±μž₯ν•˜κ²Œ 된 것이 도담도담(학생 관리 μ‹œμŠ€ν…œ)μž…λ‹ˆλ‹€.


πŸ“’ κΈ°λŠ₯ μ†Œκ°œ

DodamDodam.PNG

1. μ™ΈμΆœ, μ™Έλ°• μ‹ μ²­ 및 관리

  • 학생듀은 μ™ΈμΆœκ³Ό 외박을 각 λͺ¨λ°”일 μ•±κ³Ό μ›ΉμœΌλ‘œ μ‹ μ²­ 및 쑰회λ₯Ό ν•  수 μžˆμŠ΅λ‹ˆλ‹€. λ˜ν•œ 신청을 ν•œ 후에도 승인이 되기 μ „κΉŒμ§€ μ‹ μ²­ λ‚΄μš©μ„ λ°”κΏ€ 수 μžˆμŠ΅λ‹ˆλ‹€.

  • μ„ μƒλ‹˜κ»˜μ„œλŠ” μœˆλ„μš°μ•±μ„ 톡해 ν•™μƒλ“€μ˜ μ‹ μ²­ν•œ λ‚΄μš©λ“€μ„ λ³Ό 수 있으며 관리할 수 μžˆμŠ΅λ‹ˆλ‹€.

2. μœ„μΉ˜ μ‹ μ²­ 및 관리

  • 학생듀은 κ΅κ³Όμ‹œκ°„μ΄ λλ‚œ 이후 μžμ‹ μ˜ μœ„μΉ˜λ₯Ό λͺ¨λ°”일 μ•±κ³Ό μ›ΉμœΌλ‘œ μ‹ μ²­ 및 쑰회λ₯Ό ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

  • μ„ μƒλ‹˜κ»˜μ„œλŠ” μ„ μƒλ‹˜μš© νƒœλΈ”λ¦ΏμœΌλ‘œ λŒμ•„λ‹€λ‹ˆμ‹œλ©° ν•™μƒλ“€μ˜ μœ„μΉ˜λ₯Ό 확인할 수 있고, μœˆλ„μš° μ•±μœΌλ‘œ ν•™μƒλ“€μ˜ μœ„μΉ˜ 데이터λ₯Ό 관리할 수 μžˆμŠ΅λ‹ˆλ‹€.

3. 기상솑 μ‹ μ²­ 및 관리

  • 학생듀은 아침에 일어날 λ•Œ 듣고싢은 λ…Έλž˜λ₯Ό μ‹ μ²­ν•  수 있으며 μ–΄λ–€ λ…Έλž˜κ°€ λ‚˜μ™”μ—ˆλŠ”μ§€ μ•Œ 수 μžˆμŠ΅λ‹ˆλ‹€.

  • μ„ μƒλ‹˜κ»˜μ„œλŠ” μœˆλ„μš° 앱을 톡해 학생듀이 μ‹ μ²­ν•œ 기상솑을 μ–΄λŠ λ‚ μ§œμ— ν‹€ 것인지 μ •ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

4. λ²„μŠ€ μ‹ μ²­ 및 관리

  • 학생듀은 μ§‘κ°€λŠ” 주에 λͺ¨λ°”일 μ•±κ³Ό μ›ΉμœΌλ‘œ 신청을 톡해 ν•™κ΅μ—μ„œ μ œκ³΅ν•΄μ£ΌλŠ” λ²„μŠ€λ₯Ό νƒˆ 수 μžˆμŠ΅λ‹ˆλ‹€.

  • μ„ μƒλ‹˜κ»˜μ„œλŠ” μœˆλ„μš° 앱을 톡해 λ²„μŠ€ λͺ©λ‘κ³Ό ν•™μƒλ“€μ˜ λ²„μŠ€ μ‹ μ²­ 데이터λ₯Ό 관리할 수 μžˆμŠ΅λ‹ˆλ‹€.

5. 상담 μ‹ μ²­ 및 관리

  • 학생듀은 μžμ‹ μ΄ μƒλ‹΄ν•˜κ³  싢은 μ„ μƒλ‹˜κ»˜ 상담을 μ‹ μ²­ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

  • μ„ μƒλ‹˜κ»˜μ„œλŠ” μœˆλ„μš° 앱을 톡해 학생이 μ‹ μ²­ν•œ 상담 데이터λ₯Ό 관리할 수 있으며, 상담 μ‹œκ°„μ„ μ •ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

6. λΆ„μ‹€λ¬Ό κ²Œμ‹œνŒ

  • μžμ‹ μ΄ λΆ„μ‹€ν•œ 물건과 μŠ΅λ“λ¬Όμ„ κ³΅μœ ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

πŸ” 개발 기술 및 문제점 μ„€λͺ…

😎 μ‚¬μš©λœ 기술

- React.js

- MobX

- Sass

😭 문제점 μ„€λͺ…

  1. μ œλŒ€λ‘œ μ‚¬μš©λ˜μ§€ μ•Šμ€ ESLint
    ESLintλ₯Ό 톡해 같이 μž‘μ—…ν•˜λŠ” κ°œλ°œμžλ“€κ³Ό μ½”λ“œ μŠ€νƒ€μΌμ„ 톡일 μ‹œν‚¬λ €κ³  ν–ˆμœΌλ‚˜ λΆˆνŽΈν•˜κ³  μ΅μˆ™ν•˜μ§€ μ•Šμ€ 이유둜 μ½”λ“œμ— μ‰½κ²Œ μ μš©λ˜μ§€ λͺ»ν–ˆμŠ΅λ‹ˆλ‹€. ν›„λ°˜μ—λŠ” μ΅μˆ™ν•΄μ Έ μ μš©λ˜μ–΄μ§„ λͺ¨μŠ΅μ΄ 쑰금 λ³΄μ΄λ‚˜ μ–΄λŠ λΆ€λΆ„μ˜ μ½”λ“œλŠ” μŠ€νƒ€μΌμ΄ 달라 κΉ”λ”ν•˜κ²Œ 보이지 μ•ŠμœΌλ©°, λ‚˜μ€‘μ— κ°€μ„œ μœ μ§€λ³΄μˆ˜ν•˜κΈ° νž˜λ“€ 것 κ°™μŠ΅λ‹ˆλ‹€.

  2. λ‚˜λˆ„μ–΄μ Έ μžˆμ§€ μ•Šμ€ λΉ„μ¦ˆλ‹ˆμŠ€ 둜직과 뷰둜직
    처음으둜 μ‹œμž‘ν–ˆλ˜ λ¦¬μ•‘νŠΈ ν”„λ‘œμ νŠΈλΌμ„œ 아무것도 λͺ¨λ₯΄κ³  ν•˜λ‚˜μ˜ νŒŒμΌμ— 뷰둜직과 λΉ„μ¦ˆλ‹ˆμŠ€ λ‘œμ§μ„ ν•¨κ»˜ μ‚¬μš©ν•˜λ©° μ½”λ“œλ₯Ό μž‘μ„±ν–ˆμŠ΅λ‹ˆλ‹€. κ·Έλ ‡κ²Œ μ§„ν–‰λœ ν”„λ‘œμ νŠΈλŠ” ν›„λ°˜μ— κ°€μ„œ λ§Žμ€ 였λ₯˜λ“€κ³Ό λΆˆμ•ˆμ •ν•œ λͺ¨μŠ΅μ„ λ³΄μ˜€κ³ , μœ μ§€λ³΄μˆ˜ λ˜ν•œ νž˜λ“€κ²Œ λ˜μ—ˆμœΌλ©° ν›„λ°°λ“€μ—κ²Œλ„ 쒋은 μ½”λ“œλ₯Ό 물렀주지 λͺ»ν•  것 κ°™λ‹€λŠ” 생각을 ν•˜κ²Œ λ˜μ—ˆμŠ΅λ‹ˆλ‹€.

  3. λΆˆν•„μš”ν•œ μ½”λ“œλ“€μ˜ 쑴재
    μ²˜μŒμ—λŠ” κΈ°λŠ₯을 κ΅¬ν˜„ν•˜κΈ° μœ„ν•΄μ„œ μ—¬λŸ¬κ°€μ§€ μ‹œλ„μ™€ λ‹€μ–‘ν•œ κΈ°μˆ λ“€μ„ 써가며, ν”„λ‘œμ νŠΈλ₯Ό μ§„ν–‰ν•΄λ‚˜κ°”μŠ΅λ‹ˆλ‹€. ν•˜μ§€λ§Œ κ·Έλ‘œμΈν•΄ μ‚¬μš©λ˜μ§€ μ•ŠλŠ” μ½”λ“œλ“€λ„ μ‘΄μž¬ν•˜κ²Œ λ˜μ—ˆμœΌλ©° λΆˆν•„μš”ν•˜κ²Œ μ½”λ“œ μ€„μ˜ μˆ˜κ°€ μ¦κ°€ν–ˆμŠ΅λ‹ˆλ‹€. μ½”λ“œλ₯Ό μ΄ν•΄ν•˜κΈ° μ–΄λ €μ›Œμ‘ŒμœΌλ©°, μ›Ή μžμ²΄κ°€ 많이 λ¬΄κ±°μ›Œμ§€λŠ” ν˜„μƒμ΄ λ‚˜νƒ€λ‚˜κ²Œ λ˜μ—ˆμŠ΅λ‹ˆλ‹€.


✍ μ•žμœΌλ‘œμ˜ κ³„νš 및 마무리

μ•žμ„œ μ„€λͺ…ν•œ λ¬Έμ œλ“€μ„ μ°¨κ·Όμ°¨κ·Ό 고쳐가며 λ¦¬νŒ©ν† λ§μ„ μ§„ν–‰ν•˜κ³  μ‹ΆμŠ΅λ‹ˆλ‹€. ν›„λ°°λ“€μ—κ²Œλ„ λΆ€λ„λŸ¬μ›€ 없이 보여쀄 수 μžˆλŠ” μ½”λ“œλ₯Ό 짜고 μ‹ΆμŠ΅λ‹ˆλ‹€. λ˜ν•œ μ•žμœΌλ‘œμ˜ λ¦¬νŒ©ν† λ§ν•˜λŠ” κ³Όμ •κ³Ό λ‚΄μš©λ“€μ„ Velogλ₯Ό 톡해 κΈ°λ‘ν•˜κ³  κ³΅μœ ν•˜κ³  μ‹ΆμŠ΅λ‹ˆλ‹€.

μ§€κΈˆκΉŒμ§€ κΈΈκ³  μ–΄μ„€νŽλ˜ 첫 ν”„λ‘œμ νŠΈ μ†Œκ°œλ₯Ό 마치며 μ½μ–΄μ£Όμ…”μ„œ κ°μ‚¬ν•©λ‹ˆλ‹€. πŸ‘‹