Skip to content

Latest commit

Β 

History

History
76 lines (52 loc) Β· 4.21 KB

File metadata and controls

76 lines (52 loc) Β· 4.21 KB

배포 μ‚¬μ΄νŠΈ

Flick Feed

μž‘μ—…κΈ°κ°„

23.04.13 ~ 23.04.27

ν…ŒμŠ€νŠΈ 아이디

ID: test1@naver.com
PW: test1234
(νšŒμ›κ°€μž…μ„ μ΄μš©ν•˜μ—¬ 쓰셔도 λ¬΄λ°©ν•©λ‹ˆλ‹€.!)

ν”„λ‘œμ νŠΈ 멀버 및 μž‘μ—… λͺ©λ‘

λ°•ν¬μˆ˜<μ‘°μž₯> μ΄ν˜œμ› ν‘œμŠΉμ—° μ΄ν¬μ„œ
λ°•ν¬μˆ˜ μ΄ν˜œμ› ν‘œμŠΉμ—° μ΄ν¬μ„œ
λ°±μ—”λ“œ μ„œλ²„ κ΅¬ν˜„
λ°μ΄ν„°λ² μ΄μŠ€ 섀계
κ²Œμ‹œλ¬Ό μž‘μ„± νŽ˜μ΄μ§€
ν”Όλ“œ νŽ˜μ΄μ§€
μ’‹μ•„μš”
λŒ“κΈ€
μΊλŸ¬μ…€
ν”„λ‘œν•„ νŽ˜μ΄μ§€
λ ˆμ΄μ•„μ›ƒ
λ‘œκ·Έμ•„μ›ƒ
λ‘œλ”©
둜그인 νŽ˜μ΄μ§€
νšŒμ›κ°€μž… νŽ˜μ΄μ§€

μ‚¬μ΄νŠΈ μ„€λͺ…

둜그인 ν™”λ©΄

μ‚¬μ΄νŠΈμ— 접속 ν›„ κ°€μž₯ λ¨Όμ € λ³΄μ—¬μ§€λŠ” νŽ˜μ΄μ§€μž…λ‹ˆλ‹€.
μœ μ €μ˜ 이메일과 λΉ„λ°€λ²ˆν˜Έλ₯Ό μ΄μš©ν•˜μ—¬, ν•΄λ‹Ή μ‚¬μ΄νŠΈλ₯Ό μ΄μš©ν•˜μ‹€ 수 μžˆμŠ΅λ‹ˆλ‹€. μŠ€ν¬λ¦°μƒ· 2023-04-27 223924


νšŒμ›κ°€μž…

μ‚¬μ΄νŠΈλ₯Ό μ΄μš©ν•˜κΈ° 전에 λ¨Όμ € μœ μ €μ˜ 아이디λ₯Ό μƒμ„±ν•˜λŠ” νšŒμ›κ°€μž… νŽ˜μ΄μ§€ μž…λ‹ˆλ‹€.
ν•΄λ‹Ή μ‚¬μ΄νŠΈμ˜ μœ μ €κ°€ μ•„λ‹ˆλΌλ©΄, 이 νŽ˜μ΄μ§€μ—μ„œ μœ μ € 정보λ₯Ό λ“±λ‘ν•©λ‹ˆλ‹€.

μŠ€ν¬λ¦°μƒ· 2023-04-27 223937


메인 νŽ˜μ΄μ§€

μœ μ € 생성 ν›„ λ‘œκ·ΈμΈκΉŒμ§€ μ™„λ£Œν•˜μ‹œλ©΄ 보싀 수 μžˆλŠ” 메인 ν”Όλ“œ νŽ˜μ΄μ§€ μž…λ‹ˆλ‹€.
λ‹€λ₯Έ μœ μ €μ™€ μ—¬λŸ¬ ν”Όλ“œλ₯Ό μ£Όκ³  λ°›μœΌλ©°, 일상을 κ³΅μœ ν•˜κ³  λŒ“κΈ€κ³Ό μ’‹μ•„μš” 등을 남길 수 μžˆμŠ΅λ‹ˆλ‹€.

μŠ€ν¬λ¦°μƒ· 2023-04-27 224008


κ²Œμ‹œλ¬Ό μž‘μ„±

ν•΄λ‹Ή νŽ˜μ΄μ§€μ—μ„œ κ²Œμ‹œλ¬Όμ„ μž‘μ„±ν•˜μ—¬ λ‹€λ₯Έ μœ μ €μ—κ²Œ κ³΅μœ ν•  수 μžˆμŠ΅λ‹ˆλ‹€.
μž₯μ†ŒλŠ” μ„ νƒμ μœΌλ‘œ μž…λ ₯ν•˜μ…”λ„ λ˜μ§€λ§Œ, 사진은 ν•„μˆ˜λ‘œ μž…λ ₯λ˜λ„λ‘ λ§Œλ“€μ—ˆμŠ΅λ‹ˆλ‹€.(a.k.a. instagram)

μŠ€ν¬λ¦°μƒ· 2023-04-27 224034


ν”„λ‘œν•„ νŽ˜μ΄μ§€

μ‚¬μš©μžμ˜ 정보λ₯Ό μˆ˜μ •ν•˜κ±°λ‚˜, μž‘μ„±ν–ˆλ˜ κ²Œμ‹œλ¬Όμ„ λ³Ό 수 μžˆλŠ” κ³³μž…λ‹ˆλ‹€. ν•΄λ‹Ή νŽ˜μ΄μ§€μ—μ„œ λ‚˜μ˜ μƒνƒœλ₯Ό μˆ˜μ •ν•˜κ±°λ‚˜, 이름을 μˆ˜μ •ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

μŠ€ν¬λ¦°μƒ· 2023-04-27 224020

ν”„λ‘œμ νŠΈμ˜ κΈ°λŠ₯κ΅¬ν˜„ 사항

πŸ“Œ ν•„μˆ˜μ‚¬ν•­

  • React ν˜Ήμ€ Next 쀑에 μ„ νƒν•΄μ„œ κ°œλ°œμ„ μ§„ν–‰ν•˜μ‹œκ³ , Typescript μ‚¬μš©μ€ ν•„μˆ˜μž…λ‹ˆλ‹€.
  • κΈ€ / μœ μ € / λŒ“κΈ€ λ“±μ˜ μ •λ³΄λŠ” λͺ¨λ‘ λ°±μ—”λ“œμ™€μ˜ 톡신을 ν†΅ν•΄μ„œ 받아와야 ν•©λ‹ˆλ‹€. (rtk query λ‚˜ react query μ‚¬μš© ꢌμž₯)
  • κΈ€μ“°κΈ° / λŒ“κΈ€ 달기 / μ’‹μ•„μš” κΈ°λŠ₯도 λͺ¨λ‘ λ°±μ—”λ“œμ™€μ˜ 톡신을 ν†΅ν•΄μ„œ κ΅¬ν˜„λ˜μ–΄μ•Ό ν•©λ‹ˆλ‹€.
  • νšŒμ›κ°€μž… / 둜그인 κΈ°λŠ₯은 JWT 토큰을 ν™œμš©ν•˜λ„λ‘ κ΅¬ν˜„ (access token 만 ν™œμš©ν•΄λ„ 무방)
  • κ²Œμ‹œκΈ€ μ»΄ν¬λ„ŒνŠΈμ— μ’‹μ•„μš” 등둝/ν•΄μ œλ₯Ό μœ„ν•œ λ²„νŠΌμ„ λ§Œλ“€κ³ , μ’‹μ•„μš” 등둝 여뢀에 따라 λ²„νŠΌμ˜ ν˜•νƒœκ°€ 달라지도둝 κ΅¬ν˜„ (ex. μ’‹μ•„μš”λœ 글은 꽉 μ°¬ ν•˜νŠΈ, μ’‹μ•„μš”λ˜μ§€ μ•Šμ€ 글은 빈 ν•˜νŠΈ)
  • redux λ₯Ό ν†΅ν•΄μ„œ μƒνƒœ 관리
  • (μ˜΅μ…˜) useCallback, useMemo 등을 ν†΅ν•œ μ»΄ν¬λ„ŒνŠΈ λ Œλ”λ§ μ΅œμ ν™”

ν”„λ‘œμ νŠΈ 기술 μŠ€νƒ

  • Basic: HTML styled-components TypeScript React

  • Library: axios express msw redux react-multi-carousel react-query react-router-dom react-icons react-cookie

  • Deploy: AWS

  • Bundler: Vite