ํจ์ ์ฒด์ด๋ ๋๋ ์ ์ฐฝํ ์ธํฐํ์ด์ค๋ผ๊ณ ๋ ์๋ ค์ง ๋ฉ์๋ ์ฒด์ด๋์ ๋จ์ผ ๊ฐ์ฒด๋ ํจ์์ ๋ํ ์ฌ๋ฌ ๋ฉ์๋ ํธ์ถ์ ๋จ์ผ ํํ์์ผ๋ก ํจ๊ป ์ฐ๊ฒฐํ ์ ์๋ ์ฐ์ํ ํ๋ก๊ทธ๋๋ฐ ๊ธฐ์ ์ ๋๋ค. AppMaster ์ ๊ฐ์ no-code ํ๋ซํผ์ ์ฌ์ฉ์ ์ง์ ๊ธฐ๋ฅ๊ณผ ๊ด๋ จํ์ฌ ๋ฉ์๋ ์ฒด์ด๋์ ๋ณต์กํ ์์ ์ ์ฒด์ธ์ผ๋ก ์ฐ๊ฒฐ๋ ๋ ์๊ณ ๊ด๋ฆฌํ๊ธฐ ์ฌ์ด ์ผ๋ จ์ ๋จ๊ณ๋ก ๋๋์ด ๋ณต์กํ ์์ ์ ๋จ์ํํฉ๋๋ค. ์ด ๋ฐฉ์์ JavaScript, Python, jQuery, Vue ๋ฑ ๋ค์ํ ํ๋ก๊ทธ๋๋ฐ ์ธ์ด ๋ฐ ํ๋ ์์ํฌ์ ๋๋ฆฌ ์ฑํ๋์์ต๋๋ค.
๋ฉ์๋ ์ฒด์ด๋์์๋ ํธ์ถ๋ ๊ฐ ํจ์๊ฐ ์์ ์ ์ํํ๋ ๊ฐ์ฒด๋ฅผ ๋ฐํํ๋ฏ๋ก ๋์ผํ ๊ฐ์ฒด์์ ํ์ ๋ฉ์๋ ํธ์ถ์ ์ง์ ํธ์ถํ ์ ์์ต๋๋ค. ์ด ๋์์ธ ํจํด์ ์ค๊ฐ ๋ณ์์ ํ์์ฑ์ ์ค์ด๊ณ ์ฝ๋ ์ค๋ณต์ฑ์ ์ค์ฌ ๊ฐ๋ ์ฑ๊ณผ ์ ์ง ๊ด๋ฆฌ์ฑ์ ํฅ์์ํต๋๋ค. ์ด๋ ๋ณด๋ค ์์ฐ์ค๋ฝ๊ณ ์ง๊ด์ ์ธ ๋ฐฉ์์ผ๋ก ์์ ์ ๋ ผ๋ฆฌ์ ์์๋ฅผ ๋ฐ์ํ๋ ๊น๋ํ๊ณ ํจ์จ์ ์ธ ์ฝ๋ ๋์์ธ์ผ๋ก ์ด์ด์ง ์ ์์ต๋๋ค.
๋๋ฆฌ ์ฌ์ฉ๋๋ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ ๋ฉ์๋ ์ฒด์ด๋์ ๋ํ ์ ์๋ ค์ง ์๋ DOM ์กฐ์ ๋ฐ ์ด๋ฒคํธ ์ฒ๋ฆฌ๋ฅผ ์ํ ์ธ๊ธฐ ์๋ JavaScript ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ธ jQuery์ ๋๋ค. jQuery๋ ๋ฉ์๋ ์ฒด์ด๋์ ๋ง์ด ์ฌ์ฉํ๋ฏ๋ก ๊ฐ๋ฐ์๋ ๋จ์ผ ๋ช ๋ น๋ฌธ์ผ๋ก ์ ํํ ์์ ์งํฉ์ ๋ํด ์ผ๋ จ์ ์์ ์ ์ํํ ์ ์์ต๋๋ค. ์๋ฅผ ๋ค์ด:
$("#container").css("color", "red").fadeIn(500).delay(2000).fadeOut(500);
์ด ์์์๋ ๋จผ์ ID๊ฐ "container"์ธ ์์๋ฅผ ์ ํํ ๋ค์ CSS ์์ฑ 'color'๋ฅผ ๋นจ๊ฐ์์ผ๋ก ๋ณ๊ฒฝ, ์์ ํ์ด๋ ์ธ, ํ์ด๋ ์์ ์์ ์ง์ฐ, ๋ง์ง๋ง์ผ๋ก ์์๊ฐ ํ์ด๋ ์์๋ฉ๋๋ค. ๊ฐ ๋ฉ์๋๋ ๋์ผํ jQuery ๊ฐ์ฒด๋ฅผ ๋ฐํํ๋ฏ๋ก ๋์ผํ ํํ์์ ๋์ผํ ๊ฐ์ฒด์ ๋ํด ํ์ ๋ฉ์๋๋ฅผ ํธ์ถํ ์ ์์ต๋๋ค.
๋ฉ์๋ ์ฒด์ด๋์ ํต์ฌ์๋ ๋ถ๋ณ์ฑ ๊ฐ๋ ๊ณผ ํจ์ํ ํ๋ก๊ทธ๋๋ฐ ์์น์ด ์์ต๋๋ค. ํจ์ํ ํ๋ก๊ทธ๋๋ฐ์์๋ ์ฃผ์ด์ง ์ ๋ ฅ์ ๋ณ๊ฒฝํ์ง ์๊ณ ์ ๋ ฅ ๋ฐ์ดํฐ์ ์ ๋ฐ์ดํธ๋ ์ ๋ฒ์ ์ ๋ฐํํ๋ ํจ์๋ฅผ ๋ง๋๋ ๊ฒ์ด ์ค์ํฉ๋๋ค. ๋ถ๋ณ ๋ฐ์ดํฐ ๊ตฌ์กฐ๋ผ๋ ๊ฐ๋ ์ ํ ํจ์์ ์ถ๋ ฅ์ด ๋ถ์์ฉ ์์ด ์ฒด์ธ์ ์๋ ๋ค์ ํจ์์ ์ ๋ ฅ์ด ๋๋ฏ๋ก ๋ฉ์๋ ์ฒด์ด๋์ ํจ์จ์ ์ด๊ณ ์ฝ๊ฒ ์ถ๋ก ํ ์ ์๊ฒ ํด์ค๋๋ค.
์น, ๋ชจ๋ฐ์ผ ๋ฐ ๋ฐฑ์๋ ์ ํ๋ฆฌ์ผ์ด์ ๊ฐ๋ฐ์ ์ํ ๊ฐ๋ ฅํ no-code ํ๋ซํผ AppMaster ๋ ์ฌ์ฉ์ ์ ์ ํจ์ ์์ฑ ํ๋ก์ธ์ค์ ํ์ ๋ถ๋ถ์ผ๋ก ๋ฉ์๋ ์ฒด์ด๋์ ์์ ํ ์์ฉํฉ๋๋ค. AppMaster ์ ๊ฐ์ No-code ํ๋ซํผ์ ์ฌ์ฉํ๋ฉด ์ฌ์ฉ์๋ ์๊ฐ์ ์ผ๋ก ์ง๊ด์ ์ธ ์ฌ์ฉ์ ์ธํฐํ์ด์ค๋ฅผ ์ฌ์ฉํ์ฌ ์ฌ์ฉ์ ์ ์ ๊ธฐ๋ฅ์ ์ ์ํ์ฌ ๋ณต์กํ ๋น์ฆ๋์ค ๋ ผ๋ฆฌ๋ฅผ ๋ง๋ค ์ ์์ต๋๋ค. ์ด๋ฌํ ์ฌ์ฉ์ ์ ์ ๊ธฐ๋ฅ์ ๋ฉ์๋ ์ฒด์ด๋ ์๋ฆฌ๋ฅผ ์ต๋ํ ํ์ฉํ์ฌ ์์๋๋ก ๊ตฌ์ฑ ๋ฐ ์คํ๋ ์ ์์ด ๋ฐ์ํ ๋ฐ ๋ํํ ์ ํ๋ฆฌ์ผ์ด์ ์ ์ฝ๊ฒ ๊ตฌ์ถํ๊ณ ์ ์ง ๊ด๋ฆฌํ ์ ์์ต๋๋ค.
๋ฐ์ดํฐ๋ฒ ์ด์ค์์ ๊ณ ๊ฐ ๋ ์ฝ๋ ๋ชฉ๋ก์ ๊ฒ์ํ๊ณ , ๊ณ ๊ฐ์ ๋์ด๋ฅผ ๊ธฐ์ค์ผ๋ก ํํฐ๋งํ๊ณ , ๊ณ ๊ฐ ์ด๋ฆ์ ๊ธฐ์ค์ผ๋ก ๊ฒฐ๊ณผ๋ฅผ ์ ๋ ฌํ๊ณ , ๋ง์ง๋ง์ผ๋ก ์ถ๋ ฅ์ ํ์ด์ง๋ฅผ ๋งค๊ธฐ๋ ค๋ ์๋ฅผ ์๊ฐํด ๋ณด์ธ์. ๊ฐ๋ฐ์๋ AppMaster ์ ์ฌ์ฉ์ ์ ์ ํจ์์์ ๋ฉ์๋ ์ฒด์ด๋์ ํ์ฉํ์ฌ ์ด๋ฅผ ์ํํ๊ฒ ๋ฌ์ฑํ ์ ์์ต๋๋ค.
appMaster.db
.fetchCustomers()
.filterByAge(18)
.sortByName("ASC")
.ํ์ด์ง ๋งค๊น(1, 10);
์ด ์์์ fetchCustomers ํจ์๋ ๋ฐ์ดํฐ๋ฒ ์ด์ค์์ ๊ณ ๊ฐ ๋ฐ์ดํฐ๋ฅผ ๊ฒ์ํ ๋ค์ ์ ๊ณต๋ age ๋งค๊ฐ๋ณ์(18์ธ ์ด์์ ๊ณ ๊ฐ)๋ฅผ ๊ธฐ์ค์ผ๋ก ๋ฐ์ดํฐ๋ฒ ์ด์ค ๊ฒฐ๊ณผ๋ฅผ ํํฐ๋งํ๋ filterByAge ํจ์๋ก ์ ๋ฌ๋ฉ๋๋ค. ์ ๋ ฌ๋ ๋ช ๋ช ๋ ๋ชฉ๋ก์ด ๋ฐํ๋์ด paginate ํจ์์ ์ ๋ฌ๋ฉ๋๋ค. ๊ทธ๋ฌ๋ฉด ์ง์ ๋ ํ์ด์ง ๋งค๊น ๋งค๊ฐ๋ณ์(ํ์ด์ง๋น 10๊ฐ ๋ ์ฝ๋, ์ฒซ ๋ฒ์งธ ํ์ด์ง๋ถํฐ ์์)์ ๋ฐ๋ผ ๊ฒฐ๊ณผ๊ฐ ํ์๋ฉ๋๋ค.
์ ์ฐ์ฑ๊ณผ ํจ์จ์ฑ์ ๋ํ ์๊ตฌ๊ฐ ์ฆ๊ฐํจ์ ๋ฐ๋ผ ๋ฉ์๋ ์ฒด์ด๋์ ์ํํธ์จ์ด ๊ฐ๋ฐ ์ธ๊ณ์์ ๊ท์คํ ์์ฐ์ด ๋์์ผ๋ฉฐ, ํนํ ๊ฐ๋ ์ฑ ํฅ์, ์ ์ง ๊ด๋ฆฌ ์ฉ์ด์ฑ ํฅ์, ์ฝ๋ ๋ณต์ก์ฑ ๊ฐ์ ๋ฑ ๋ค์ํ ์ด์ ์ ์ ๊ณตํฉ๋๋ค. AppMaster ์ ๊ฐ์ no-code ํ๋ซํผ์ ๋ฉ์๋ ์ฒด์ด๋์ ์ฑํํ๋ฉด ๊ฐ๋ฐ ๊ฒฝํ์ด ๋์ฑ ํฅ์๋์ด ๊ฐ๋ฐ์๊ฐ ๋์ฑ ๋น ๋ฅด๊ณ ๊ฐ๋จํ๊ฒ ๊ฐ๋ ฅํ๊ณ ํ๋์ ์ธ ์ ํ๋ฆฌ์ผ์ด์ ์ ๋ง๋ค ์ ์์ต๋๋ค.