JavaScript Object Notation์ ์ฝ์์ธ JSON์ ์น ๊ฐ๋ฐ์๋ค ์ฌ์ด์์ ๋๋ฆฌ ์ธ๊ธฐ๋ฅผ ์ป์์ผ๋ฉฐ ์น์ ํตํด ๋ฐ์ดํฐ๋ฅผ ๋ณด๋ด๊ณ ๋ฐ๋ ๋ฐ ์ฌ์ค์์ ํ์ค์ด ๋ ๊ฐ๋ฒผ์ด ํ ์คํธ ๊ธฐ๋ฐ ๋ฐ์ดํฐ ๊ตํ ํ์์ ๋๋ค. JSON์ JavaScript ๊ฐ์ฒด ๋ฆฌํฐ๋ด ํ๊ธฐ๋ฒ์ผ๋ก ์์ฑ๋์ด ์ฌ๋๊ณผ ์ปดํจํฐ ๋ชจ๋ ์ฝ๊ฒ ์ฝ๊ณ , ์ฐ๊ณ , ๊ตฌ๋ฌธ ๋ถ์ํ ์ ์์ต๋๋ค. JavaScript ์ธ์๋ JSON์ ๊ฑฐ์ ๋ชจ๋ ํ๋ก๊ทธ๋๋ฐ ์ธ์ด์์ ์ง์๋๋ฏ๋ก ๋ค์ํ ์ ํ๋ฆฌ์ผ์ด์ ๊ณผ ํ๋ซํผ ๊ฐ์ ๋ฐ์ดํฐ ๊ตํ์ ์์ด ์ํธ ์ด์ฉ์ฑ์ด ๋ฐ์ด๋๊ณ ๋ค์ฌ๋ค๋ฅํฉ๋๋ค.
JSON์ XML๊ณผ ๊ฐ์ ๋ค๋ฅธ ๋ฐ์ดํฐ ๊ตํ ํ์์ ๋นํด ๋ช ๊ฐ์ง ์ฅ์ ์ด ์์ต๋๋ค. JSON์ ๋ ๊ฐ๊ฒฐํ๊ณ ๋ ์ฅํฉํ๋ฏ๋ก ์น์ ํตํด ์ ์กํ๋ ์๋๊ฐ ๋ ๋น ๋ฅด๊ณ ๋์ญํญ๋ ๋ ํ์ํฉ๋๋ค. ๋ํ ๊ฐ๋จํ ๊ตฌ๋ฌธ๊ณผ JavaScript์ ๊ธฐ๋ณธ ์ง์ ๋๋ถ์ ๊ตฌ๋ฌธ ๋ถ์ํ๊ธฐ๊ฐ ๋ ์ฝ์ต๋๋ค. ๋ํ JSON์ ๊บพ์ ๊ดํธ, ์์ฑ, ๋ค์์คํ์ด์ค ๋ฑ์ ํน์ ๋งํฌ์ ์ ์๊ตฌํ์ง ์์ผ๋ฏ๋ก ๊ตฌ์กฐ๊ฐ ๋จ์ํ๋๊ณ ๋ฐ์ดํฐ ๊ฐ๋ ์ฑ์ด ํฅ์๋ฉ๋๋ค.
JSON์ ๋ธ๋ผ์ฐ์ ์ ๊ฐ์ ํ๋ฐํธ์๋ ํด๋ผ์ด์ธํธ๊ฐ API ํธ์ถ์ ํตํด ๋ฐฑ์๋ ์๋ฒ์ ์ ์ ๋ ์ํธ ์์ฉํ๋ ์น ๊ฐ๋ฐ์ ํนํ ์ ์ฉํฉ๋๋ค. JSON์ ์๋ฒ ์ธก์์ ๋ฐ์ดํฐ๋ฅผ ์ง๋ ฌํํ์ฌ ์น์ ํตํด ํด๋ผ์ด์ธํธ์ ์ ์กํ๋ ๊ณผ์ ๊ณผ ํด๋ผ์ด์ธํธ ์ธก์์ ๋ฐ์ดํฐ๋ฅผ ๊ตฌ๋ฌธ ๋ถ์ํ๊ณ ์ฒ๋ฆฌํ๋ ๊ณผ์ ์ ๋จ์ํํฉ๋๋ค.
์น์ฌ์ดํธ ๊ฐ๋ฐ์ ๋งฅ๋ฝ์์ JSON์ RESTful API๋ก ์๋ ค์ง ์ต์ ์น ์ํคํ ์ฒ์์ ์ค์ํ ์ญํ ์ ํฉ๋๋ค. RESTful(Representational State Transfer) API๋ฅผ ์ฌ์ฉํ๋ฉด ์น ์ ํ๋ฆฌ์ผ์ด์ ์ด ๋จ์ํ๊ณ ์ํ ๋น์ ์ฅ์ด๋ฉฐ ์บ์ ๊ฐ๋ฅํ ์์ฒญ ๋ฐ ์๋ต์ ์ฌ์ฉํ์ฌ HTTP๋ฅผ ํตํด ์๋ก ํต์ ํ ์ ์์ต๋๋ค. JSON์ ๋จ์์ฑ๊ณผ ํจ์จ์ฑ์ผ๋ก ์ธํด RESTful API์์ ๋ฐ์ดํฐ๋ฅผ ๋ณด๋ด๊ณ ๋ฐ๋ ๋ฐ ์๋ฒฝํ๊ฒ ์ ํฉํฉ๋๋ค.
AppMasterno-code ํ๋ซํผ์ ๋ฐฑ์๋, ์น ๋ฐ ๋ชจ๋ฐ์ผ ์ ํ๋ฆฌ์ผ์ด์ ์ ๊ฐ๋ฐ ํ๋ก์ธ์ค ์ ๋ฐ์ ๊ฑธ์ณ JSON์ ํ์ฉํฉ๋๋ค. ์๋ฅผ ๋ค์ด, ๋ฐ์ดํฐ ๋ชจ๋ธ, ๋น์ฆ๋์ค ๋ก์ง ๋ฐ API endpoints ์ค๊ณํ ๋ AppMaster ์ด๋ฌํ ์ํฐํฐ์ JSON ํํ์ ์์ฑํ ๋ค์ ํ๋ซํผ์์ ๋์ ์ ํ๋ฆฌ์ผ์ด์ ์ ํด๋นํ๋ ์ฝ๋๋ฅผ ์์ฑํ๋ ๋ฐ ์ฌ์ฉ๋ฉ๋๋ค. ๋ํ ์์ฑ๋ ์ ํ๋ฆฌ์ผ์ด์ ์ ์๋ฒ ๋ฐฑ์๋, ์น ํ๋ฐํธ์๋ ๋ฐ ๋ชจ๋ฐ์ผ ํด๋ผ์ด์ธํธ์ ๊ฐ์ ๋ค์ํ ๊ตฌ์ฑ ์์ ๋ฐ ๊ณ์ธต ๊ฐ์ ๋ฐ์ดํฐ ๊ตํ ๋ฐ ์ํธ ์์ฉ์ ์ํด JSON์ ์ฌ์ฉํฉ๋๋ค.
AppMaster JSON ๋ฐ์ดํฐ์ ๊ตฌ์กฐ๋ฅผ ์ ์ํ๊ณ ๊ฒ์ฆํ๊ธฐ ์ํ ๊ฐ๋ ฅํ ๋ฉ์ปค๋์ฆ์ธ JSON ์คํค๋ง ํ์ค๋ ์ง์ํฉ๋๋ค. JSON ์คํค๋ง๋ฅผ ํตํด ๊ฐ๋ฐ์๋ ํ์ ์์ฑ, ํ์ฉ๋๋ ๊ฐ, ๋ฐ์ดํฐ ์ ํ ๋ฑ ๋ฐ์ดํฐ์ ๋ํ ์ ์ฝ ์กฐ๊ฑด์ ์ง์ ํ ์ ์์ต๋๋ค. AppMaster JSON ์คํค๋ง๋ฅผ ํ์ฉํ์ฌ ๊ฐ๋ฐ ํ๋ก์ธ์ค ์ ๋ฐ์ ๊ฑธ์ณ ๋ฐ์ดํฐ ์ผ๊ด์ฑ๊ณผ ๋ฌด๊ฒฐ์ฑ์ ๋ณด์ฅํ๊ณ ์๋ฒ endpoints ์ ๋ํ Swagger(OpenAPI) ๋ฌธ์๋ฅผ ์์ฑํฉ๋๋ค.
์น ๊ฐ๋ฐ์์ JSON์ ์ค์์ฑ์ด ์ปค์ง๊ณ ์ ๊ณ์์ ํญ๋๊ฒ ์ฑํ๋จ์ ๋ฐ๋ผ JSON์ ์ดํดํ๊ณ ๊ทธ ๋ณต์ก์ฑ์ ์ตํ๋ ๊ฒ์ด ์น ๊ฐ๋ฐ์์ IT ์ ๋ฌธ๊ฐ ๋ชจ๋์๊ฒ ํ์์ ์ธ ๊ธฐ์ ์ด ๋์์ต๋๋ค. AppMaster ํ๋ซํผ์ JSON์ ๋ํ ์ํํ ์ง์์ ์ ๊ณตํจ์ผ๋ก์จ ์ฌ์ฉ์๊ฐ ์ด ๊ฐ๋ ฅํ ๋ฐ์ดํฐ ๊ตํ ํ์์ ์ ์ฌ๋ ฅ์ ์ต๋ํ ํ์ฉํ๊ณ ํจ์จ์ ์ด๊ณ ์ ์ฐํ๋ฉฐ ํ์ฅ ๊ฐ๋ฅํ ์น ์ ํ๋ฆฌ์ผ์ด์ ์ ๊ตฌ์ถํ ์ ์๋๋ก ์ง์ํฉ๋๋ค.
์ค์ JSON์ ์๋ก RESTful API๋ฅผ ์ฌ์ฉํ์ฌ ์๋ฒ์์ ์ ํ ๋ชฉ๋ก์ ๊ฒ์ํ๋ ์น ์ ํ๋ฆฌ์ผ์ด์ ์ ๋ค์ ์๋๋ฆฌ์ค๋ฅผ ๊ณ ๋ คํด ๋ณด์ธ์. ๋จผ์ , ์๋ฒ ๋ฐฑ์๋๋ ๋ค์๊ณผ ๊ฐ์ ์ ํ์ JSON ํํ์ ์์ฑํฉ๋๋ค.
{
"์ ํ": [
{
"ID": 1,
"์ด๋ฆ": "๋
ธํธ๋ถ",
"๊ฐ๊ฒฉ": 999.99
},
{
"ID": 2,
"์ด๋ฆ": "์ค๋งํธํฐ",
"๊ฐ๊ฒฉ": 499.99
},
{
"ID": 3,
"์ด๋ฆ": "ํ๋ธ๋ฆฟ",
"๊ฐ๊ฒฉ": 299.99
}
]
}
๋ค์์ผ๋ก ์น ํ๋ฐํธ ์๋๋ HTTP GET ์์ฒญ์ ์๋ฒ์ ๋ณด๋ ๋๋ค. ์๋ฒ๋ ์ ํ ๋ชฉ๋ก์ด ํฌํจ๋ JSON ๋ฐ์ดํฐ๋ก ์๋ตํฉ๋๋ค. ๊ทธ๋ฐ ๋ค์ ํ๋ฐํธ ์๋๋ JavaScript๋ฅผ ์ฌ์ฉํ์ฌ JSON ๋ฐ์ดํฐ๋ฅผ ๊ตฌ๋ฌธ ๋ถ์ํฉ๋๋ค.
const ์ ํ = JSON.parse(response.data);
๋ง์ง๋ง์ผ๋ก ํ๋ฐํธ ์๋๋ JSON ๋ฐ์ดํฐ๋ฅผ ์ฌ์ฉํ์ฌ ํ์ํ ๋งํฌ์ ์ ์์ฑํ์ฌ ํ ์ด๋ธ์ด๋ ๋ชฉ๋ก ๋ณด๊ธฐ์ ๊ฐ์ ์ ์ ํ UI ์์์ ์ ํ์ ํ์ํฉ๋๋ค.
๊ฒฐ๋ก ์ ์ผ๋ก JSON์ ์น ๊ฐ๋ฐ ์์ญ์์ ํ์์ ์ธ ๊ธฐ์ ์ด๋ฉฐ AppMasterno-code ํ๋ซํผ์ ์๋์ ๊น์ด ๋ฟ๋ฆฌ๋ฐํ ์์ต๋๋ค. ์ฝ๊ธฐ ์ฝ๊ณ ํจ์จ์ ์ธ ๋ฐ์ดํฐ ๊ตํ ํ์์ธ JSON์ ์น ๊ฐ๋ฐ์์ IT ์ ๋ฌธ๊ฐ ๋ชจ๋์๊ฒ ์์ฒญ๋ ๊ฐ์น๋ฅผ ์ ๊ณตํฉ๋๋ค. JSON์ ๋ฐฑ์๋, ์น ๋ฐ ๋ชจ๋ฐ์ผ ์ ํ๋ฆฌ์ผ์ด์ ๊ฐ๋ฐ ํ๋ก์ธ์ค์ ํ์ ๋ถ๋ถ์ผ๋ก ๋ง๋ฆ์ผ๋ก์จ AppMaster ์ ํ๋ฆฌ์ผ์ด์ ์ด ์๋, ์ ์ฐ์ฑ ๋ฐ ํ์ฅ์ฑ์ ์ผ๋์ ๋๊ณ ๊ตฌ์ถ๋์ด ์ค๋๋ ๋น ๋ฅด๊ฒ ๋ณํํ๋ ๋์งํธ ์ธ๊ณ์ ๋์์์ด ์งํํ๋ ์๊ตฌ ์ฌํญ์ ์ถฉ์กฑํ๋๋ก ๋ณด์ฅํฉ๋๋ค.