Frontend Progressive Enhancement๋ ์ฌ์ฉ์ ๊ฒฝํ์ ์ ํ์ํค์ง ์์ผ๋ฉด์ ํต์ฌ HTML ๊ตฌ์กฐ์ ๊ณ ๊ธ ํน์ง, ๊ธฐ๋ฅ ๋ฐ ๊ธฐ๋ฅ์ ์ ์ง์ ์ผ๋ก ์ถ๊ฐํ์ฌ ์น ์์ฉ ํ๋ก๊ทธ๋จ์ ๊ตฌ์ถํ๋ ๋ฐ ์ค์ ์ ๋๋ ์ํํธ์จ์ด ๊ฐ๋ฐ ์ฒ ํ ๋ฐ ๋ฐฉ๋ฒ๋ก ์ ๋๋ค. ์ด ์ ๊ทผ ๋ฐฉ์์ ์ฃผ์ ๋ชฉํ๋ ์น ์ ํ๋ฆฌ์ผ์ด์ ์ด ๋ค์ํ ํ๋ซํผ, ์ฅ์น ๋ฐ ๋ธ๋ผ์ฐ์ ์์ ์ํํ๊ฒ ์๋ํ ์ ์๋๋ก ํ๋ ๋์์ ์ฌ์ฉ์์ ๊ธฐ๋ฅ์ ๋ฐ๋ผ ์ต์ ์ ๊ฒฝํ์ ์ ๊ณตํ๋ ๊ฒ์ ๋๋ค.
ํ๋ฐํธ์๋ ์ ์ง์ ํฅ์์ ์ฌ์ฉํ ๋ ๊ฐ๋ฐ์๋ ์น ์ ํ๋ฆฌ์ผ์ด์ ์ ํต์ฌ ์ฝํ ์ธ ์ ํ์ ๊ธฐ๋ฅ์ ์ฐ์ ์์๋ฅผ ์ง์ ํ๊ณ ๋์์ธ์ ์ํ CSS, ์ํธ ์์ฉ์ ์ํ JavaScript, AJAX ๋๋ ์น API์ ๊ฐ์ ์ต์ ์น ๊ธฐ์ ๊ณผ ๊ฐ์ ์ถ๊ฐ ๋ ์ด์ด๋ฅผ ์ถ๊ฐ๋ก ๊ตฌ์ถํฉ๋๋ค. ์ด๋ ๊ฒ ํ๋ฉด ์ฑ๋ฅ์ด ๋จ์ด์ง๋ ์ฅ์น๋ ๋ธ๋ผ์ฐ์ ๋ฅผ ์ฌ์ฉํ๋ ์ฌ์ฉ์๋ ์ ํ๋ฆฌ์ผ์ด์ ์ ๊ณ์ ์ก์ธ์คํ๊ณ ์ฌ์ฉํ ์ ์์ผ๋ฉฐ, ๊ณ ๊ธ ์ํํธ์จ์ด ๋ฐ ํ๋์จ์ด๋ฅผ ์ฌ์ฉํ๋ ์ฌ์ฉ์์๊ฒ๋ ๋์ฑ ํ๋ถํ๊ณ ๋ํํ ํ๊ฒฝ์ ์ ๊ณตํ ์ ์์ต๋๋ค. ์ด๋ฌํ ์ ์ํ ๋์์ธ ์ ๊ทผ ๋ฐฉ์์ ์ฌ์ฉ์์ ๊ธฐ์ ์ ๋ฅ๋ ฅ์ด๋ ํ๊ณ์ ๊ด๊ณ์์ด ์ฝํ ์ธ ๊ฐ ๋ณดํธ์ ์ผ๋ก ์ ๊ทผ ๊ฐ๋ฅํ๊ณ ๊ธฐ๋ฅ์ ์์ ๋ณด์ฅํฉ๋๋ค.
์ฐ๊ตฌ ๋ฐ ํต๊ณ์ ๋ฐ๋ฅด๋ฉด ์ ์ง์ ์ธ ํฅ์์ ์ฌ์ฉํ๋ฉด ์ ํ๋ฆฌ์ผ์ด์ ์ฑ๋ฅ์ด ํฌ๊ฒ ํฅ์๋์ด ๋ก๋ฉ ์๊ฐ์ด ๋นจ๋ผ์ง๊ณ ์ ๋ฐ์ ์ธ ์ฌ์ฉ์ ๊ฒฝํ์ด ํฅ์๋ ์ ์๋ ๊ฒ์ผ๋ก ๋ํ๋ฌ์ต๋๋ค. 2018๋ Google Developers์ ์ฐ๊ตฌ์ ๋ฐ๋ฅด๋ฉด ์น ์ ํ๋ฆฌ์ผ์ด์ ์ ์ ์ง์ ์ธ ํฅ์์ ์ ์ฉํ๋ฉด ๋ก๋ฉ ์๋๊ฐ ํ๊ท 68% ์ฆ๊ฐํ๋ ๋์์ ์ฌ์ฉ์ ์ดํ์ด ํฌ๊ฒ ๊ฐ์ํ์ต๋๋ค. ๋ํ Akamai Technologies๊ฐ ์ค์ํ 2020๋ ์ฐ๊ตฌ์ ๋ฐ๋ฅด๋ฉด ์ ์ง์ ์ธ ํฅ์์ ์ฌ์ฉํ๋ ์ฌ์ดํธ์์๋ ๋ก๋ ์๊ฐ์ด ์ต๋ 70% ๊ฐ์ํ์ฌ ์ฌ์ฉ์ ์ ์ง์จ์ด ๋์์ง๊ณ ๊ฒ์ ์์ง ์ต์ ํ(SEO) ์์๊ฐ ํฅ์๋๋ ๊ฒ์ผ๋ก ๋ํ๋ฌ์ต๋๋ค.
ํ๋ฐํธ์๋์ ์ ์ง์ ์ธ ํฅ์์ ํต์ฌ์ ์ฅ์น๋ ๋ธ๋ผ์ฐ์ ๊ธฐ๋ฅ์ ๊ด๊ณ์์ด ๋ชจ๋ ์ฌ์ฉ์๊ฐ ํต์ฌ ์ฝํ ์ธ ์ ๊ธฐ๋ณธ ๊ธฐ๋ฅ์ ํญ์ ์ก์ธ์คํ ์ ์์ด์ผ ํ๋ค๋ ๋ฏฟ์์ ๋๋ค. ์ฌ์ฉ ๊ฐ๋ฅํ ๊ธฐ๋ฐ ์์ ๊ณ ๊ธ ๊ธฐ๋ฅ๊ณผ ์ต์ ํ ๊ธฐ์ ์ ๊ณ์ธตํํจ์ผ๋ก์จ ๊ฐ๋ฐ์๋ ๋ ์ง๋ณด๋ ๊ธฐ์ ์ ๋ณด์ ํ ์ฌ์ฉ์๋ฅผ ๋ฐฐ์ ํ์ง ์๊ณ ๋ ์ฌ์ฉ์ ๊ฒฝํ์ ์ ์ง์ ์ผ๋ก ํฅ์์ํฌ ์ ์์ต๋๋ค. ๋ค์ค ์ฅ์น ์ฌ์ฉ์์ ์ธ๊ณ์์ ์ด ๋ฐฉ๋ฒ๋ก ์ ๊ด๋ฒ์ํ ํธํ์ฑ๊ณผ ๊ฐ๋ ฅํ ์ ๊ทผ์ฑ์ ๋ณด์ฅํฉ๋๋ค.
๊ฒฌ๊ณ ํ๊ณ ๊ฐ๋ ฅํ no-code ํ๋ซํผ์ธ AppMaster ์ฌ์ฉํ๋ฉด ์ฌ์ฉ์๋ ์น ์ ํ๋ฆฌ์ผ์ด์ ์ ๋ง๋ค ๋ ํ๋ฐํธ์๋ ์ ์ง์ ํฅ์ ์์น์ ํ์ฉํ ์ ์์ต๋๋ค. ์ด ํ๋ซํผ์ ํตํด ์ฌ์ฉ์๋ drag-and-drop ์ธํฐํ์ด์ค๋ฅผ ์ฌ์ฉํ์ฌ ์๊ฐ์ ์ผ๋ก ๋ฐ์ดํฐ ๋ชจ๋ธ์ ์์ฑํ๊ณ , REST API๋ฅผ ์ค๊ณํ๊ณ , ๋น์ฆ๋์ค ๋ก์ง์ ์ ์ฉํ๊ณ , UI๋ฅผ ๊ตฌ์ถํ ์ ์์ต๋๋ค. ํ๋ฐํธ์๋ ์ํคํ ์ฒ๋ ํด๋ผ์ด์ธํธ ์ธก๊ณผ ์๋ฒ ์ธก ๋ชจ๋์์ ๊ตฌ์ฑ ์์๋ฅผ ๋ ๋๋งํ๋ ์ง๋ณด์ ์ธ ํน์ฑ๊ณผ ๊ธฐ๋ฅ์ผ๋ก ์ ์๋ ค์ง ๋ค์ฌ๋ค๋ฅํ๊ณ ์ธ๊ธฐ ์๋ JavaScript ํ๋ ์์ํฌ์ธ Vue.js๋ฅผ ํ์ฉํฉ๋๋ค.
AppMaster ์์ฑ ์น ์ ํ๋ฆฌ์ผ์ด์ ์์ ํ๋ฐํธ์๋ ์ ์ง์ ํฅ์์ ์์์ ์ธ ์ค์ ์ ํ๋ฆฌ์ผ์ด์ ์ค ํ๋๋ ์ ํ ๋ฐ์ดํฐ๋ฅผ ๋ก๋ํ๊ธฐ ์ํด ๋์ ๊ตฌ์ฑ ์์๋ฅผ ์ฌ์ฉํ๋ ๊ฒ๊ณผ ๊ด๋ จ์ด ์์ ์ ์์ต๋๋ค. ํต์ฌ ์ฝํ ์ธ ์ ์ฐ์ ์์๋ฅผ ์ง์ ํ๊ธฐ ์ํด ๊ฐ๋ฐ์๋ ๋จผ์ ๊ธฐ๋ณธ HTML ๊ตฌ์กฐ์ CSS ์คํ์ผ์ ์ค์ ํ์ฌ JavaScript ์ง์ ๊ธฐ๋ฅ ์์ด ์ ํ ๋ฐ์ดํฐ๋ฅผ ํ์ํฉ๋๋ค. ๊ทธ๋ฐ ๋ค์ ์ ํ๋ฆฌ์ผ์ด์ ์ ์ ๋ฐ์ ์ธ ์ํธ ์์ฉ๊ณผ ์ฌ์ฉ์ ๊ฒฝํ์ ํฅ์์ํค๊ธฐ ์ํด JavaScript๊ฐ ์ถ๊ฐ๋ฉ๋๋ค. ๊ฒฐ๊ณผ ์น ์ ํ๋ฆฌ์ผ์ด์ ์ ์ค๋๋ ์ฅ์น๋ ๋ธ๋ผ์ฐ์ ๋ฅผ ์ฌ์ฉํ๋ ์ฌ์ฉ์์๊ฒ๋ ๊ธฐ๋ฅ์ ๊ฒฝํ์ ์ ๊ณตํ์ง๋ง ๊ณ ๊ธ ๊ธฐ๋ฅ์ ์ฌ์ฉํ๋ ์ฌ์ฉ์์๊ฒ๋ ํฌ๊ฒ ๊ฐ์ ๋๊ณ ๊ธฐ๋ฅ์ด ํ๋ถํ ์ธํฐํ์ด์ค๋ฅผ ํ์ํฉ๋๋ค.
๋ณดํธ์ ์ธ ์ ๊ทผ์ฑ์ ๋์ด๋ ๊ฒ ์ธ์๋ ์ ์ง์ ์ธ ํฅ์ ์ ๊ทผ ๋ฐฉ์์ ๊ฐ๋ฐ์์๊ฒ ์ฌ๋ฌ ๊ฐ์ง ๋ค๋ฅธ ์ด์ ์ ์ ๊ณตํฉ๋๋ค. ์๋ฅผ ๋ค์ด, ์ฝ๋ ํ์ง๊ณผ ๋ชจ๋์ฑ์ ์ ์งํ๋ ๋ฐ ๋์์ด ๋๋ฏ๋ก ์ ํ๋ฆฌ์ผ์ด์ ์ ๋๋จธ์ง ๋ถ๋ถ์ ํฌ๊ฒ ์ค๋จํ์ง ์๊ณ ๊ธฐ๋ฅ์ ์ถ๊ฐ, ์ ๊ฑฐ ๋๋ ๋ณ๊ฒฝํ ์ ์์ต๋๋ค. ๋ํ ์ ์ง์ ์ธ ํฅ์์ ํตํด ์๋ฏธ๋ก ์ HTML ๋งํฌ์ , ์ ์ ํ ์ฝํ ์ธ ๊ณ์ธต ๊ตฌ์กฐ, WAI-ARIA ์์ฑ์ ์ ์ ํ ์ฌ์ฉ ๋ฑ ์ ๊ทผ์ฑ์ ๋ํ ๋ชจ๋ฒ ์ฌ๋ก์ ์ฌ์ฉ์ ์ฅ๋ คํ์ฌ ์ฅ์ ๋ ๋ณด์กฐ ๊ธฐ์ ์ด ์๋ ์ฌ์ฉ์๊ฐ ์น ์ ํ๋ฆฌ์ผ์ด์ ์ ์ก์ธ์คํ ์ ์๋๋ก ๋ณด์ฅํฉ๋๋ค.
๊ฒฐ๋ก ์ ์ผ๋ก, ํ๋ฐํธ์๋ ์ ์ง์ ํฅ์์ ๋ค์ํ ์ฅ์น ๋ฐ ๋ธ๋ผ์ฐ์ ๊ธฐ๋ฅ์ ์ ์ํ๋ ๋ณดํธ์ ์ผ๋ก ์ก์ธ์ค ๊ฐ๋ฅํ๊ณ ๊ธฐ๋ฅ์ด ๋ฐ์ด๋ ์ฌ์ฉ์ ๊ฒฝํ์ ์ ๊ณตํ๋๋ก ์ค๊ณ๋ ํ๋ ์น ๊ฐ๋ฐ์ ํ์ ๋ฐฉ๋ฒ๋ก ์ ๋๋ค. ํต์ฌ ์ฝํ ์ธ ์ ๊ธฐ๋ฅ์ ์ฐ์ ์์๋ฅผ ์ ํ๋ ๋์์ ๊ณ ๊ธ ๊ธฐ๋ฅ๊ณผ ์ต์ ํ๋ฅผ ์ ์ง์ ์ผ๋ก ์ถ๊ฐํจ์ผ๋ก์จ ๊ฐ๋ฐ์๋ ๋ค์ํ ์ฌ์ฉ์ ์๊ตฌ ์ฌํญ์ ์ถฉ์กฑํ๋ ํฌ๊ด์ ์ด๊ณ ํ์ฅ ๊ฐ๋ฅํ ๊ณ ํ์ง ์น ์ ํ๋ฆฌ์ผ์ด์ ์ ๋ง๋ค ์ ์์ต๋๋ค. AppMaster ํ๋ซํผ์ ์ฌ์ฉํ๋ฉด ๊ธฐ์ ์ ์ธ ์ง์์ด ์๋ ์ฌ์ฉ์๋ผ๋ ์ด ๊ฐ๋ ฅํ ์ ๊ทผ ๋ฐฉ์์ ํ์ฉํ์ฌ ๋ชจ๋ ์ฌ์ฉ์์๊ฒ ์ต์ ํ๋๊ณ ๋งค๋ ฅ์ ์ธ ๊ฒฝํ์ ์ ๊ณตํ๋ ์ ๋ฌธ์ ์ผ๋ก ๋์์ธ๋ ์น ์ ํ๋ฆฌ์ผ์ด์ ์ ๊ตฌ์ถํ ์ ์์ต๋๋ค.