header-img
Info :
728x90

GraphQL ์ด๋ž€?

ํŽ˜์ด์Šค๋ถ์—์„œ ๋งŒ๋“  API๋ฅผ ์œ„ํ•œ ์ฟผ๋ฆฌ ์–ธ์–ด.

์›น ํด๋ผ์ด์–ธํŠธ๊ฐ€ ๋ฐ์ดํ„ฐ๋ฅผ ์„œ๋ฒ„๋กœ๋ถ€ํ„ฐ ํšจ์œจ์ ์œผ๋กœ ๊ฐ€์ ธ์˜ค๋Š” ๊ฒƒ์ด ๋ชฉ์ ์ธ ์ฟผ๋ฆฌ ์–ธ์–ด.

* SQL ์€ DB ์‹œ์Šคํ…œ์— ์ €์žฅ๋œ ๋ฐ์ดํ„ฐ๋ฅผ ํšจ์œจ์ ์œผ๋กœ ๊ฐ€์ ธ์˜ค๋Š” ๊ฒƒ์ด ๋ชฉ์ ์ธ ์ฟผ๋ฆฌ ์–ธ์–ด๋กœ ๋‘๊ฐœ๋Š” ์ฟผ๋ฆฌ ์–ธ์–ด๋ผ๋Š” ๊ฒƒ์—์„œ ์œ ์‚ฌํ•˜๊ฒŒ ๋Š๊ปด์ง€์ง€๋งŒ ๋ชฉ์ ์—์„œ๋ถ€ํ„ฐ ๋‹ค๋ฆ„.

 

๊ธฐ์กด API ํ˜ธ์ถœ ๋ฐฉ์‹

๊ธฐ์กด์˜ REST API ๋ฐฉ์‹์œผ๋กœ ๋ฐ์ดํ„ฐ๋ฅผ ํ˜ธ์ถœํ•ด์˜ค๋Š” ํ˜•์‹์€ ๋‹ค์Œ๊ณผ ๊ฐ™๋‹ค.

ํด๋ผ์ด์–ธํŠธ๊ฐ€ ์„œ๋ฒ„์™€ ํ†ต์‹ ํ•˜๊ธฐ ์œ„ํ•ด์„œ๋Š” ์„œ๋ฒ„๊ฐ€ ๊ตฌํ˜„ํ•ด๋‘” API๋ฅผ ํ˜ธ์ถœํ•ด์„œ ๋ฐ์ดํ„ฐ๋ฅผ ๋ณด๋‚ด๊ฑฐ๋‚˜, ๋ฐ›์•„์˜ค๊ฒŒ ๋œ๋‹ค. ๋ณดํ†ต ํ•˜๋‚˜์˜ View๋ฅผ ๊ทธ๋ฆฌ๊ธฐ ์œ„ํ•ด์„œ ๋ณดํ†ต ์—ฌ๋Ÿฌ ๋ฒˆ API๋ฅผ ํ˜ธ์ถœํ•˜๊ฒŒ ๋˜๊ณ , ํ˜ธ์ถœ์„ ํ†ตํ•ด ๋ฐ›์•„์˜จ ๋ฐ์ดํ„ฐ๋ฅผ ์กฐํ•ฉํ•ด์„œ ์‚ฌ์šฉ ํ•ด์•ผ ํ•˜๊ฒŒ ๋œ๋‹ค.

์•ฑ์˜ ํŽ˜์ด์ง€๊ฐ€ ๋ณต์žกํ•ด์งˆ์ˆ˜๋ก ๋งŽ์€ ํ˜ธ์ถœ์„ ํ•ด์•ผํ•˜๊ณ  ๋ฐ์ดํ„ฐ ์กฐํ•ฉ์„ ์œ„ํ•ด ์ˆœ์ฐจ์ ์ธ ์ฒ˜๋ฆฌ๊ฐ€ ๋“ค์–ด๊ฐ€์•ผ ํ•˜๋Š” ๊ฒฝ์šฐ๊ฐ€ ๋งŽ์•„์ง€๊ธฐ ๋•Œ๋ฌธ์— ๋ฐ์ดํ„ฐ๋ฅผ ์กฐํ•ฉํ•˜๋Š” ๊ฒƒ์ด ๋งค์šฐ ๋ณต์žกํ•ด์ง.

 

์ด๋Ÿฌํ•œ ๋‹จ์ ์„ ํ•ด๊ฒฐํ•˜๊ธฐ ์œ„ํ•ด์„œ ๋‚˜์˜จ ๊ฒƒ์ด GraphQL. 

 

 

GraphQL ์˜ ๊ตฌ์กฐ

GraphQL์€ ํด๋ผ์ด์–ธํŠธ์—์„œ ์ž๊ธฐ๊ฐ€ ํ•„์š”ํ•œ ๋ฐ์ดํ„ฐ๋งŒ์„ ์ฟผ๋ฆฌํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•ด์„œ ๊ธฐ์กด API ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•ด์ค€๋‹ค.

๋ฏธ๋“ค์›จ์–ด ๊ฐ™์€ ๋Š๋‚Œ์œผ๋กœ ์ดํ•ดํ•˜๋ฉด ์‰ฌ์šธ ๋“ฏ ํ•˜๋‹ค.

 

GraphQL์€ ๋‹ค๋ฅธ Query Language์ธ SQL ๋“ฑ๊ณผ ๊ฐ™์ด ์ฟผ๋ฆฌ๋ฅผ ์„ ์–ธํ•˜๋ฉด ํ•ด๋‹น ๊ฐ’์— ๋งž๋Š” ๋ฐ์ดํ„ฐ๋ฅผ ๊ฐ€์ ธ์˜จ๋‹ค. ์ตœ๊ทผ ์„ ์–ธํ˜• ํŒจ๋Ÿฌ๋‹ค์ž„์ด ์ ˆ์ฐจ์ ์œผ๋กœ ์ฟผ๋ฆฌ๋ฅผ ์ฒ˜๋ฆฌํ•˜๋Š” ๊ฒƒ์ด ์•„๋‹Œ ์„ ์–ธ์ ์œผ๋กœ ์ฟผ๋ฆฌ๋ฅผ ์ฒ˜๋ฆฌํ•จ์œผ๋กœ์จ ๋”์šฑ ์ง๊ด€์ ์œผ๋กœ ์–ด๋–ค ๋ฐ์ดํ„ฐ๊ฐ€ ์˜ค๋Š”์ง€๋ฅผ ์•Œ ์ˆ˜ ์žˆ๊ฒŒ ๋จ.

 

๊ทธ๋ž˜์„œ GraphQL์ด ์ตœ๊ณ  ์งฑ์งฑ ๊ธฐ์ˆ ์ธ๊ฐ€?

 

GraphQL์˜ ํ•œ๊ณ„

์œ„์™€ ๊ฐ™์€ ๊ตฌ์กฐ๋ฅผ ๋„๊ธฐ ๋•Œ๋ฌธ์— ๊ธฐ์กด์—๋Š” ํด๋ผ์ด์–ธํŠธ์—์„œ ๋ฐ์ดํ„ฐ๋ฅผ ์กฐํ•ฉํ•˜์˜€๋”๋ผ๋ฉด ํ˜„์žฌ๋Š” ๊ทธ ์—ญํ• ์ด GraphQL๋กœ ์˜ฎ๊ฒจ์ง€๊ฒŒ ๋˜๋Š” ๊ฒƒ.

๋ชจ๋“ˆ๋กœ ์—ญํ• ์„ ๋ถ„๋ฆฌํ•˜๋ฉด ๋ถ„๋ฆฌํ• ์ˆ˜๋ก ๊ฐœ๋ฐœ ๋ชจ๋“ˆ์˜ ์œ ์ง€๋ณด์ˆ˜๋Š” ์‰ฌ์›Œ์ง€์ง€๋งŒ ๊ตฌํ˜„์€ ๋ณต์žกํ•ด์ง„๋‹ค.

๊ณ ๋กœ

๊ฐ„๋‹จํ•œ ์•ฑ์€ ๋‹จ์ผ ๋ชจ๋“ˆ๋กœ ๋งŒ๋“ค๊ณ , ๋งŒ๋“ค๊ณ ์žํ•˜๋Š” ์•ฑ์˜ ํฌ๊ธฐ๊ฐ€ ์ปค์งˆ ์ˆ˜๋ก ๊ณตํ†ต ๋ชจ๋“ˆ๋กœ ๋ถ„๋ฆฌ๋ฅผ ํ•˜๋Š” ๊ฒƒ์ด ์ข‹๋‹ค.

 


 

GraphQL ์žฅ๋‹จ์ 

 

์žฅ์ 

 

1. Over Fetching ๊ณผ Under Fetching์„ ํ•ด๊ฒฐํ•  ์ˆ˜ ์žˆ์Œ

2. End Point ์™€ ์š”์ฒญ ๋ฐฉ์‹์„ ๊ณ ๋ฏผํ•˜์ง€ ์•Š์•„๋„ ๋จ.

3. ํด๋ผ์ด์–ธํŠธ ๋กœ์ง์ด ๊ฐ„๊ฒฐํ•ด์ง.

 

๋‹จ์  

 

1. HTTP ์บ์‹ฑ์„ ํ™œ์šฉํ•˜๊ธฐ ์–ด๋ ต๋‹ค.

2. ์—๋Ÿฌ ํ•ธ๋“ค๋ง์ด ์–ด๋ ต๋‹ค

3. ์š”์ฒญ์ด ๋ฌด๊ฑฐ์›Œ์ง€๊ณ  ์„ค๊ณ„ํ•˜๊ธฐ๊ฐ€ ๋ณต์žกํ•˜๋‹ค.

๋”๋ณด๊ธฐ
BACKEND