--- category: Unified tags: [auto-consolidated, technical-documentation] title: [[Micro Frontends]] last_updated: 2026-05-02 --- # [[Micro Frontends]] ## ๐Ÿ“Œ Brief Summary ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. --- > ๋งˆ์ดํฌ๋กœ ํ”„๋ก ํŠธ์—”๋“œ(Micro Frontends)๋Š” ๋ฐฑ์—”๋“œ์˜ ๋งˆ์ดํฌ๋กœ์„œ๋น„์Šค ์•„ํ‚คํ…์ฒ˜์™€ ์œ ์‚ฌํ•˜๊ฒŒ, ๋ฐฉ๋Œ€ํ•˜๊ณ  ๋ณต์žกํ•œ ํ”„๋ก ํŠธ์—”๋“œ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ์ž‘๊ณ  ๋…๋ฆฝ์ ์ธ ์—ฌ๋Ÿฌ ๋ชจ๋“ˆ๋กœ ๋‚˜๋ˆ„์–ด ๊ฐœ๋ฐœํ•˜๋Š” ์ ‘๊ทผ ๋ฐฉ์‹์ด๋‹ค [1]. ์ด ์•„ํ‚คํ…์ฒ˜๋Š” ๋น„์ฆˆ๋‹ˆ์Šค ๊ธฐ๋Šฅ์— ๋”ฐ๋ผ ํ”„๋ก ํŠธ์—”๋“œ๋ฅผ ๋ถ„ํ• ํ•˜์—ฌ, ๊ฐ ๋ถ€๋ถ„์„ ์ „๋‹ด ํŒ€์ด ๋…๋ฆฝ์ ์œผ๋กœ ๊ฐœ๋ฐœ, ํ…Œ์ŠคํŠธ, ๋ฐฐํฌํ•  ์ˆ˜ ์žˆ๋„๋ก ์ง€์›ํ•œ๋‹ค [1]. ๊ธฐ์กด ๋ชจ๋†€๋ฆฌ์‹ ๊ตฌ์กฐ์˜ ํ•œ๊ณ„๋ฅผ ๊ทน๋ณตํ•˜์—ฌ ํŒ€์˜ ์ž์œจ์„ฑ, ํ™•์žฅ์„ฑ, ์œ ์ง€๋ณด์ˆ˜์„ฑ์„ ํฌ๊ฒŒ ํ–ฅ์ƒ์‹œํ‚ค๋Š” ํ˜„๋Œ€ ์›น ๊ฐœ๋ฐœ์˜ ์†”๋ฃจ์…˜์ด๋‹ค [1-3]. ## ๐Ÿ“– Core Content ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. --- ๋ณธ๋ฌธ ๊ตฌ์กฐํ™” ์ž‘์—… ์ค‘... ## โš–๏ธ Trade-offs & Caveats ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. --- - **๊ณผ๊ฑฐ ๋ฐ์ดํ„ฐ์™€์˜ ์ถฉ๋Œ:** ์ž๋™ํ™” ์—”์ง„์— ์˜ํ•ด ๋งคํ•‘๋œ ์ง€์‹์œผ๋กœ, ์ถ”ํ›„ ์ •๋ฐ€ ๊ฒ€์ฆ ํ•„์š”. - **์ •์ฑ… ๋ณ€ํ™”:** Design & Experience ๋ถ„์•ผ์˜ ์ž๋™ ์ž์‚ฐํ™” ์ˆ˜ํ–‰. ## ๐Ÿ”— Knowledge Connections ### Related Concepts ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. #### [์†Œ์Šค ๋‚ด ์ •๋ณด ์—†์Œ] - [[์ •๋ณด ๋ถ€์กฑ]] - ์—ฐ๊ฒฐ ์ด์œ : ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. - ์ด ๊ฐœ๋…์„ ํ†ตํ•ด ๋” ๊นŠ๊ฒŒ ์ดํ•ดํ•  ์ˆ˜ ์žˆ๋Š” ๋ถ€๋ถ„: ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. ### Deeper Research Questions ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. - ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. - ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. - ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. ### Practical Application Contexts ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. - **Implementation:** ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. - **System Design:** ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. - **Operation / Maintenance:** ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. - **Learning Path:** ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. - **My Project Relevance:** ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. ### Adjacent Topics ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. - [[์ •๋ณด ๋ถ€์กฑ]] - ํ™•์žฅ ๋ฐฉํ–ฅ: ์†Œ์Šค์— ๊ด€๋ จ ์ •๋ณด๊ฐ€ ๋ถ€์กฑํ•ฉ๋‹ˆ๋‹ค. --- *Last updated: 2026-05-02* --- - **Related Topics:** [[แ„†แ…กแ„‹แ…ตแ„แ…ณแ„…แ…ฉแ„‰แ…ฅแ„‡แ…ตแ„‰แ…ณ แ„‹แ…กแ„แ…ตแ„แ…ฆแ†จแ„Žแ…ฅ (Microservices Architecture)|๋งˆ์ดํฌ๋กœ์„œ๋น„์Šค ์•„ํ‚คํ…์ฒ˜ (Microservices Architecture)]], [[แ„†แ…ฉแ„‚แ…ฉแ†ฏแ„…แ…ตแ„‰แ…ตแ†จ แ„‹แ…กแ„แ…ตแ„แ…ฆแ†จแ„Žแ…ฅ (Monolithic Architecture)|๋ชจ๋†€๋ฆฌ์‹ ์•„ํ‚คํ…์ฒ˜ (Monolithic Architecture)]], [[แ„€แ…ชแ†ซแ„‰แ…ตแ†ทแ„‰แ…กแ„‹แ…ด แ„‡แ…ฎแ†ซแ„…แ…ต (Separation of Concerns)|๊ด€์‹ฌ์‚ฌ์˜ ๋ถ„๋ฆฌ (Separation of Concerns)]], ์›น ์ปดํฌ๋„ŒํŠธ (Web Components), ๋ชจ๋“ˆ ํŽ˜๋”๋ ˆ์ด์…˜ (Module federation) - **Projects/Contexts:** Spotify์˜ ๋งˆ์ดํฌ๋กœ ํ”„๋ก ํŠธ์—”๋“œ ๋„์ž… (์Šค์ฟผ๋“œ ๋ชจ๋ธ), Netflix์˜ ๋ ˆ๊ฑฐ์‹œ ํ˜„๋Œ€ํ™” ๋ฐ ๋Œ€์‹œ๋ณด๋“œ, Zalando์˜ ์ด์ปค๋จธ์Šค ๋ชจ๋“ˆ ๋ถ„๋ฆฌ, IKEA์™€ Amazon์˜ ๋…๋ฆฝ์  UX ์ปค์Šคํ„ฐ๋งˆ์ด์ง• - **Contradictions/Notes:** ์†Œ์Šค์— ๋”ฐ๋ฅด๋ฉด ๋งˆ์ดํฌ๋กœ ํ”„๋ก ํŠธ์—”๋“œ๋Š” ํŒ€์˜ ์ž์œจ์„ฑ๊ณผ ์‹œ์Šคํ…œ์˜ ์œ ์ง€๋ณด์ˆ˜์„ฑ์„ ๋น„์•ฝ์ ์œผ๋กœ ๋†’์—ฌ์ฃผ์ง€๋งŒ, ๋™์‹œ์— ์—ฌ๋Ÿฌ ๋งˆ์ดํฌ๋กœ ํ”„๋ก ํŠธ์—”๋“œ ๋ฒˆ๋“ค์ด ๋กœ๋“œ๋˜๋ฉด์„œ ์ดˆ๊ธฐ ๋กœ๋”ฉ ์„ฑ๋Šฅ์— ์˜ค๋ฒ„ํ—ค๋“œ(Performance Overhead)๊ฐ€ ๋ฐœ์ƒํ•˜๊ณ , ์Šคํƒ€์ผ์ด๋‚˜ ๋ฒ„์ „ ์ถฉ๋Œ ๋“ฑ ์ƒˆ๋กœ์šด ๋ณต์žก์„ฑ์ด ์ถ”๊ฐ€๋  ์ˆ˜ ์žˆ๋‹ค๋Š” ๋‹จ์ (๊ณผ์ œ)์„ ๋ช…ํ™•ํžˆ ๋™๋ฐ˜ํ•œ๋‹ค [5, 9]. ๋”ฐ๋ผ์„œ ์†Œ๊ทœ๋ชจ ํ”„๋กœ์ ํŠธ๋‚˜ ์ ์ ˆํ•œ DevOps ๊ธฐ๋ฐ˜์ด ์—†๋Š” ํ™˜๊ฒฝ์—์„œ๋Š” ์˜ค๋ฒ„ํ—ค๋“œ๊ฐ€ ์žฅ์ ์„ ์ƒ์‡„ํ•˜๋ฏ€๋กœ ํ”ผํ•ด์•ผ ํ•œ๋‹ค๊ณ  ๊ฒฝ๊ณ ํ•œ๋‹ค [11]. --- *Last updated: 2026-04-18* - Raw Source: 00_Raw/2026-04-20/๋งˆ์ดํฌ๋กœ ํ”„๋ก ํŠธ์—”๋“œ (Micro Frontends).md ---