/who-be-go

Primary LanguageHTML

🎬 ν›„λΉ„κ³  | λ‚˜λ§Œμ˜ μ˜ν™” 감상 기둝 μ•±



🎬 κ°œμš”

🎬 β€™ν›„λΉ„κ³ 'λŠ” β€˜ν›„κΈ° 무비 κ³ '의 μ€„μž„λ§λ‘œ λ‚˜λ§Œμ˜ μ˜ν™” 감상문 기둝 μ„œλΉ„μŠ€μž…λ‹ˆλ‹€.

🍿 μ˜ν™” 랜덀 μΆ”μ²œ 및 일별 λ°•μŠ€μ˜€ν”ΌμŠ€ μˆœμœ„ 정보λ₯Ό μ œκ³΅ν•©λ‹ˆλ‹€.

⭐️ μ˜ν™” 검색 및 상세 정보λ₯Ό μ œκ³΅ν•˜λ©° 감상문 μž‘μ„±μ‹œ λ‚˜μ˜ 별점을 기둝할 수 μžˆμŠ΅λ‹ˆλ‹€.

πŸ–‹ ν›„λΉ„κ³ λ₯Ό 톡해 λ‚΄κ°€ λ³Έ μ˜ν™”λ₯Ό κΈ°λ‘ν•΄λ³΄μ„Έμš”! ν›„λΉ„κ³  ~ πŸ’«

βš™οΈ 개발 ν™˜κ²½ 및 배포 URL

[기술]

  • FrontEnd: TypeScript, SCSS
  • BackEnd: 제곡된 API , μ˜ν™”μ§„ν₯μœ„μ›νšŒ API , ν•œκ΅­μ˜ν™”μžλ£Œμ› API

❗️ Internet Explorer μ—μ„œλŠ” μ œλŒ€λ‘œ λ™μž‘ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€. 타 λΈŒλΌμš°μ € μ‚¬μš©μ„ ꢌμž₯ν•©λ‹ˆλ‹€.


[개발 ν™˜κ²½]


[배포 URL]



βš™οΈ κ΅¬ν˜„ κΈ°λŠ₯

- πŸ” 인증
    - 둜그인
    - νšŒμ›κ°€μž…
    - ν”„λ‘œν•„ μ„€μ •
    - ν”„λ‘œν•„ μˆ˜μ •
    - μœ νš¨μ„± 검사
- 🎬 μ˜ν™” μ„œλΉ„μŠ€
    - 랜덀 μΆ”μ²œ
    - 일별 λ°•μŠ€μ˜€ν”ΌμŠ€ μˆœμœ„
    - μ˜ν™” 검색 및 상세정보
- πŸ“ 감상문
    - μ˜ν™” 별점
    - 감상문 μž‘μ„±
    - 감상문 μˆ˜μ •
    - 감상문 μ‚­μ œ

πŸš€ μ—­ν•  λΆ„λ‹΄

πŸ‘©πŸ»β€πŸ’» μ΄μˆ˜λΉˆ

  • ν”„λ‘œμ νŠΈ 초기 μ„ΈνŒ…
  • UI λ””μžμΈ / ν”Όκ·Έλ§ˆ μž‘μ—…
  • πŸ– UI : Component λͺ¨λ“ˆν™”, νšŒμ›κ°€μž…, ν”„λ‘œν•„ μ„€μ •, μ˜ν™” 랜덀 μΆ”μ²œ, μ˜ν™” 차트,
    λ§ˆμ΄νŽ˜μ΄μ§€, λ‘œλ”©μ€‘/404 νŽ˜μ΄μ§€, λ°˜μ‘ν˜• λŒ€μ‘, νŒŒλΉ„μ½˜
  • πŸ›  κΈ°λŠ₯ κ΅¬ν˜„ : νšŒμ›κ°€μž…, μ˜ν™” 랜덀 μΆ”μ²œ

πŸ‘©πŸ»β€πŸ’» μ΄ν˜œμ›

  • πŸ– UI : λͺ¨λ‹¬, μ˜ν™” 감상문 등둝 νŽ˜μ΄μ§€
  • πŸ›  κΈ°λŠ₯ κ΅¬ν˜„ : λͺ¨λ‹¬, λ“œλ‘­λ‹€μš΄, μ‚¬μš©μž ν”„λ‘œν•„ νŽ˜μ΄μ§€, μ˜ν™” 감상문 μž‘μ„±, 등둝, μˆ˜μ •, μ‚­μ œ
    감상문 별점 κΈ°λŠ₯, λ‘œκ·Έμ•„μ›ƒ, api ν•¨μˆ˜ κ°œλ³„ 뢄리

πŸ‘©πŸ»β€πŸ’» μ΄μ†Œλ―Ό

  • πŸ– UI : 헀더 ν‘Έν„°, 둜그인, ν”„λ‘œν•„ μˆ˜μ •
  • πŸ›  κΈ°λŠ₯ κ΅¬ν˜„ : 헀더, 둜그인, ν”„λ‘œν•„ μ„€μ •, μˆ˜μ •

πŸ‘©πŸ»β€πŸ’» μž„μˆ˜μ§„

  • πŸ– UI : μ˜ν™” 검색, μ˜ν™” 검색 κ²°κ³Ό
  • πŸ›  κΈ°λŠ₯ κ΅¬ν˜„ : μ˜ν™” 검색, μ˜ν™” 검색 κ²°κ³Ό

πŸ§‘πŸ»β€πŸ’» μ΄ν˜„μ„­

  • πŸ– UI : 감상문 λͺ¨μ•„보기, 감상문 상세 νŽ˜μ΄μ§€
  • πŸ›  κΈ°λŠ₯ κ΅¬ν˜„ : 감상문 λͺ¨μ•„보기, 감상문 상세 νŽ˜μ΄μ§€, 토큰 검증, λ¬΄ν•œ 슀크둀, 404 νŽ˜μ΄μ§€

πŸ§‘πŸ»β€πŸ’» λ₯˜μž¬μ€€

  • πŸ– UI : 초기 μ™€μ΄μ–΄ν”„λ ˆμž„ μ„ΈνŒ…
  • πŸ›  κΈ°λŠ₯ κ΅¬ν˜„ : μ˜ν™” 차트 μΉ΄λ“œ ν΄λ¦­μ‹œ 상세 νŽ˜μ΄μ§€ 이동 κΈ°λŠ₯

πŸ§‘πŸ»β€πŸ’» κ΅¬ν˜„ UI

0. 둜그인 1. λ‘œκ·Έμ•„μ›ƒ
2. νšŒμ›κ°€μž… 3. ν”„λ‘œν•„μ„€μ •
4. μ˜ν™” 랜덀 μΆ”μ²œ 5. 일별 λ°•μŠ€μ˜€ν”ΌμŠ€ μˆœμœ„
6. μ˜ν™” 검색 및 κ²°κ³Ό 7. 감상문 μž‘μ„±
8. 감상문 μˆ˜μ • 및 μ‚­μ œ 9. λ§ˆμ΄νŽ˜μ΄μ§€

πŸ—‚ 폴더 트리


πŸ“¦who-be-go
 ┣ πŸ“‚assets
 ┃ ┣ πŸ“‚icons
 ┃ β”— πŸ“‚images
 ┣ πŸ“‚html
 ┣ πŸ“‚js
 ┃ ┣ πŸ“‚api
 ┃ ┣ πŸ“‚interface
 ┃ ┣ πŸ“‚pages
 ┃ β”— πŸ“‚url
 ┣ πŸ“‚pages
 ┣ πŸ“‚styles
 ┃ ┣ πŸ“‚base
 ┃ ┣ πŸ“‚components
 ┃ ┣ πŸ“‚constants
 ┃ β”— πŸ“‚pages
 ┃ ┣ πŸ“ƒmain.css
 ┃ β”— πŸ“ƒmain.scss
 ┣ ⭐️favicon.ico
 ┣ πŸ“ƒindex.html
 ┣ πŸ“ƒREADME.md
 β”— πŸ“ƒtsconfig.json

πŸ–€ νŒ€μ› μ†Œκ°œ πŸ–€

FE 이수빈 FE μ΄ν˜œμ› FE μ΄μ†Œλ―Ό
github: @waterbinnn github: @donkeeman github: @nimoseel
FE μž„μˆ˜μ§„ FE μ΄ν˜„μ„­ FE λ₯˜μž¬μ€€
github: @etoile-j github: @leehyeonseop github: @ryungom