ํ๋กํ ํ์ด ์ปค๋ฅํธ์์ API ํ๋ฌ๊ทธ์ธ ์ฌ์ฉํ๊ธฐ
API ํ๋ฌ๊ทธ์ธ์ ์ฌ์ฉํ๋ฉด ์ค์ ๋ฐ์ดํฐ๋ฅผ API ๋ฐ ๋ฐ์ดํฐ๋ฒ ์ด์ค์ ์ฐ๊ฒฐํ์ฌ ์ ์ํ๊ฒ ํ๋กํ ํ์ ์ผ๋ก ๊ฐ์ ธ์ฌ ์ ์์ต๋๋ค. ์ฌ์ฉ์ ์ง์ ํ๋ฌ๊ทธ์ธ๊ณผ๋ ๋ฌ๋ฆฌ (custom plugins) API ํ๋ฌ๊ทธ์ธ์ ์ฌ์ฉ์๋ ์ฝ๋ฉ ๊ธฐ์ ์ด ํ์ํ์ง ์์ต๋๋ค. ์ด ํ๋ฌ๊ทธ์ธ์ ๋ฐ์ดํฐ๋ฅผ API์ ๋ณด๋ด๋ ์์ ์ด๋ ๋ฐ์ดํฐ๋ฅผ API์์ ๊ฒ์ํ์ฌ JSON ํ์์ผ๋ก ํ๋กํ ํ์ ์ ์ํํ๊ฒ ํตํฉํ๋ ์์ ์ ๊ด์ฌํฉ๋๋ค.
API๋ ๋ฌด์์ธ๊ฐ์?
API(Application Programming Interface: ์ ํ๋ฆฌ์ผ์ด์ ํ๋ก๊ทธ๋๋ฐ ์ธํฐํ์ด์ค)๋ ์๋ก ๋ค๋ฅธ ์ปดํจํฐ ํ๋ก๊ทธ๋จ์ด ํต์ ํ๊ณ ํจ๊ป ์๋ํ ์ ์๊ฒ ํด์ฃผ๋ ๊ท์น ์งํฉ์ ๋๋ค. ์ด๊ฒ์ ๊ฐ๊ฐ์ ํ๋ก๊ทธ๋จ์ด ์๋ํ๋ ๋ฐฉ์์ ๋ชจ๋ ์ธ๋ถ ์ ๋ณด๋ฅผ ์์ง ๋ชปํด๋ ์ ๋ณด๋ฅผ ๊ณต์ ํ๊ณ ์์ ํ ์ ์๊ฒ ํด์ฃผ๋ ๊ต๋์ ์ญํ ์ ํฉ๋๋ค. ์ฆ, API๋ฅผ ์ฌ์ฉํ๋ฉด ์ํํธ์จ์ด๊ฐ ํต์ ํ๊ณ ํ์ ํ๋ ๊ฒ์ด ๋ ์ฌ์์ง๋๋ค.
์ง์๋๋ API ์ ํ
API ํ๋ฌ๊ทธ์ธ์ ์ฌ์ฉํ๋ฉด GET์ด๋ POST๋ API ์์ฒญ์ ๋น ๋ฅด๊ฒ ์์ํ๊ณ ๋ค์ํ API ์ ํ๊ณผ ์ฐ๊ฒฐํ ์ ์์ต๋๋ค.
- ๊ณต๊ฐ API: ์ด๊ฒ์ ์คํฌํฐํ์ด, ์คํ์จ๋๋งต, ์ ํ๋ธ, ์ฑGPT, ๋ผ์ด๋ธ์ค์ฝ์ด ๋ฑ๊ฐ์ด ์ธ๊ธฐ ์๋ ์๋น์ค๋ฅผ ํฌํจํฉ๋๋ค.
- ๋ด๋ถ API: ์กฐ์ง์ ์์คํ ๋ฐ ์๋น์ค์ ์ํํ๊ฒ ์ฐ๊ฒฐํ ์ ์์ต๋๋ค.
API ์์ฒญ์ ๋ง๋๋ ๋ฐฉ๋ฒ
ํ๋กํ ํ์ด ์ปค๋ฅํธ์์ API ํ๋ฌ๊ทธ์ธ์ ์ฌ์ฉํ๊ณ ํ๋กํ ํ์ ์์ API ์์ฒญ์ ๋ง๋ค๋ ค๋ฉด ๋ค์๊ณผ ๊ฐ์ ๋จ๊ณ๋ฅผ ๊ฐ๋จํ ๋ฐ๋ฅด์ธ์.
1๋จ๊ณ: ํ๋กํ ํ์ด ์คํ๋์ค์์ ๋ณด๋ด๊ธฐ(Send) ์๋ต ๋ง๋ค๊ธฐ
- ํ๋กํ ํ์ด ์คํ๋์ค์์ Send (๋ณด๋ด๊ธฐ) ์๋ต์ ์ ํํ ํธ๋ฆฌ๊ฑฐ์ ์ถ๊ฐํ์ฌ ์์ํฉ๋๋ค.
- ํ๋กํ ํ์ด ์คํ๋์ค ๋ฐ ํ๋กํ ํ์ด ์ปค๋ฅํธ ๊ฐ์ ์ ๋ณด๋ฅผ ์ฃผ๊ณ ๋ฐ์ ๋ ์ผ๋ฐ์ ์ผ๋ก ํ๋ ๊ฒ์ฒ๋ผ
ProtoPie Connect/Studio
์ฑ๋์ ์ ํํ๋ ๊ฒ์ ์์ง ๋ง์ธ์. - ํ๋กํ ํ์ ์ ์ ์ฅํฉ๋๋ค.
์ด ํ๋กํ ํ์
์์์์๋ ํ ๊ธ ์ค์์น๋ฅผ ์ฌ์ฉํ์ฌ "Random Fact"๋ฅผ ์ ํํ ๋ Useless Facts API์์ ๋ฐ์ดํฐ๋ฅผ ๊ฐ์ ธ์ค๋ ค๊ณ ํฉ๋๋ค. ์ด ์์
์ ์ํํ๊ธฐ ์ํด ProtoPie Connect/Studio
์ฑ๋ ๋ฐ ๊ณ ์ ๋ฉ์์ง ๊ฐ์ ์ฌ์ฉํ์ฌ ๋ณด๋ด๊ธฐ(Send) ์๋ต์ ๋ง๋ญ๋๋ค.
![[object Object]](https://cdn.sanity.io/images/vidqzkll/production/9af57fad1a6925eb56ceb0d92cbac260871e14a5-5620x3378.png/send_protopie.png)
Tip: ํ๋กํ ํ์ด ์คํ๋์ค์ ํ๋กํ ํ์ด ์ปค๋ฅํธ ๊ฐ์ ๋ฉ์์ง Send (๋ณด๋ด๊ธฐ) ๋ฐ Receive (๋ฐ๊ธฐ)๋ฅผ ๋ง์คํฐํ๋ ค๋ฉด ํ๋กํ ํ์ด ์ค์ฟจ์ ๋ฌด๋ฃ ์์ ์ ํ์ธํ์ธ์.
2๋จ๊ณ: API ํ๋ฌ๊ทธ์ธ ๋ด์์ API ์ค์ ๊ตฌ์ฑํ๊ธฐ
- ํ๋กํ ํ์ด ์ปค๋ฅํธ์์ ํ๋กํ ํ์ ์ ์ฝ๋๋ค.
- "ํ๋ฌ๊ทธ์ธ"์ ํด๋ฆญํ ๋ค์, ๋ชฉ๋ก์์ API ํ๋ฌ๊ทธ์ธ์ ์ ํํฉ๋๋ค.
- ์ฌ์ฉ ๊ฐ๋ฅํ ๋ ๊ฐ์ HTTP ์์ฒญ ๋ฐฉ๋ฒ(GET ๋๋ POST) ์ค ํ๋๋ฅผ ์ ํํฉ๋๋ค. API ์์ฒญ ์์ฑ ์ GET์ API ๊ณต๊ธ์๋ก๋ถํฐ ๋ฐ์ดํฐ๋ฅผ ๊ฒ์ํ๋ ๋ฐ๋ฉด, POST๋ ์๋ก์ด ๋ฐ์ดํฐ๋ฅผ ์ฒ๋ฆฌํ๋๋ก ๋ณด๋ ๋๋ค.
- ์ก์ธ์คํ๋ ค๋ API์ ์ฌ๋ฐ๋ฅธ API URL์ ์
๋ ฅํฉ๋๋ค. ์ ํจํ URL์ ์ป์ผ๋ ค๋ฉด API์ ์จ๋ผ์ธ ๋ฌธ์๋ฅผ ์ฐธ์กฐํ์ธ์. ์ฐ๋ฆฌ์ ์์์์๋ ํ์ํ URL์ด
https://uselessfacts.jsph.pl/api/v2/facts/random
์์ ์ด ํ์ด์ง์์ ํ์ธํ ์ ์์ต๋๋ค. - API์์ ํ์๋ก ํ๋ ๊ฒฝ์ฐ
Header
๋ฐBody
์ ํฌํจํฉ๋๋ค. API URL๊ณผ ๋๋ถ์ด ํ์ํ ์ถ๊ฐ ๋งค๊ฐ๋ณ์๋ฅผ ํ์ธํ๋ ค๋ฉด ์ ํํ API์ ๋ฌธ์๋ฅผ ์ฃผ์ ๊น๊ฒ ์ฝ์ด์ผ ํฉ๋๋ค. Test Request
๋ฒํผ์ ํด๋ฆญํ์ฌ ์ฐ๊ฒฐ์ด ์ฌ๋ฐ๋ฅด๊ฒ ์๋ํ๊ณ ์๋์ง ํ์ธํฉ๋๋ค. ์ค๋ฅ ๋ฉ์์ง๊ฐ ๋ํ๋๋ฉด ์ด์ ๋จ๊ณ์์ ์ ๋ ฅํ ์ ๋ณด๋ฅผ ๊ฒํ ํ์ธ์.
![[object Object]](https://cdn.sanity.io/images/vidqzkll/production/91a654d1d9e4900c1e08a8aac43af5f7595b9b57-5620x3378.png/api-settings-protopie.png)
3๋จ๊ณ: API๋ฅผ ํ๋กํ ํ์ ๊ณผ ์ฐ๊ฒฐํ๊ธฐ
Message From Pie
์ ๋ ฅ ํ๋๋ฅผ ํด๋ฆญํ์ฌ ์ฌ์ฉ ๊ฐ๋ฅํ ๋ฉ์์ง ๋ชฉ๋ก์ ์ก์ธ์คํฉ๋๋ค. API ํ๋ฌ๊ทธ์ธ์ ํ๋กํ ํ์ ๋ด์ ๋ฉ์์ง๋ฅผ ์๋์ผ๋ก ๊ฐ์งํฉ๋๋ค. ๋ฉ์์ง๊ฐ ๋ํ๋์ง ์์ผ๋ฉด 1๋จ๊ณ์์ ๋ง๋ ๋ณด๋ด๊ธฐ(Send) ์๋ต์์ ๋ณต์ฌํ์ฌ ๋ถ์ฌ ๋ฃ์ผ์ธ์.- ํ๋กํ ํ์
์์ ๋ณด๋ธ ๋ฉ์์ง์ ๊ฐ์ผ๋ก API์ URL, ํค๋, ๋ณธ๋ฌธ์ ๋์ ์ผ๋ก ์ฌ์ ์ํด์ผ ํ๋ ๊ฒฝ์ฐ
Override URL/Header/Body with msg value
๋ฅผ ํ์ฑํํฉ๋๋ค. ๋ฉ์์ง ๊ฐ์ผ๋ก API URL, ํค๋, ๋ณธ๋ฌธ ์ฌ์ ์ํ๊ธฐ์ ๋ํด ์์ธํ ์์๋ณด์ธ์. Message to Pie
์ ๋ฉ์์ง๋ฅผ ์ ๋ ฅํ์ธ์. ์ ๋ ฅ๋ ๋ฉ์์ง๋ 2๋จ๊ณ์์ ๊ตฌ์ฑํ API ์์ฒญ์์ ์ป์ ๋ฐ์ดํฐ์ ํจ๊ป ํ๋กํ ํ์ ์ผ๋ก ๋ค์ ์ ์ก๋ฉ๋๋ค.Activate
๋ฅผ ํด๋ฆญํ์ฌ ์ฐ๊ฒฐ์ ์ค์ ํฉ๋๋ค. ํ๋กํ ํ์ ์์ ํด๋น ๋ฉ์์ง๋ฅผ ์์ ํ๋ฉด ํ๋ฌ๊ทธ์ธ์ด API ์์ฒญ์ ์์ํฉ๋๋ค.
![[object Object]](https://cdn.sanity.io/images/vidqzkll/production/0333b823facc4f099dceb8d9bcf520abf862f090-5620x3378.png/connect-pie-to-api.png)
4๋จ๊ณ: ํ๋กํ ํ์ด ์คํ๋์ค์์ ๋ฐ๊ธฐ(Receive) ํธ๋ฆฌ๊ฑฐ ๋ง๋ค๊ธฐ
- ํ๋กํ ํ์ด ์คํ๋์ค๋ก ๋์๊ฐ๋๋ค.
- ํ๋กํ ํ์ ์ ๋ฐ๊ธฐ(Receive) ํธ๋ฆฌ๊ฑฐ๋ฅผ ์ถ๊ฐํฉ๋๋ค.
- 1๋จ๊ณ์์ ๋ณด๋ด๊ธฐ(Send) ์๋ต ์ค์ ์ ํ๋ ๊ฒ๊ณผ ๋ง์ฐฌ๊ฐ์ง๋ก
ProtoPie Connect/Studio
์ฑ๋์ ์ ํํ๋ ๊ฒ์ ์์ง ๋ง์ธ์. - 3๋จ๊ณ์์ ๊ตฌ์ฑํ ๊ฒ๊ณผ ๋์ผํ ๋ฉ์์ง๋ฅผ
Message to Pie
์๋์ ์ ๋ ฅํฉ๋๋ค. Assign to Variable
์ต์ ์ ํ์ฑํํฉ๋๋ค. ํ ์คํธ ๋ณ์๋ฅผ ๋ง๋ค๊ณ ๋ฐ๊ธฐ(Receive) ํธ๋ฆฌ๊ฑฐ ๋ชฉ๋ก์์ ์ ํํฉ๋๋ค. API์์ ์ป์ ์ ๋ณด๋ ์ด์ ์ด ๋ณ์์ ์ ์ฅ๋ฉ๋๋ค.- API ๋ฐ์ดํฐ๋ JSON ํ์์ผ๋ก ์์ฃผ ๋ฐํ๋๊ธฐ ๋๋ฌธ์ parseJson ์์๊ณผ ํจ๊ป ํ ์คํธ(Text) ์๋ต์ ์ฌ์ฉํ์ฌ API ๋ฐ์ดํฐ๋ฅผ ํ๋กํ ํ์ ์ ํตํฉํ๋ ๋ฐฉ๋ฒ์ด ๊ฐ์ฅ ํจ์จ์ ์ ๋๋ค.
- ํ๋กํ ํ์ ์ ์ ์ฅํ ๋ค์, ํ๋กํ ํ์ด ์ปค๋ฅํธ์์ ๋ค์ ๋ก๋ํฉ๋๋ค. ์ด์ API ๊ธฐ๋ฐ ์ํธ์์ฉ์ ํ๋กํ ํ์ด ์ปค๋ฅํธ๋ฅผ ํตํด ํ ์คํธํ ์ค๋น๊ฐ ๋์์ต๋๋ค!
![[object Object]](https://cdn.sanity.io/images/vidqzkll/production/0a88aa67df6a7a0feffde0eb5ed9664510b45f31-5620x3378.png/receive-api-response.png)
๋ฉ์์ง ๊ฐ์ผ๋ก API URL/ํค๋/๋ณธ๋ฌธ ์ฌ์ ์ํ๊ธฐ
Override URL/Header/Body with msg value
๋ ํ๋กํ ํ์
์์ ๋ณด๋ธ ๋ฉ์์ง์ ๊ฐ์ผ๋ก API์ URL, ํค๋, ๋ณธ๋ฌธ ๋งค๊ฐ๋ณ์๋ฅผ ๋์ ์ผ๋ก ์ฌ์ ์ํ๋ ๋ฐ ์ฌ์ฉ๋ฉ๋๋ค.
์ด ํ๋กํ ํ์ ์์์์๋ ์ด ๊ธฐ๋ฅ์ ์ฌ์ฉํ์ฌ ํ์ด ํ์ผ ๋ด ์๋์ ๋ณด๋ด๊ธฐ(Send) ๋ฉ์์ง์ ๊ฐ์ผ๋ก API URL์ ์ฌ์ ์ํ์ต๋๋ค. ๊ทธ ๊ฒฐ๊ณผ๋ก ํ๋กํ ํ์ด ์ปค๋ฅํธ์์ ํ๋กํ ํ์ ์ ํ ์คํธํ๊ณ ๊ฒ์ ์์์ ์ด๋ค ๋์๋ฅผ ์ ๋ ฅํ๋ฉด ํด๋น ๋์์ ์ ํํ ๋ ์จ ์ ๋ณด๊ฐ ํ์๋ฉ๋๋ค.
![[object Object]](https://cdn.sanity.io/images/vidqzkll/production/a13ca5a964ae7168c2c6685ca9f22ae67f86178f-4096x2462.png/override-api-url-protopie.png)
๋์ API ํธ์ถ ์คํํ๊ธฐ
Connect Core ์ Connect ์ํฐํ๋ผ์ด์ฆ ์ฌ์ฉ์๋ API ํ๋ฌ๊ทธ์ธ์ ์ฌ์ฉํ์ฌ ์ฌ๋ฌ API ์์ฒญ์ ๋์์ ์คํํ ์ ์์ต๋๋ค. ๋ค๋ฅธ ํ๋ฌ๊ทธ์ธ์ด ์คํ ์ค์ด ์๋ ๊ฒฝ์ฐ, Connect Core ๋ ์ต๋ 3๊ฐ์ API ์คํ์ด ๊ฐ๋ฅํ ๋ฐ๋ฉด Connect ์ํฐํ๋ผ์ด์ฆ ๋ ๋์์ ์คํํ ์ ์๋ API ํธ์ถ ์์ ์ ํ์ด ์์ต๋๋ค.
ํ๋กํ ํ์ ์์ ์ฌ๋ฌ API ์์ฒญ์ ๋์์ ์คํํ๋ ค๋ฉด ๋ค์๊ณผ ๊ฐ์ ๋จ๊ณ๋ฅผ ๋ฐ๋ฅด์ธ์.
- ํ๋กํ ํ์ด ์ปค๋ฅํธ์์ API ํ๋ฌ๊ทธ์ธ์ ์ฝ๋๋ค.
- API ์ค์ ์ฐฝ์ ์ค๋ฅธ์ชฝ ์๋จ ๋ชจ์๋ฆฌ์ ์๋
+
์์ด์ฝ์ ํด๋ฆญํฉ๋๋ค. ์ด๋ ๊ฒ ํ๋ฉด ์ ์ฐฝ์ด ์ด๋ฆฌ๋๋ฐ, ๊ทธ ์ฐฝ์์ ์ถ๊ฐ API ํธ์ถ์ ๊ตฌ์ฑํ๊ณ ๋์์ ์คํํ ์ ์์ต๋๋ค. ๊ธฐ์กด์ API๋ฅผ ๋ณต์ ํ์ฌ ์๋ ์ค์ ์ ์ ์งํ ์๋ ์์ต๋๋ค.
![[object Object]](https://cdn.sanity.io/images/vidqzkll/production/cd021777baf05f26806e8df98c481f2059853f34-5620x3378.png/multiple-api-requests-protopie.png)
API ํ๋ฌ๊ทธ์ธ ์ ๋ฌธ ์์ต์
์ด ์ ๋ฌธ์ ์๋ฆฌ์ฆ์์ API ํ๋ฌ๊ทธ์ธ์ ์ฃผ์ ๊ธฐ๋ฅ๊ณผ ์ฌ์ฉ ์ฌ๋ก๋ฅผ ์์๋ณด์ธ์.