Frontend Canvas API๋Š” HTML5 ์›น ํŽ˜์ด์ง€ ๋˜๋Š” ๋ชจ๋ฐ”์ผ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ์ธํ„ฐํŽ˜์ด์Šค ๋‚ด์—์„œ 2์ฐจ์›(2D) ๊ทธ๋ž˜ํ”ฝ, ์ด๋ฏธ์ง€ ๋ฐ ์• ๋‹ˆ๋ฉ”์ด์…˜์˜ ๋™์  ๋ Œ๋”๋ง์„ ๊ด€๋ฆฌํ•˜๋„๋ก ์„ค๊ณ„๋œ ์ตœ์‹  ์›น ๋ฐ ๋ชจ๋ฐ”์ผ ์•ฑ ๊ฐœ๋ฐœ์˜ ์ค‘์š”ํ•œ ๊ตฌ์„ฑ ์š”์†Œ์ž…๋‹ˆ๋‹ค. ์‹œ๊ฐ์  ์ฝ˜ํ…์ธ ์˜ ์ƒ์„ฑ ๋ฐ ์กฐ์ž‘์— ์ฃผ๋กœ ์‚ฌ์šฉ๋˜๋Š” ์ด API(์‘์šฉ ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์ธํ„ฐํŽ˜์ด์Šค)๋Š” ๋ฐ์Šคํฌํ†ฑ ์ปดํ“จํ„ฐ, ๋…ธํŠธ๋ถ, ํƒœ๋ธ”๋ฆฟ ๋ฐ ์Šค๋งˆํŠธํฐ์„ ํฌํ•จํ•œ ๊ด‘๋ฒ”์œ„ํ•œ ์ตœ์ข… ์‚ฌ์šฉ์ž ์žฅ์น˜์—์„œ ์›ํ™œํ•˜๊ณ  ๋ฐ˜์‘์„ฑ์ด ๋›ฐ์–ด๋‚œ ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์„ ๋ณด์žฅํ•˜๋Š” ๋ฐ ์ค‘์š”ํ•œ ์—ญํ• ์„ ํ•ฉ๋‹ˆ๋‹ค.

AppMaster ์˜ ํ”„๋ŸฐํŠธ์—”๋“œ ๊ฐœ๋ฐœ ๋งฅ๋ฝ์—์„œ ํ”„๋ŸฐํŠธ์—”๋“œ ์บ”๋ฒ„์Šค API๋Š” ๊ฐœ๋ฐœ์ž๊ฐ€ AppMaster ์˜ no-code ์‚ฌ์šฉํ•˜์—ฌ ์ƒ์„ฑ๋œ ์›น ๋˜๋Š” ๋ชจ๋ฐ”์ผ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ๋‚ด์—์„œ HTML5 ์บ”๋ฒ„์Šค ์š”์†Œ์˜ ๊ฐ•๋ ฅํ•œ ๊ธฐ๋Šฅ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•˜๋Š” ํ”Œ๋žซํผ ๋‚ด์— ๋‚ด์žฅ๋œ ์ธํ„ฐํŽ˜์ด์Šค ๋ฐ ๊ธฐ๋Šฅ ์„ธํŠธ๋ฅผ ๋‚˜ํƒ€๋ƒ…๋‹ˆ๋‹ค. no-code ํ™˜๊ฒฝ. Frontend Canvas API์˜ ๊ธฐ๋Šฅ์„ ํ†ตํ•ฉํ•จ์œผ๋กœ์จ ๊ฐœ๋ฐœ์ž๋Š” ์ „ ์„ธ๊ณ„ ์ตœ์ข… ์‚ฌ์šฉ์ž์—๊ฒŒ ๋‹ค์–‘ํ•˜๊ณ  ๋งค๋ ฅ์ ์ธ ์ฝ˜ํ…์ธ ๋ฅผ ์›ํ™œํ•˜๊ฒŒ ์ œ๊ณตํ•  ์ˆ˜ ์žˆ๋Š” ๊ณ ์„ฑ๋Šฅ ๋ Œ๋”๋ง ์†”๋ฃจ์…˜์„ ํ™œ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

AppMaster ์˜ Frontend Canvas API ์ฑ„ํƒ์€ ๋‹ค์–‘์„ฑ๊ณผ ์„ฑ๋Šฅ์— ๋ฟŒ๋ฆฌ๋ฅผ ๋‘๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. API๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ๊ฐœ๋ฐœ์ž๋Š” ๋ฒกํ„ฐ ๊ทธ๋ž˜ํ”ฝ, ๋ž˜์Šคํ„ฐ ๊ทธ๋ž˜ํ”ฝ, ์• ๋‹ˆ๋ฉ”์ด์…˜ ๋“ฑ ๋‹ค์–‘ํ•œ ๋ฆฌ์น˜ ๋ฏธ๋””์–ด ํ˜•์‹์„ ํ™œ์šฉํ•˜์—ฌ ๋‹ค์–‘ํ•œ ์žฅ์น˜, ํ•ด์ƒ๋„, ๋ธŒ๋ผ์šฐ์ € ํ™˜๊ฒฝ์— ๋™์ ์œผ๋กœ ์ ์‘ํ•˜๋Š” ๋งค๋ ฅ์ ์ธ ์‚ฌ์šฉ์ž ์ธํ„ฐํŽ˜์ด์Šค๋ฅผ ๋งŒ๋“ค ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๊ฒฐ๊ณผ์ ์œผ๋กœ Frontend Canvas API๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ๊ตฌ์ถ•๋œ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์€ ์‹œ๊ฐ์ ์œผ๋กœ ๋งค๋ ฅ์ ์ผ ๋ฟ๋งŒ ์•„๋‹ˆ๋ผ ํšจ์œจ์ ์ธ ๋ Œ๋”๋ง, ๋Œ€๊ธฐ ์‹œ๊ฐ„ ์ตœ์†Œํ™” ๋ฐ ์›ํ™œํ•œ ์‚ฌ์šฉ์ž ๊ฒฝํ—˜ ๋ณด์žฅ์„ ์œ„ํ•ด ์ตœ์ ํ™”๋˜์—ˆ์Šต๋‹ˆ๋‹ค.

๋˜ํ•œ Frontend Canvas API๋Š” ๋ฐ์ดํ„ฐ๋ฅผ ์‹ค์‹œ๊ฐ„ ์‹œ๊ฐํ™”๋กœ ๋ณ€ํ™˜ํ•  ์ˆ˜ ์žˆ์œผ๋ฉฐ, ์ด๋Š” ๋ฐ์ดํ„ฐ ๊ธฐ๋ฐ˜ ํ”„๋กœ์„ธ์Šค๋ฅผ ๊ฐ–์ถ˜ ํ˜„๋Œ€ ๋น„์ฆˆ๋‹ˆ์Šค ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์— ํ•„์ˆ˜์ ์ธ ๊ฒƒ์œผ๋กœ ์ž…์ฆ๋œ ๊ธฐ๋Šฅ์ž…๋‹ˆ๋‹ค. AppMaster ์‚ฌ์šฉ์ž๋Š” Frontend Canvas API์˜ ๊ฐ•๋ ฅํ•œ ๊ธฐ๋Šฅ์„ ํ™œ์šฉํ•˜์—ฌ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์—์„œ ์„ฑ๋Šฅ์ด๋‚˜ ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์„ ํฌ์ƒํ•˜์ง€ ์•Š๊ณ ๋„ ๋Œ€ํ™”ํ˜• ์ฐจํŠธ ๋ฐ ์ง€๋„์™€ ๊ฐ™์€ ๋ณต์žกํ•œ ๋ฐ์ดํ„ฐ ์‹œ๊ฐํ™”๋ฅผ ์‹คํ–‰ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

AppMaster ์˜ Frontend Canvas API ํ†ตํ•ฉ์€ ์ƒ์„ฑ๋œ ๋ฐฑ์—”๋“œ ์‹œ์Šคํ…œ์—๋„ ์ด ๊ฐ•๋ ฅํ•œ ๊ธฐ์ˆ ์— ๋Œ€ํ•œ ์ง€์›์ด ํ†ตํ•ฉ๋˜์–ด ์žˆ๊ธฐ ๋•Œ๋ฌธ์— no-code ์›น ๋ฐ ๋ชจ๋ฐ”์ผ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๋„˜์–ด ํ™•์žฅ๋ฉ๋‹ˆ๋‹ค. AppMaster ๊ฐ€ ์ƒ์„ฑํ•œ ๋ฐฑ์—”๋“œ ์‹œ์Šคํ…œ์€ ํ”„๋ŸฐํŠธ์—”๋“œ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜๊ณผ ์›ํ™œํ•˜๊ฒŒ ์ž‘๋™ํ•˜๋„๋ก ์„ค๊ณ„๋˜์–ด ์‚ฌ์šฉ์ž๊ฐ€ ํ”„๋ŸฐํŠธ์—”๋“œ ์บ”๋ฒ„์Šค API๊ฐ€ ์ œ๊ณตํ•˜๋Š” ๊ณ ๊ธ‰ ๊ธฐ๋Šฅ์„ ์ตœ๋Œ€ํ•œ ํ™œ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

ํšจ์œจ์„ฑ๊ณผ ์„ฑ๋Šฅ์— ์ค‘์ ์„ ๋‘” AppMaster Frontend Canvas API์˜ ์‚ฌ์šฉ์ด ์—…๊ณ„ ํ‘œ์ค€ ๋ฐ ๋ชจ๋ฒ” ์‚ฌ๋ก€๋ฅผ ์ค€์ˆ˜ํ•˜๊ณ  Vue3 JavaScript ํ”„๋ ˆ์ž„์›Œํฌ์™€ ๊ฐ™์€ ๋‹ค๋ฅธ ์ตœ์‹  ์›น ๊ธฐ์ˆ ๊ณผ์˜ ํ˜ธํ™˜์„ฑ์„ ์œ ์ง€ํ•˜๋„๋ก ๋ณด์žฅํ•ฉ๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ ๋ชจ๋ฒ” ์‚ฌ๋ก€๋ฅผ ์ค€์ˆ˜ํ•จ์œผ๋กœ์จ AppMaster ํ”Œ๋žซํผ์„ ์‚ฌ์šฉํ•˜์—ฌ ๊ตฌ์ถ•๋œ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์€ ์„ฑ๋Šฅ์ด ์ž˜ ์ตœ์ ํ™”๋˜์–ด ์‚ฌ์šฉ์ž๊ฐ€ ๋‹ค์–‘ํ•œ ์žฅ์น˜์™€ ๋ธŒ๋ผ์šฐ์ €์—์„œ Frontend Canvas API๊ฐ€ ์ œ๊ณตํ•˜๋Š” ํ’๋ถ€ํ•œ ๊ฐ€๋Šฅ์„ฑ์„ ์ตœ๋Œ€ํ•œ ํ™œ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

ํ’ˆ์งˆ๊ณผ ์‚ฌ์šฉ ํŽธ์˜์„ฑ์— ๋Œ€ํ•œ AppMaster ์˜ ์•ฝ์†์€ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ๊ฐœ๋ฐœ์— ๋Œ€ํ•œ ํ”Œ๋žซํผ์˜ ํ˜์‹ ์ ์ธ ์ ‘๊ทผ ๋ฐฉ์‹์œผ๋กœ ํ™•์žฅ๋ฉ๋‹ˆ๋‹ค. ํ”Œ๋žซํผ์˜ ์‹œ๊ฐ์  ๋นŒ๋”๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ์‚ฌ์šฉ์ž๋Š” ์ง์ ‘ ์ฝ”๋”ฉํ•  ํ•„์š” ์—†์ด ๋ณต์žกํ•œ ์‚ฌ์šฉ์ž ์ธํ„ฐํŽ˜์ด์Šค, ๋ณต์žกํ•œ ๋น„์ฆˆ๋‹ˆ์Šค ๋…ผ๋ฆฌ ๋ฐ ์‹œ๊ฐ์ ์œผ๋กœ ํ’๋ถ€ํ•œ ๊ตฌ์„ฑ ์š”์†Œ๋ฅผ ๊ฐ–์ถ˜ ๋ฉ‹์ง„ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๋งŒ๋“ค ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. Frontend Canvas API๋ฅผ ์ด no-code ํ™˜๊ฒฝ์— ํ†ตํ•ฉํ•จ์œผ๋กœ์จ AppMaster ๊ธฐ์ˆ ์ ์ธ ์ง€์‹์ด ์—†๋Š” ์‚ฌ์šฉ์ž๋ผ๋„ ์ด ๊ฐ•๋ ฅํ•œ ๋ Œ๋”๋ง ๊ธฐ์ˆ ์˜ ์ž ์žฌ๋ ฅ์„ ์ตœ๋Œ€ํ•œ ํ™œ์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•ด์ค๋‹ˆ๋‹ค.

ํ˜„๋Œ€ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ๊ฐœ๋ฐœ์˜ ์—ญ๋™์ ์ธ ํ™˜๊ฒฝ์—์„œ Frontend Canvas API๋Š” ๊ฐœ๋ฐœ์ž, ๋””์ž์ด๋„ˆ, ์‚ฌ์šฉ์ž ๋ชจ๋‘์—๊ฒŒ ์—„์ฒญ๋‚œ ๊ฐ€์น˜์™€ ๋‹ค์–‘์„ฑ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. AppMaster ์˜ ์ด ๊ฐ•๋ ฅํ•œ API ํ†ตํ•ฉ์€ ๋ชจ๋“  ๊ธฐ์ˆ  ์ˆ˜์ค€์˜ ์‚ฌ์šฉ์ž๊ฐ€ ์‹œ๊ฐ์ ์œผ๋กœ ํ’๋ถ€ํ•œ ๊ณ ๊ธ‰ ๊ณ ์„ฑ๋Šฅ ์›น ๋ฐ ๋ชจ๋ฐ”์ผ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ์ž์‹ ๊ฐ ์žˆ๊ณ  ์‰ฝ๊ฒŒ ๋งŒ๋“ค ์ˆ˜ ์žˆ๋„๋ก ์ง€์›ํ•˜๋Š” ๊ฐ•๋ ฅํ•˜๊ณ  ํ™•์žฅ ๊ฐ€๋Šฅํ•œ ํ”Œ๋žซํผ์„ ์ œ๊ณตํ•˜๊ฒ ๋‹ค๋Š” ์•ฝ์†์„ ๋ณด์—ฌ์ค๋‹ˆ๋‹ค.

๊ฒฐ๋ก ์ ์œผ๋กœ Frontend Canvas API๋Š” AppMaster ์˜ ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ์„ ์œ„ํ•œ no-code ํ”Œ๋žซํผ์˜ ์ค‘์š”ํ•œ ์š”์†Œ์ž…๋‹ˆ๋‹ค. ํ’๋ถ€ํ•œ ๊ธฐ๋Šฅ์„ ํ†ตํ•ด ๊ฐœ๋ฐœ์ž๋Š” ๋ฐ์ดํ„ฐ ์‹œ๊ฐํ™”, ์‹ค์‹œ๊ฐ„ ๊ทธ๋ž˜ํ”ฝ ๋ Œ๋”๋ง ๋“ฑ๊ณผ ๊ฐ™์€ ๊ณ ๊ธ‰ ๊ธฐ๋Šฅ์„ ๊ฐ–์ถ˜ ์‹œ๊ฐ์ ์œผ๋กœ ๋งค๋ ฅ์ ์ธ ๊ณ ์„ฑ๋Šฅ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๋งŒ๋“ค ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. Frontend Canvas API์˜ ๊ฐ•๋ ฅํ•œ ๊ธฐ๋Šฅ๊ณผ AppMaster ์˜ ํ˜์‹ ์ ์ด๊ณ  ํšจ์œจ์ ์ธ no-code ๊ฐœ๋ฐœ ํ™˜๊ฒฝ์„ ๊ฒฐํ•ฉํ•จ์œผ๋กœ์จ ์กฐ์ง์€ ์ƒˆ๋กœ์šด ๊ธฐํšŒ๋ฅผ ํฌ์ฐฉํ•˜๊ณ  ํ”„๋กœ์„ธ์Šค๋ฅผ ๊ฐ„์†Œํ™”ํ•˜๋ฉฐ ์ตœ์‹  ์†Œํ”„ํŠธ์›จ์–ด ๊ธฐ์ˆ ์˜ ์ง„์ •ํ•œ ์ž ์žฌ๋ ฅ์„ ํ™œ์šฉํ•˜์—ฌ ๋น„์ฆˆ๋‹ˆ์Šค ์„ฑ์žฅ์„ ์ด‰์ง„ํ•˜๊ณ  ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์„ ํ–ฅ์ƒ์‹œํ‚ฌ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.