Atomic Design Pattern

์•„ํ† ๋ฏน ๋””์ž์ธ ํŒจํ„ด์˜ ๊ฐœ๋… ํ•™์Šต์„ ์œ„ํ•ด ์ฐธ๊ณ ํ•œ ์•„ํ‹ฐํด ๋ชจ์Œ

0. ํด๋” ๊ตฌ์กฐ๋Š” ์–ด๋–ป๊ฒŒ ๋‚˜๋ˆ ์•ผํ•˜๋‚˜๋กœ ์‹œ์ž‘๋œ ๊ฒ€์ƒ‰

๋ฆฌ์•กํŠธ ํŒ€์€ ํŒŒ์ผ ๊ตฌ์กฐ๋ฅผ ๊ตฌ์„ฑํ•  ๋•Œ ๋„ˆ๋ฌด ๋งŽ์€ ์‹œ๊ฐ„์„ ํˆฌ์žํ•˜์ง€ ๋ง๋ผ๊ณ  ๊ถŒ์œ ํ•œ๋‹ค. ํŒŒ์ผ ๊ตฌ์กฐ๋ณด๋‹ค ์ค‘์š”ํ•œ ๊ฒƒ์€ ์ œ๋Œ€๋กœ ๋œ ์ฝ”๋“œ๋กœ ์ž‘๋™ํ•˜๋Š” ์„œ๋น„์Šค๋ฅผ ๋งŒ๋“œ๋Š” ๊ฒƒ์ด๊ธฐ ๋•Œ๋ฌธ์ด๋‹ค. ํ•˜์ง€๋งŒ ๊ฒฐ๊ตญ ํด๋”๋ฅผ ๋‚˜๋ˆ ์•ผ ๋˜๋Š” ์ˆœ๊ฐ„์ด ์ฐพ์•„์˜ค๊ณ , ์ด๋•Œ ํด๋”๋ฅผ ์–ด๋–ป๊ฒŒ ๋ถ„๋ฅ˜ํ• ์ง€ ๊ณ ๋ฏผํ•˜๊ฒŒ ๋œ๋‹ค. ๊ธฐ๋Šฅ ๋ณ„๋กœ ๋‚˜๋ˆŒ๊นŒ? ๋ผ์šฐํŠธ๋ณ„๋กœ ๋‚˜๋ˆŒ๊นŒ? ์–ด๋А ์ •๋„๊นŒ์ง€ ์„ธ๋ถ„ํ™”ํ•ด์„œ ๋‚˜๋ˆ ์•ผ ํ• ๊นŒ? ๋“ฑ๋“ฑ...

์ด๋Ÿฌํ•œ ์˜๋ฌธ์„ ํ•ด๊ฒฐํ•˜๊ธฐ ์œ„ํ•ด ๊ธฐํšŒ๊ฐ€ ์žˆ์„๋•Œ๋งˆ๋‹ค ์งˆ๋ฌธํ•˜๊ณค ํ•˜๋Š”๋ฐ ์‚ฌ๋žŒ๋งˆ๋‹ค, ํŒ€๋งˆ๋‹ค ๋‹ค๋ฅด๋‹ค๋Š” ๊ฒฐ๋ก ์œผ๋กœ ๊ท€๊ฒฐ๋œ๋‹ค. ๋ฌผ๋ก  ๊ทธ๋ ‡๊ฒ ์ง€๋งŒ... ์–ด๋–ค ๊ธฐ์ค€์ด ์žˆ๋Š”์ง€ ์•Œ๊ณ  ์‹ถ๋‹ค๋Š” ์ƒ๊ฐ์— ๊ฒ€์ƒ‰์„ ํ•˜๊ฒŒ ๋˜์—ˆ๊ณ , ์•„ํ† ๋ฏน ํŒจํ„ด์„ ์ฐพ๊ฒŒ ๋˜์—ˆ๋‹ค. ์ฝ์–ด๋ณด๊ณ  ์ •๋ฆฌํ•˜์ž !

1. ๊ด€๋ จ ์•„ํ‹ฐํด

Atomic Design Pattern์˜ Best Practice ์—ฌ์ •๊ธฐ

Atomic Design Methodology

์•„ํ† ๋ฏน ๋””์ž์ธ์„ ํ™œ์šฉํ•œ ๋””์ž์ธ ์‹œ์Šคํ…œ ๋„์ž…๊ธฐ

์•„ํ† ๋ฏน ๋””์ž์ธ ์†Œ๊ฐœ ๋ฐ ์‹ค์ œ ์‚ฌ์šฉ ๊ฒฝํ—˜

React๋กœ ์ง„ํ–‰ํ•œ ํ”„๋กœ์ ํŠธ์—์„œ Atomic Design ํŒจํ„ด์„ ๊ฑท์–ด๋‚ธ ์ด์œ 

Last updated

Was this helpful?