๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
๐Ÿ“‚ ์•Œ์“ธ ์ง€์‹/์•Œ์•„๋‘๋ฉด ์ข‹์„

Library vs. Framework ์ฐจ์ด์ ์„ ํ™•์‹คํ•˜๊ฒŒ ์ •๋ฆฌํ•˜๊ธฐ

by Dev. Ella 2023. 4. 2.

0. ๋“ค์–ด๊ฐ€๊ธฐ์— ์•ž์„œ

๋ˆ„๊ตฐ๊ฐ€ ๋‚˜์—๊ฒŒ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์™€ ํ”„๋ ˆ์ž„์›Œํฌ ๊ฐ„์˜ ์ฐจ์ด๋ฅผ ๋ฌผ์–ด๋ณธ๋‹ค๋ฉด ํ•œ ๋งˆ๋””๋กœ ์ •๋ฆฌํ•  ์ˆ˜ ์žˆ์„๊นŒ? ๋‹ต์€ ์•„๋‹ˆ์—ˆ๋‹ค. ๊ฐœ๋ฐœ์„ ๊ณต๋ถ€ํ•˜๋‹ค ๋ณด๋ฉด ์ด ์„ธ ๊ฐ€์ง€๋ฅผ ์ˆœ์ฐจ์ ์œผ๋กœ ๋ฐฐ์šฐ์ง€๋งŒ ๊ฒฐ๋ก ์ ์œผ๋กœ ๊ฐ๊ฐ์ด ๋ฌด์—‡์ธ์ง€, ์ฐจ์ด๋Š” ๋˜ ๋ฌด์—‡์ธ์ง€ ๋ชจ๋ฅธ๋‹ค๋ฉด ํ™•์‹คํ•˜๊ฒŒ ์งš๊ณ  ๋„˜์–ด๊ฐ€๋ณด์ž.

 

 

1. ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ(Library) ๋ž€?

Library๋Š” ๋‹จ์–ด ๊ทธ๋Œ€๋กœ ๋„์„œ๊ด€์ด๋‹ค. ์‘์šฉ ํ”„๋กœ๊ทธ๋žจ ๊ฐœ๋ฐœ์„ ์œ„ํ•ด  ํ•„์š”ํ•œ ๊ธฐ๋Šฅ(ํ•จ์ˆ˜)๋“ค์„ ๋ชจ์•„ ๋†“์€ ์†Œํ”„ํŠธ์›จ์–ด๋‹ค.

๋น„์œ ํ•˜์ž๋ฉด,

์ž๋™์ฐจ๊ฐ€ ๊ตด๋Ÿฌ๊ฐˆ ๋•Œ ( = ํ”„๋กœ๊ทธ๋žจ์ด ์ œ์ž‘๋˜์–ด ๋Œ์•„๊ฐˆ ๋•Œ) ํ•„์š”ํ•œ ๋ฐ”ํ€ด, ํ—ค๋“œ๋ผ์ดํŠธ, ์—์–ด๋ฐฑ ๋“ฑ์ด๋ผ๊ณ  ํ•  ์ˆ˜ ์žˆ๋‹ค. ์žฌ์‚ฌ์šฉ์ด ํ•„์š”ํ•œ ๊ธฐ๋Šฅ์œผ๋กœ ๋ฐ˜๋ณต์ ์ธ ์ฝ”๋“œ ์ž‘์„ฑ์„ ์—†์• ๊ธฐ ์œ„ํ•ด ์–ธ์ œ๋“ ์ง€ ํ•„์š”ํ•œ ๊ณณ์—์„œ ํ˜ธ์ถœํ•˜์—ฌ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก Class๋‚˜ Function์œผ๋กœ ๋งŒ๋“ค์–ด์ง„ ๊ฒƒ์ด๋‹ค.  ๊ฐ€์žฅ ์œ ๋ช…ํ•œ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ Library๋Š” jQuery, React๊ณ , ๊ฐ์ฒด ์ง€ํ–ฅ ํ”„๋กœ๊ทธ๋ž˜๋ฐ (OOP: Object-oriented programming)์€ ๊ธฐ๋ณธ์ ์œผ๋กœ ๊ฐ ๊ธฐ๋Šฅ๋งˆ๋‹ค ํ•จ์ˆ˜ํ™” ํ•˜๋Š” ๊ฒƒ์œผ๋กœ Class Library๋ผ๊ณ ๋„ ํ•  ์ˆ˜ ์žˆ๋‹ค.

Library์˜ ํŠน์ง•

1. ๋…๋ฆฝ์„ฑ์„ ๊ฐ€์ง„๋‹ค. ์ฆ‰, ํ•ด๋‹น Library๋Š” ๋‹ค๋ฅธ Library์— ์˜์กดํ•˜์ง€ ์•Š๋Š”๋‹ค.

2. ์‘์šฉ ํ”„๋กœ๊ทธ๋žจ์ด ๋Šฅ๋™์ ์œผ๋กœ( = ํ•„์š”ํ•  ๋•Œ) Library๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค.

 

 

2. ํ”„๋ ˆ์ž„์›Œํฌ(Framework) ๋ž€?

Framework ๋˜ํ•œ ๋‹จ์–ด ๊ทธ๋Œ€๋กœ Frame(ํ‹€, ๋ผˆ๋Œ€) + Work(์ผ)์ด๋‹ค. ์ฆ‰, ์‘์šฉ ํ”„๋กœ๊ทธ๋žจ์ด๋‚˜ ์†Œํ”„ํŠธ์›จ์–ด์˜ ์†”๋ฃจ์…˜ ๊ฐœ๋ฐœ์„ ์ˆ˜์›”ํ•˜๊ฒŒ ํ•˜๊ธฐ ์œ„ํ•ด ์ œ๊ณต๋œ ์†Œํ”„ํŠธ์›จ์–ด ํ™˜๊ฒฝ์ด๋‹ค. ๋‹ค์‹œ ๋งํ•ด, ๊ฐœ๋ฐœ์ž๋Š” ๊ธฐ๋ณธ์ ์œผ๋กœ ํ•„์š”ํ•œ ๊ธฐ๋Šฅ๋“ค์„ ๊ฐ–์ถ”๊ณ  ์žˆ๋Š” Framework๋ผ๋Š” ์ด ํ‹€ ์•ˆ์—์„œ ์›ํ•˜๋Š” ๊ธฐ๋Šฅ ๊ตฌํ˜„์—๋งŒ ์ง‘์ค‘ํ•˜์—ฌ ๋น ๋ฅด๊ฒŒ ๊ฐœ๋ฐœํ•˜๋ฉด ๋˜๋Š” ๊ฒƒ์ด๋‹ค. ์ฐธ๊ณ ๋กœ, Framework ์•ˆ์—๋Š” Library๊ฐ€ ํฌํ•จ๋˜์–ด ์žˆ๋‹ค.

๋‚˜๋Š” ์–ด๋–ค Framework๋ฅผ ์“ธ๊นŒ?

Java ๊ฐœ๋ฐœ์ž๋ผ๋ฉด โ˜ž Spring

Python ๊ฐœ๋ฐœ์ž๋ผ๋ฉด โ˜ž Django

ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ์ž๋ผ๋ฉด โ˜ž Angula or Vue

Framework์˜ ํŠน์ง•

1. ์ƒํ˜ธํ˜‘๋ ฅํ•˜๋Š” ํด๋ž˜์Šค์™€ ์ธํ„ฐํŽ˜์ด์Šค์˜ ์ง‘ํ•ฉ์ด๋‹ค.

2. ์‘์šฉ ํ”„๋กœ๊ทธ๋žจ์ด ์ˆ˜๋™์ ์œผ๋กœ( = ๊ทœ์น™์„ ์ง€์ผœ๊ฐ€๋ฉฐ) Framework์— ์˜ํ•ด ์‚ฌ์šฉ๋œ๋‹ค. Library์™€๋Š” ๋‹ค๋ฅด๊ฒŒ Framework๋Š” ๋‚ด๊ฐ€ ์ž‘์„ฑํ•œ ์ฝ”๋“œ๋ฅผ ํ˜ธ์ถœํ•œ๋‹ค. ๋”ฐ๋ผ์„œ Framework๋งŒ์œผ๋กœ๋Š” ์‹คํ–‰๋˜์ง€ ์•Š์œผ๋ฉฐ ๊ธฐ๋Šฅ๋“ค์„ ์ถ”๊ฐ€ํ•ด์•ผ ํ•˜๊ณ , Framework๊ฐ€ ์ •์˜ํ•œ ๊ทœ์น™์„ ์ค€์ˆ˜ํ•˜๋ฉฐ ๊ฐœ๋ฐœํ•ด์•ผ ํ•œ๋‹ค.

 

 

3. ์ •๋ฆฌํ•˜์ž๋ฉด,

Library vs. Framework: ๋ˆ„๊ฐ€ ๋ˆ„๊ตฌ๋ฅผ ์ปจํŠธ๋กคํ•˜๋Š”๊ฐ€์— ๋”ฐ๋ผ ๋‹ค๋ฆ„

- Library: ๊ฐœ๋ฐœ์ž๊ฐ€ ํ•„์š”ํ•œ ๊ธฐ๋Šฅ์„ ์›ํ•  ๋•Œ ํ˜ธ์ถœ

- Framework: Framework๊ฐ€ ๊ฐœ๋ฐœ์ž๋ฅผ ํ˜ธ์ถœ = ์ •ํ•ด์ง„ ํ”„๋กœ๊ทธ๋žจ์˜ ํ‹€์— ๋งž๊ฒŒ ๊ฐœ๋ฐœ์ž๊ฐ€ ํ•„์š”ํ•œ ๊ธฐ๋Šฅ์„ ์ž…๋ ฅ

 

4. ๋ฒˆ์™ธ ์งˆ๋ฌธ

Q. React๋Š” Framework์ผ๊นŒ? Library์ผ๊นŒ? 

- React๊ฐ€ Framework์ธ์ง€, Library์ธ์ง€ ๋…ผ์Ÿ(?)์ด ์žˆ์ง€๋งŒ, ๊ฒฐ๋ก ๋ถ€ํ„ฐ ๋งํ•˜์ž๋ฉด  React๋Š” Library๋‹ค.

- Framework๋กœ ๋ถ„๋ฅ˜๋˜๊ธฐ ์œ„ํ•ด์„œ๋Š” ํ•„์ˆ˜๋กœ ์ถฉ์กฑ๋˜์–ด์•ผ ํ•˜๋Š” ๊ฒƒ (ex. ๋‹ค๋ฅธ ๋งŽ์€ Framework๋“ค์ด ๊ธฐ๋ณธ์ ์œผ๋กœ ๋‚ด์žฅํ•˜๊ณ  ์žˆ๋Š” ๊ธฐ๋Šฅ๋“ค)์ด ํ•„์š”ํ•œ๋ฐ, React์—์„œ๋Š” ์ด๋Ÿฌํ•œ ๊ธฐ๋Šฅ๋“ค์„ ๊ตฌํ˜„ํ•˜๊ธฐ ์œ„ํ•ด ์—ฌ๋Ÿฌ๊ฐ€์ง€ ์ถ”๊ฐ€์ ์ธ Library๋ฅผ ๊ฐ™์ด ์‚ฌ์šฉํ•ด์•ผ ํ•˜๊ธฐ ๋•Œ๋ฌธ์ด๋‹ค (ex. react-router, react-redux, react-saga๋“ฑ)

- ๋”๋ถˆ์–ด, React ๊ณต์‹ ๋ฌธ์„œ์—์„œ๋„ React๋ฅผ Library๋ผ๊ณ  ์ •์˜ํ•˜๊ณ  ์žˆ๊ธฐ๋„ ํ•˜๋‹ค.

 

 

 

๐Ÿ“Ž ๋‚ด์šฉ ์ฐธ์กฐ

Youtube: [10๋ถ„ ํ…Œ์ฝ”ํ†ก] ๐Ÿ™†‍โ™€๏ธํ‹ฐ๋ฒ„์˜ API vs Library vs Framework

- Blog: UI ์ดํ•ดํ•˜๊ธฐ : ์ธํ„ฐํŽ˜์ด์Šค๋ž€ ๋ฌด์—‡์ธ๊ฐ€

- Wikipedia: ์ธํ„ฐํŽ˜์ด์Šค๋ž€?

- Blog: API vs Library vs Framework

- Blog: ํ”„๋ ˆ์ž„์›Œํฌ์™€ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ(React๋Š” ๋ญ์•ผ?)

 

 

 

๋Œ“๊ธ€