ํ•จ์ˆ˜ ์ฒด์ด๋‹ ๋˜๋Š” ์œ ์ฐฝํ•œ ์ธํ„ฐํŽ˜์ด์Šค๋ผ๊ณ ๋„ ์•Œ๋ ค์ง„ ๋ฉ”์„œ๋“œ ์ฒด์ด๋‹์€ ๋‹จ์ผ ๊ฐœ์ฒด๋‚˜ ํ•จ์ˆ˜์— ๋Œ€ํ•œ ์—ฌ๋Ÿฌ ๋ฉ”์„œ๋“œ ํ˜ธ์ถœ์„ ๋‹จ์ผ ํ‘œํ˜„์‹์œผ๋กœ ํ•จ๊ป˜ ์—ฐ๊ฒฐํ•  ์ˆ˜ ์žˆ๋Š” ์šฐ์•„ํ•œ ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๊ธฐ์ˆ ์ž…๋‹ˆ๋‹ค. 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 ํ”Œ๋žซํผ์— ๋ฉ”์„œ๋“œ ์ฒด์ด๋‹์„ ์ฑ„ํƒํ•˜๋ฉด ๊ฐœ๋ฐœ ๊ฒฝํ—˜์ด ๋”์šฑ ํ–ฅ์ƒ๋˜์–ด ๊ฐœ๋ฐœ์ž๊ฐ€ ๋”์šฑ ๋น ๋ฅด๊ณ  ๊ฐ„๋‹จํ•˜๊ฒŒ ๊ฐ•๋ ฅํ•˜๊ณ  ํ˜„๋Œ€์ ์ธ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๋งŒ๋“ค ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.