ํ๋ฐํธ์๋ GraphQL์ ๊ฐ๋ฐ์๊ฐ API์์ ๋ฐ์ดํฐ๋ฅผ ์์ฒญํ๊ณ ์๋ฒ์ ํด๋ผ์ด์ธํธ ๊ฐ์ ๋ฐ์ดํฐ ํ๋ฆ์ ํจ์จ์ ์ด๊ณ ์ ํํ๊ฒ ๊ด๋ฆฌํ ์ ์๋๋ก ํ๋ ํด๋ผ์ด์ธํธ ์ธก ์ ํ๋ฆฌ์ผ์ด์ ๊ฐ๋ฐ์ ์ํ ๊ฐ๋ ฅํ ์ฟผ๋ฆฌ ์ธ์ด ๋ฐ ๋ฐํ์์ ๋๋ค. ํ๋ฐํธ์๋ ์ปจํ ์คํธ์์ GraphQL์ ์ฌ์ฉํ๋ฉด ๊ฐ๋ฐ์๋ ์ ํ๋ฆฌ์ผ์ด์ ์ ํ์ํ ๋ฐ์ดํฐ๋ฅผ ์ ํํ๊ฒ ์ง์ ํ ์ ์์ผ๋ฏ๋ก ์ค๋ณต์ด ์ค์ด๋ค๊ณ ์๋ต ์๊ฐ์ด ํฅ์๋ฉ๋๋ค. ๋ํ ํ๋ฐํธ์๋ GraphQL์ ํ๋ฐํธ์๋์ ๋ฐฑ์๋ ๊ฐ๋ฐ์ ๊ฐ์ ๊ธด๋ฐํ ํ์ ์ ์ง์ํ๊ณ ์ ํ๋ฆฌ์ผ์ด์ ์ํ๊ณ๊ฐ ๋ฐ์ ํจ์ ๋ฐ๋ผ ์ฟผ๋ฆฌ ๊ตฌ์กฐ์ ๋ฐ์ดํฐ ์๊ตฌ ์ฌํญ์ ์กฐ์ ํ๋ ํ๋ก์ธ์ค๋ฅผ ๊ฐ์ํํ์ฌ ์ ํ๋ฆฌ์ผ์ด์ ์ํคํ ์ฒ๋ฅผ ๋จ์ํํฉ๋๋ค.
๋ฐฑ์๋, ์น ๋ฐ ๋ชจ๋ฐ์ผ ์ ํ๋ฆฌ์ผ์ด์ ๊ตฌ์ถ์ ์ํ ๊ฐ๋ ฅํ no-code ํ๋ซํผ AppMaster ๋ ํ๋ฐํธ์๋ GraphQL์ ์ฑํํ์ฌ ํด๋ผ์ด์ธํธ ์ธก ์ ํ๋ฆฌ์ผ์ด์ ๊ณผ ๋ฐ์ดํฐ๋ฅผ ์ํํ๊ฒ ํตํฉํ ์ ์์ต๋๋ค. ๋ํ AppMaster ์ ์๊ฐ์ ๋๊ตฌ์ ์์ฑ๋ ์์ค ์ฝ๋๋ ๊ณ ๊ฐ์ด ๊ธฐ์ ๋ถ์ฑ๋ฅผ ์ ๊ฑฐํ๋ฉด์ ๊ฐ๋ฐ ํ๋ก์ธ์ค๋ฅผ ๊ฐ์ํํ๋ ๋ฐ ๋์์ด ๋ฉ๋๋ค.
๊ธฐ์กด REST API ์์น๊ณผ ๋ฌ๋ฆฌ GraphQL์ ๋ณํํ๋ ํด๋ผ์ด์ธํธ ์๊ตฌ ์ฌํญ์ ๋น ๋ฅด๊ฒ ์ ์ํ ์ ์๋ ์ ์ฐํ๊ณ ๋์ ์ธ ๋ฐ์ดํฐ ๊ฐ์ ธ์ค๊ธฐ ๋ฉ์ปค๋์ฆ์ ๋์ ํฉ๋๋ค. ๊ฐ๋ณ ๋ฐ์ดํฐ ์กฐ๊ฐ์ ๊ฐ์ ธ์ค๊ธฐ ์ํด ์ฌ๋ฌ endpoints ์ ์์กดํ๋ ๋์ ๊ฐ๋ฐ์๋ ๋จ์ผ endpoint ํตํด ํ์ํ ๋ชจ๋ ๋ฐ์ดํฐ์ ์ก์ธ์คํ์ฌ ์ฟผ๋ฆฌ ํ๋ก์ธ์ค๋ฅผ ๊ฐ์ํํ๊ณ ์ ๋ฐ์ ์ธ ๋ณต์ก์ฑ์ ์ค์ผ ์ ์์ต๋๋ค. ์ด ์๋ก ๋ฐ๊ฒฌ๋ ์ ์ฐ์ฑ์ ํตํด ๊ฐ๋ฐ์๋ ์ฌ๋ฌ API ์์ฒญ์ ๋์์ ์ํํ์ฌ ์ ํ๋ฆฌ์ผ์ด์ ์ ์ ๋ฐ์ ์ธ ์ฑ๋ฅ๊ณผ ์๋ต์ฑ์ ํฅ์์ํฌ ์ ์์ต๋๋ค.
ํ๋ฐํธ์๋ GraphQL์ ์ด ๊ธฐ์ ์ ์ ๊ทน์ ์ผ๋ก ์ ์งํ๊ณ ํ๋ณดํ๋ Facebook๊ณผ ๊ฐ์ ์ ๋ช ๊ธฐ์ ํ์ฌ๋ค ์ฌ์ด์์ ๋๋ฆฌ ์ฑํ๋์์ต๋๋ค. State of JavaScript 2020 ์ค๋ฌธ์กฐ์ฌ์ ๋ฐ๋ฅด๋ฉด ๊ฐ๋ฐ์์ 64.9%๊ฐ ์์ ์ ํ๋ก์ ํธ์์ GraphQL์ ์ฌ์ฉํ๋ค๊ณ ๋ณด๊ณ ํ์ต๋๋ค. ์ด๋ ํ๋ฐํธ์๋ ์ํ๊ณ๊ฐ ์ด ๋์ ์ฟผ๋ฆฌ ์ธ์ด๋ก ํฌ๊ฒ ์ ํ๋์์์ ๋ํ๋ ๋๋ค. ๋ํ Frontend GraphQL์ ํด๋น ๊ธฐ์ ์ ํตํฉํ GatsbyJS ๋ฐ Apollo Client๋ฅผ ํฌํจํ ์คํ ์์ค ์น ๊ฐ๋ฐ ํ๋ซํผ์์๋ ์ฑํ์ด ์ธ๊ธฐ๋ฅผ ์ป์์ต๋๋ค.
GraphQL์ ์ค์๊ฐ ๊ธฐ๋ฅ์ ํตํด ๊ฐ๋ฐ์๋ ์ค์๊ฐ ๋ฐ์ดํฐ ๋ณ๊ฒฝ ์ฌํญ์ ๋ฐ์ํ ์ ์๋ ์๋ต์ฑ์ด ๋ฐ์ด๋ ๋ํํ ์ ํ๋ฆฌ์ผ์ด์ ์ ๊ตฌ์ถํ ์ ์์ต๋๋ค. GraphQL์ React, Angular ๋ฐ Vue.js์ ๊ฐ์ ์ ๊ณ ํ์ค ํ๋ฐํธ์๋ ํ๋ ์์ํฌ์ ๊ฒฐํฉํจ์ผ๋ก์จ ๊ฐ๋ฐ์๋ ์ฌ์ฉ์ ์ฐธ์ฌ๋ฅผ ์ ๋ํ๊ณ ํน๋ณํ ์ฌ์ฉ์ ๊ฒฝํ์ ์กฐ์ฑํ๋ ์ต์ฒจ๋จ ํด๋ผ์ด์ธํธ ์ธก ์ ํ๋ฆฌ์ผ์ด์ ์ ๋ง๋ค ์ ์์ต๋๋ค.
๊ฐ๋ ฅํ ์ ํ ์ง์ , ๋ด๋ถ ๊ฒ์ฌ, ๋ณ์นญ ๋ฐ ์กฐ๊ฐ๊ณผ ๊ฐ์ ํ๋ฐํธ์๋ GraphQL์ ํต์ฌ ๊ธฐ๋ฅ์ ์ดํดํ๊ณ ํ์ฉํ๋ฉด ๊ฐ๋ฐ์๋ ํน์ ํด๋ผ์ด์ธํธ ๋ฐ์ดํฐ ์๊ตฌ ์ฌํญ์ ์ถฉ์กฑํ๋ ์ ๊ตํ ์ฟผ๋ฆฌ ๊ตฌ์กฐ๋ฅผ ๊ตฌ์ฑํ ์ ์์ต๋๋ค. ๋ํ ์ด๋ฌํ ๊ธฐ๋ฅ์ ํ๋ฐํธ์๋์ ๋ฐฑ์๋ ๊ฐ๋ฐ์ ๊ฐ์ ๋ ๋์ ํ์ ์ ์ด์งํ์ฌ ๋ณํํ๋ ๋น์ฆ๋์ค ์๊ตฌ ์ฌํญ์ ์ ์ํ๊ฒ ๋์ํ ์ ์๋ ๋ณด๋ค ๊ฐ์ํ๋๊ณ ํจ์จ์ ์ธ ๊ฐ๋ฐ ํ์ดํ๋ผ์ธ์ ์กฐ์ฑํฉ๋๋ค.
AppMaster ์ no-code ํ๋ซํผ์ Frontend GraphQL๊ณผ์ ์ํํ ํตํฉ์ ํตํฉํ์ฌ ์๋ฏผ ๊ฐ๋ฐ์๊ฐ ์ต์ฒจ๋จ ์ฟผ๋ฆฌ ์ธ์ด ๊ธฐ์ ์ ํ์ ํ์ฉํ ์ ์๋๋ก ์ง์ํจ์ผ๋ก์จ ์ด๋ฌํ ์ด์ ์ ๋์ฑ ํ์ฅํฉ๋๋ค. AppMaster ์ฌ์ฉ์๋ drag-and-drop ๊ตฌ์ฑ ์์, ์น ๋ฐ ๋ชจ๋ฐ์ผ์ฉ ์๊ฐ์ ๋น์ฆ๋์ค ํ๋ก์ธ์ค ๋์์ด๋, ์๋ ์์ฑ ์์ค ์ฝ๋๋ฅผ ํ์ฉํ์ฌ ์ผ๋ฐ์ ์ผ๋ก ์ํํธ์จ์ด ๊ฐ๋ฐ๊ณผ ๊ด๋ จ๋ ๊ฐํ๋ฅธ ํ์ต ๊ณก์ ์์ด ์ํฅ๋ ฅ ์๋ ์ํํธ์จ์ด ์๋ฃจ์ ์ ๊ตฌ์ถํ ์ ์์ต๋๋ค.
๋ํ AppMaster ์ ์ ํ๋ฆฌ์ผ์ด์ ์ ์น ์ ํ๋ฆฌ์ผ์ด์ ์ฉ Vue3 ํ๋ ์์ํฌ, Android์ฉ Kotlin ๋ฐ Jetpack Compose iOS ๋ชจ๋ฐ์ผ ์ ํ๋ฆฌ์ผ์ด์ ์ฉ SwiftUI ์ ๊ฐ์ ๋๋ฆฌ ์ฌ์ฉ๋๋ ๊ธฐ์ ์ ์ฌ์ฉํ์ฌ ์์ฑ๋ฉ๋๋ค. ์ด๋ ๊ณ ๊ฐ์ด ํ๋ฐํธ์๋ GraphQL๊ณผ ์์ฐ์ค๋ฝ๊ฒ ํตํฉ๋๋ ๊ฐ๋ ฅํ๊ณ ํ๋์ ์ด๋ฉฐ ์ ์ง ๊ด๋ฆฌ๊ฐ ๊ฐ๋ฅํ ์ฝ๋์ ์ ํ๋ฆฌ์ผ์ด์ ์ ์ก์ธ์คํ ์ ์์์ ์๋ฏธํฉ๋๋ค.
Frontend GraphQL๊ณผ AppMaster ์ ์๊ฐ์ ๊ฐ๋ฐ ํ๋ซํผ์ ๊ฒฐํฉ์ ์น, ๋ชจ๋ฐ์ผ ๋ฐ ๋ฐฑ์๋ ์ ํ๋ฆฌ์ผ์ด์ ์ค๊ณ ๋ฐ ๋ฐฐํฌ์ ์์ด ๋น๊ตํ ์ ์๋ ์ ์ฐ์ฑ, ์๋, ์ ์์ฑ ๋ฐ ํ์ฅ์ฑ์ ์ ๊ณตํฉ๋๋ค. ์ด๋ฌํ ๊ธฐ์ ์ ํจ๊ป ์๋ํ์ฌ ํฌ๊ด์ ์ด๊ณ ํจ์จ์ ์ธ ์ ํ๋ฆฌ์ผ์ด์ ๊ฐ๋ฐ ๊ฒฝํ์ ์ ๊ณตํ์ฌ ํ๋ก์ธ์ค๋ฅผ 10๋ฐฐ ๋ ๋น ๋ฅด๊ฒ, 3๋ฐฐ ๋ ๋น์ฉ ํจ์จ์ ์ผ๋ก ๋ง๋ค๊ณ ์ค์๊ธฐ์ ์์ ๋๊ธฐ์ ์ ์ด๋ฅด๊ธฐ๊น์ง ๋ค์ํ ๊ณ ๊ฐ์ด ์ก์ธ์คํ ์ ์๋๋ก ํด์ค๋๋ค.
๊ฒฐ๋ก ์ ์ผ๋ก, ํ๋ฐํธ์๋ GraphQL์ ์ต์ ํ๋ ๋ฐ์ดํฐ ์ฟผ๋ฆฌ, ์ํํ ๋ฐ์ดํฐ ๊ด๋ฆฌ, ํ๋ฐํธ์๋์ ๋ฐฑ์๋ ๊ฐ๋ฐ์ ๊ฐ์ ํฅ์๋ ํ์ ์ ์ ๊ณตํ๋ ํ๋ ํด๋ผ์ด์ธํธ ์ธก ์ ํ๋ฆฌ์ผ์ด์ ๊ฐ๋ฐ์ ์ํ ๊ท์คํ ๋ฆฌ์์ค์ ๋๋ค. Frontend GraphQL์ AppMaster ์ no-code ํ๋ซํผ๊ณผ ํตํฉํจ์ผ๋ก์จ ๋ชจ๋ ๊ท๋ชจ์ ๊ธฐ์ ์ ์ด๋ฌํ ๊ฐ๋ ฅํ ๊ธฐ๋ฅ์ ํ์ฉํ์ฌ ๋์งํธ ํ์ ์ ์ฃผ๋ํ๊ณ ์ฌ์ฉ์ ๊ฒฝํ์ ์๋ก์ด ์ฐจ์์ผ๋ก ๋์ด์ฌ๋ฆฌ๋ ๊ฐ๋ ฅํ๊ณ ํ์ฅ ๊ฐ๋ฅํ๋ฉฐ ์๋ต์ฑ์ด ๋ฐ์ด๋ ์ ํ๋ฆฌ์ผ์ด์ ์ ๊ตฌ์ถ ๋ฐ ๋ฐฐํฌํ ์ ์์ต๋๋ค.