Skip to content

yyezzzyy/Rolling

ย 
ย 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

420 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

๋กค๋งํŽ˜์ดํผ๋ฅผ ๊ณต์œ ํ•ด ๋ณด์„ธ์š” Rolling!!๐ŸŽ‰๐ŸŽ‰

แ„‰แ…ณแ„แ…ณแ„…แ…ตแ†ซแ„‰แ…ฃแ†บ 2024-09-10 แ„‹แ…ฉแ„’แ…ฎ 12 55 28 Rolling์€ ๋กค๋ง ํŽ˜์ดํผ๋ฅผ ๋งŒ๋“ค๊ณ  ์นœ๊ตฌ๋“ค์—๊ฒŒ ๊ณต์œ ํ•  ์ˆ˜ ์žˆ๋Š” ์›น ์„œ๋น„์Šค์ž…๋‹ˆ๋‹ค.
React๋ฅผ ์‚ฌ์šฉํ•œ ๋™์ ์ธ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์ด๋ฉฐ, Vite๋ฅผ ํ†ตํ•ด ๋น ๋ฅด๊ณ  ํšจ์œจ์ ์ธ ๊ฐœ๋ฐœ ํ™˜๊ฒฝ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.

ํŒ€์› ์†Œ๊ฐœ

์ •์ค€์˜ ๏ฟฝ๊น€๋ฏธ์†Œ ๊น€์˜ˆ์ง€ ๊น€์›
์ •์ค€์˜ ๊น€๋ฏธ์†Œ ๊น€์˜ˆ์ง€ ๊น€์›
PostPage
PostPage{edit} ์ž‘์—…
HomePage
ListPage ์ž‘์—…
PostPage
PostPage{edit} ์ž‘์—…
ToPage
FromPage ์ž‘์—…

๋ธŒ๋žœ์น˜ ์ „๋žต

  • main : ์•ˆ์ •์ ์ธ ํ”„๋กœ๋•์…˜ ์ƒํƒœ์˜ ์ฝ”๋“œ๊ฐ€ ์œ„์น˜ํ•ฉ๋‹ˆ๋‹ค.
  • dev : ๊ฐœ๋ฐœ ์ค‘์ธ ์ตœ์‹  ์ฝ”๋“œ๊ฐ€ ์œ„์น˜ํ•˜๋ฉฐ, ์ƒˆ๋กœ์šด ๊ธฐ๋Šฅ๊ณผ ์ˆ˜์ • ์‚ฌํ•ญ์ด ํ†ตํ•ฉ๋ฉ๋‹ˆ๋‹ค.
  • [์ด๋ฆ„] : ํŽ˜์ด์ง€ ๋‹จ์œ„๋กœ ์ž‘์—…์„ ๋‚˜๋ˆ„์—ˆ์œผ๋ฉฐ ์ตœ์ข…์ ์œผ๋กœ dev ๋ธŒ๋žœ์น˜์— mergeํ•ฉ๋‹ˆ๋‹ค.

๊ธฐ์ˆ  ์Šคํƒ

Tech

Design

Code Convention

Communication

์‹ ๊ฒฝ์“ด ๋ถ€๋ถ„

  • ์ฝ”๋“œ์˜ ์žฌ์‚ฌ์šฉ์„ฑ๊ณผ ์œ ์ง€๋ณด์ˆ˜์„ฑ์„ ๋†’์ด๊ธฐ ์œ„ํ•ด Container-Presentation ๋””์ž์ธ ํŒจํ„ด์„ ์ฑ„ํƒํ•˜์˜€์Šต๋‹ˆ๋‹ค.
  • ํ•™์Šต๊ณก์„ ์ด ๋น„๊ต์  ๋‚ฎ๊ณ  ๊ฐ„๋‹จํ•œ ์ „์—ญ ์ƒํƒœ ๊ด€๋ฆฌ๋ฅผ ์œ„ํ•ด Jotai ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์‚ฌ์šฉํ•˜์˜€์Šต๋‹ˆ๋‹ค.
  • ์ฝ”๋“œ์˜ ์žฌ์‚ฌ์šฉ์„ฑ์„ ๋†’์ด๊ณ  ์ƒํƒœ ๊ด€๋ฆฌ๋ฅผ ๊ฐ„๋‹จํ•˜๊ฒŒ ํ•˜๊ธฐ ์œ„ํ•ด API ๊ด€๋ จ ํ•จ์ˆ˜๋“ค์€ Custom Hook์œผ๋กœ ๋งŒ๋“ค์—ˆ์Šต๋‹ˆ๋‹ค.

ํŽ˜์ด์ง€๋ณ„ ๊ธฐ๋Šฅ

[HomePage]

default.mov
  • ๊ฐ„๋‹จํ•œ ์†Œ๊ฐœ ํŽ˜์ด์ง€์ž…๋‹ˆ๋‹ค.
  • "๋กค๋ง ํŽ˜์ดํผ ๋งŒ๋“ค๊ธฐ" ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด ToํŽ˜์ด์ง€๋กœ ์ด๋™ํ•ฉ๋‹ˆ๋‹ค.
  • "๊ตฌ๊ฒฝํ•ด๋ณด๊ธฐ" ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด ListPage๋กœ ์ด๋™ํ•ฉ๋‹ˆ๋‹ค.

[ListPage]

default.mov
  • ์‚ฌ์šฉ์ž๊ฐ€ ์ž‘์„ฑํ•œ ๋กค๋งํŽ˜์ดํผ๋“ค์„ ์ธ๊ธฐ์ˆœ, ์ตœ์‹  ์ˆœ์œผ๋กœ ๋‚˜๋ˆ„์–ด ์ •๋ ฌํ•ด์ค๋‹ˆ๋‹ค.
  • ํ™”๋ฉด์—๋Š” 4๊ฐœ์˜ ๋กค๋งํŽ˜์ดํผ๋งŒ ๋ณด์ด๋„๋ก ํŽ˜์ด์ง€๋„ค์ด์…˜ ๊ธฐ๋Šฅ์„ ์ ์šฉํ–ˆ์Šต๋‹ˆ๋‹ค.
  • ์ตœ์‹ ์ˆœ์€ 20๊ฐœ์˜ ๋ฐ์ดํ„ฐ๋ฅผ ๋ถˆ๋Ÿฌ์™€์„œ ์ด 5ํŽ˜์ด์ง€๊นŒ์ง€๋งŒ ๋ณด์ด๋„๋ก ๊ตฌ์„ฑํ–ˆ์Šต๋‹ˆ๋‹ค.
  • ์ธ๊ธฐ์ˆœ์€ 20๊ฐœ์˜ ๋ฐ์ดํ„ฐ๋ฅผ ๋ถˆ๋Ÿฌ์™€์„œ 8๊ฐœ๋งŒ ๋ณด์ด๋„๋ก ๊ตฌ์„ฑํ–ˆ์Šต๋‹ˆ๋‹ค.
  • ๋กค๋งํŽ˜์ดํผ๋ฅผ ๋ˆ„๋ฅด๋ฉด PostPage๋กœ ์ด๋™ํ•ฉ๋‹ˆ๋‹ค.
  • "๋‚˜๋„ ๋งŒ๋“ค์–ด๋ณด๊ธฐ" ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด ToPage๋กœ ์ด๋™ํ•ฉ๋‹ˆ๋‹ค.

[PostPage]

post.mov
  • ํ—ค๋”์— ๋ฉ”์‹œ์ง€ ์นด์šดํ„ฐ ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.
  • ์‚ฌ์šฉ์ž๊ฐ€ ๋กค๋งํŽ˜์ดํผ๋ฅผ ์—ด๋žŒํ•  ๋•Œ ๋ฆฌ์•ก์…˜์„ ์ถ”๊ฐ€ํ•  ์ˆ˜ ์žˆ๋„๋ก ์ด๋ชจ์ง€ ์ถ”๊ฐ€ ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.
  • ์นดํ†ก ๊ณต์œ  ๊ธฐ๋Šฅ๊ณผ URL ๋ณต์‚ฌ ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.
  • URL ๊ณต์œ ๋ฅผ ํด๋ฆญํ•˜๋ฉด ํ•˜๋‹จ์— ์•Œ๋žŒ๋ฌธ๊ตฌ๊ฐ€ ๋œจ๋Š” toast ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.
  • API์—์„œ ๋ฐ์ดํ„ฐ๋ฅผ ์š”์ฒญํ•ด ํฌ์ŠคํŠธ ํ˜•ํƒœ๋กœ ๋ Œ๋”๋งํ•ฉ๋‹ˆ๋‹ค.
  • ์‚ฌ์šฉ์ž๊ฐ€ ์Šคํฌ๋กค์„ ๋‚ด๋ฆฌ๋ฉด ๊ณ„์† ์ƒˆ๋กœ์šด ์นด๋“œ๋ฅผ ๋ถˆ๋Ÿฌ์˜ค๋Š” ๋ฌดํ•œ ์Šคํฌ๋กค ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.
  • ํฌ์ŠคํŠธ๋ฅผ ๋ˆ„๋ฅด๋ฉด ํŒ์—…์œผ๋กœ ์ƒ์„ธํ•œ ๋‚ด์šฉ์ด ๋ณด์ด๋Š” modal ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.
  • [+] ์นด๋“œ๋ฅผ ๋ˆ„๋ฅด๋ฉด FromPage๋กœ ์ด๋™ํ•ฉ๋‹ˆ๋‹ค.

[PostPage{edit}]

post.edit.1.mov
  • ์•„์ง์€ ๋กœ๊ทธ์ธ ๊ธฐ๋Šฅ์ด ์—†์–ด URL์— ์ง์ ‘ "edit"๋ฅผ ๋„ฃ์–ด์ฃผ์–ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.
  • ์“ฐ๋ ˆ๊ธฐํ†ต ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด Card๊ฐ€ ์‚ญ์ œ๋˜๋Š” ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.
  • "์‚ญ์ œํ•˜๊ธฐ" ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด ๋กค๋ง ํŽ˜์ดํผ๊ฐ€ ์‚ญ์ œ๋˜๋Š” ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.

[ToPage]

to.mov
  • ๋ฐฐ๊ฒฝ์„ ์ปฌ๋Ÿฌ,์ด๋ฏธ์ง€ ์ค‘ ํ•˜๋‚˜๋กœ ์„ ํƒํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
  • ์ด๋ฆ„๊ณผ ๋ฐฐ๊ฒฝ์„ ์„ ํƒํ•˜๋ฉด "์ƒ์„ฑํ•˜๊ธฐ" ๋ฒ„ํŠผ์ด ํ™œ์„ฑํ™”๋ฉ๋‹ˆ๋‹ค.
  • "์ƒ์„ฑํ•˜๊ธฐ" ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด ๋กค๋ง ํŽ˜์ดํผ๊ฐ€ ์ƒ์„ฑ๋˜๊ณ  PostPage๋กœ ์ด๋™ํ•ฉ๋‹ˆ๋‹ค.

[FromPage]

from.mov
  • ํ”„๋กœํ•„ ์„ ํƒ ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.
  • ๊ด€๊ณ„ ์„ ํƒ ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.
  • ํ…์ŠคํŠธ ์—๋””ํ„ฐ๋ฅผ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.
  • ํฐํŠธ๋ฅผ ์ด 4๊ฐœ ์„ ํƒํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

About

๐Ÿ’Ÿ ๋กค๋งํŽ˜์ดํผ๋ฅผ ๋งŒ๋“ค๊ณ  ๊ณต์œ ํ•˜๋Š” ํ”Œ๋žซํผ Rolling !

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages

  • JavaScript 96.2%
  • CSS 3.3%
  • HTML 0.5%