JQuery๋ HTML ๋ฌธ์์ JavaScript ๊ฐ์ ์ํธ ์์ฉ์ ๋จ์ํํ๋ ๋๋ฆฌ ์ฌ์ฉ๋๋ ์คํ ์์ค JavaScript ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ ๋๋ค. ์น ๊ฐ๋ฐ ํ๋ก์ธ์ค์ ํจ์จ์ฑ๊ณผ ์์ฐ์ฑ์ ํฅ์์ํค๋๋ก ์ค๊ณ๋ JQuery๋ CSS์ ์ํํ ์กฐ์์ ๋ฌผ๋ก ๋ ์ฌ์ด ์ด๋ฒคํธ ์ฒ๋ฆฌ, ์ ๋๋ฉ์ด์ ๋ฐ AJAX ์ํธ ์์ฉ์ ๊ฐ๋ฅํ๊ฒ ํ๋ ๋ค์ํ ๊ธฐ๋ฅ๊ณผ ๊ธฐ๋ฅ์ ์ ๊ณตํฉ๋๋ค. John Resig๊ฐ 2006๋ ์ ์ถ์ํ JQuery๋ ํ๋ ์น ๊ฐ๋ฐ์์ ์ฌ์ค์์ ํ์ค์ผ๋ก ์๋ฆฌ๋งค๊นํ์ผ๋ฉฐ Google, Microsoft, IBM๊ณผ ๊ฐ์ ํ์ฌ๋ฅผ ํฌํจํ์ฌ ๊ด๋ฒ์ํ ์ฌ์ฉ์ ๊ธฐ๋ฐ์ ์ ์งํด ์์ต๋๋ค.
JQuery๋ฅผ ์ผ๋ฐ JavaScript์ ๊ตฌ๋ณํ๋ ํต์ฌ ์ธก๋ฉด ์ค ํ๋๋ ๊ฐ๊ฒฐํ ๊ตฌ๋ฌธ๊ณผ ์ฌ์ฉ ์ฉ์ด์ฑ์ ๋๋ค. ์ด๋ "์ ๊ฒ ์์ฑํ๊ณ ๋ ๋ง์ด ์ํ" ์์น์ ๊ตฌํํ์ฌ ๊ฐ๋ฐ์๊ฐ ๊ธฐ์กด JavaScript์ ํ์ํ ๊ฒ๋ณด๋ค ๋ ์ ์ ์ฝ๋ ์ค๋ก ์์ ์ ์ํํ ์ ์๋๋ก ํจ์ผ๋ก์จ ๋ฌ์ฑ๋ฉ๋๋ค. JQuery์ ๋ด๋ถ ๊ตฌํ์ ๋ธ๋ผ์ฐ์ ๋ถ์ผ์น๋ฅผ ์ฒ๋ฆฌํ๊ณ ๋ธ๋ผ์ฐ์ ๊ฐ ํธํ์ฑ ๊ฐ์ ์ ์ค์ ์ ๋์ด ๋ณด๋ค ์ผ๊ด๋ ๊ฐ๋ฐ์ ๊ฒฝํ์ ์ ๊ณตํฉ๋๋ค.
JQuery๋ DOM ํ์ ๋ฐ ์์ , ์ด๋ฒคํธ ์ฒ๋ฆฌ, AJAX ์์ฒญ ๋ฐ ์ ๋๋ฉ์ด์ ๊ณผ ๊ฐ์ ์น ์ฌ์ดํธ ๊ฐ๋ฐ์ ๋ค์ํ ์ธก๋ฉด์ ์ถฉ์กฑ์ํค๋ ํ๋ถํ ๋ฉ์๋ ๋ฐ ๊ธฐ๋ฅ ๋ชจ์์ ์ ๊ณตํฉ๋๋ค. ๊ฐ๋ ฅํ ์ ํ๊ธฐ ์์ง์ธ Sizzle์ ์ฌ์ฉํ๋ฉด ๊ฐ๋ฐ์๊ฐ HTML ์์์ ์ฝ๊ฒ ์ก์ธ์คํ๊ณ ์กฐ์ํ ์ ์์ผ๋ฉฐ ํธ๋ฆฌํ ๋ฉ์๋ ์ฐ๊ฒฐ์ ํตํด ์ฝ๋๋ฒ ์ด์ค๋ฅผ ๋์ฑ ์ฝ๊ธฐ ์ฝ๊ณ ์ ์ง ๊ด๋ฆฌํ๊ธฐ ์ฝ๊ฒ ๋ง๋ค ์ ์์ต๋๋ค. ๋ํ ์ฌ์ฉ ๊ฐ๋ฅํ ํ๋ฌ๊ทธ์ธ์ ๋ฐฉ๋ํ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ JQuery์ ํต์ฌ ๊ธฐ๋ฅ์ ํ์ฅํ์ฌ ํน์ ์ฌ์ฉ ์ฌ๋ก์ ๋ํ ์๋ฃจ์ ์ ์ ๊ณตํ๊ณ ์น ์ ํ๋ฆฌ์ผ์ด์ ์ ๋ณต์กํ ๊ธฐ๋ฅ ํตํฉ์ ์ฉ์ดํ๊ฒ ํฉ๋๋ค.
AppMasterno-code ํ๋ซํผ์์ ์น ์ ํ๋ฆฌ์ผ์ด์ ๊ฐ๋ฐ์ JQuery๋ฅผ ์ฌ์ฉํ๋ฉด ๋ค์ํ ์ ํ์ ์ ํ๋ฆฌ์ผ์ด์ ์ ๊ตฌ์ถํ๊ณ ๋ฐฐํฌํ๋ ํ๋ก์ธ์ค๋ฅผ ๊ฐ์ํํ๋ ค๋ ํ๋ซํผ์ ํต์ฌ ์๋ฌด๊ฐ ๋ณด์๋ฉ๋๋ค. AppMaster ์์ ์ ๊ณตํ๋ ์๊ฐ์ ๋์์ธ ๋๊ตฌ ๋ฐ ํจ์จ์ ์ธ ์์ค ์ฝ๋ ์์ฑ๊ณผ ๊ฒฐํฉ๋ JQuery์ ๊ธฐ๋ฅ์ ํจ๊ณผ์ ์ด๊ณ ํจ์จ์ ์ธ ์น ๊ฐ๋ฐ ๊ฒฝํ์ ๊ธฐ์ฌํฉ๋๋ค. ์ด๋ ๋น์ฉ ํจ์จ์ ์ด๊ณ ์๊ฐ ํจ์จ์ ์ธ ๊ฐ๋ฐ ํ๋ก์ธ์ค๋ฅผ ์ ์งํ๋ ค๋ ์ค์๊ธฐ์ ๋ฐ ๊ธฐ์ ์ ํนํ ์ ์ฉํฉ๋๋ค.
์น ๊ฐ๋ฐ ๋งฅ๋ฝ์์ JQuery๋ฅผ ํ์ฉํ๋ ๋ฐฉ๋ฒ์ ์๋ก๋ ์ต์ ์น ์ ํ๋ฆฌ์ผ์ด์ ์ ํ์์ ์ธ ๋์ ๋ฐ ๋ฐ์ํ ์ฌ์ฉ์ ์ธํฐํ์ด์ค(UI)๋ฅผ ๋ง๋๋ ๊ฒ์ด ์์ต๋๋ค. JQuery์ ๊ฐ๋ ฅํ ์กฐ์ ๊ธฐ๋ฅ๊ณผ ์ด๋ฒคํธ ์ฒ๋ฆฌ ๋ฐฉ๋ฒ์ ํ์ฉํ์ฌ ๊ฐ๋ฐ์๋ ๋์ฑ ๋งค๋ ฅ์ ์ธ ์ฌ์ฉ์ ๊ฒฝํ์ ์ ๊ณตํ๋ ์ฌ๋ผ์ด๋, ์์ฝ๋์ธ, ํญ ํ์ ์์คํ ๊ณผ ๊ฐ์ ๋ํํ ๊ตฌ์ฑ ์์๋ฅผ ๊ตฌ์ถํ ์ ์์ต๋๋ค. ๋ํ JQuery์ AJAX ์ง์์ ํตํด ์ ์ฒด ํ์ด์ง๋ฅผ ๋ค์ ๋ก๋ํ ํ์ ์์ด ์น ํ์ด์ง ์ฝํ ์ธ ๋ฅผ ์ํํ๊ณ ์ํํ๊ฒ ์ ๋ฐ์ดํธํ ์ ์์ด ์น ์ฑ ๊ธฐ๋ฅ๊ณผ ์ฑ๋ฅ์ด ๋์ฑ ํฅ์๋ฉ๋๋ค.
JQuery์ ์ฌ์ฉ ์ฉ์ด์ฑ๊ณผ ๊ฐ๋ ฅํ ๊ธฐ๋ฅ์๋ ๋ถ๊ตฌํ๊ณ ์ต๊ทผ ๋ช ๋ ๋์ Angular, React ๋ฐ Vue.js์ ๊ฐ์ ์ต์ JavaScript ํ๋ ์์ํฌ ๋ฐ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ ์ถํ์ผ๋ก ์น ๊ฐ๋ฐ ํ๊ฒฝ์ด ๋ฐ์ ํ๋ค๋ ์ ์ ์ฃผ๋ชฉํ ๊ฐ์น๊ฐ ์์ต๋๋ค. ์ด๋ฌํ ๊ธฐ์ ์ ์น ์ ํ๋ฆฌ์ผ์ด์ ๊ตฌ์ถ์ ์ํ ๋ค์ํ ์๋ฃจ์ ๊ณผ ์ํคํ ์ฒ ์ ๊ทผ ๋ฐฉ์์ ์ ๊ณตํ๋ฉฐ ์ข ์ข ์ฑ๋ฅ, ํ์ฅ์ฑ ๋ฐ ์ ์ง ๊ด๋ฆฌ ์ธก๋ฉด์์ JQuery๋ฅผ ๋ฅ๊ฐํฉ๋๋ค. ๊ทธ๋ผ์๋ ๋ถ๊ตฌํ๊ณ JQuery๋ ํนํ ๋จ์ํ ์น ์ ํ๋ฆฌ์ผ์ด์ ๊ณผ ๋ ๊ฑฐ์ ํ๋ก์ ํธ์ ๋ํด ์ ๊ณ์์ ๋งค์ฐ ์ธ๊ธฐ ์๊ณ ๊ฐ์น ์๋ ๋๊ตฌ๋ก ๋จ์ ์์ต๋๋ค.
AppMaster ํ๋ซํผ์ ์ฃผ๋ก ํ๋ฐํธ์๋ ๊ฐ๋ฐ์ ์ํด Vue3 ํ๋ ์์ํฌ์ JS/TS๋ฅผ ์ฌ์ฉํ์ฌ ์น ์ ํ๋ฆฌ์ผ์ด์ ์ ์์ฑํ์ง๋ง, JQuery์ ๋ํ ์ง์๊ณผ ์ดํด๋ ๋ค์ํ ๊ธฐ์ ์คํ๊ณผ ํ๊ฒฝ์ ์ฌ์ฉํ๋ ๊ฐ๋ฐ์์๊ฒ ๊ณ์ํด์ ๊ฐ์น๊ฐ ์์ต๋๋ค. JQuery์ ์ต์ํ๋ฉด ๋ ๋์ ์น ๊ฐ๋ฐ ์ํ๊ณ๋ฅผ ์ดํดํ๋ ๋ฐ ๋์์ด ๋๋ฉฐ ๊ฐ๋ฐ์๋ JQuery๋ฅผ ๊ธฐ๋ณธ JavaScript ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ก ์ฌ์ฉํ๋ ๋ ๊ฑฐ์ ์์คํ ์ ์ ์ง ๊ด๋ฆฌ, ์ ๋ฐ์ดํธ ๋๋ ํ์ฅํ ์ ์์ต๋๋ค.
๊ฒฐ๋ก ์ ์ผ๋ก JQuery๋ HTML ๋ฌธ์์ JavaScript ๊ฐ์ ์ํธ ์์ฉ์ ๋จ์ํํ๊ณ ํฉ๋ฆฌํํจ์ผ๋ก์จ ํ๋ ์น ๊ฐ๋ฐ ํ๊ฒฝ์ ํ์ฑํ๋ ๋ฐ ์ค์ํ ์ญํ ์ ํด์์ต๋๋ค. ๊ฐ๋ ฅํ๊ณ ํจ์จ์ ์ด๋ฉฐ ์ฌ์ฉ์ ์นํ์ ์ธ ๊ธฐ๋ฅ์ผ๋ก ์ธํด ๋ค์ํ ๋ฒ์์ ๋ณต์ก์ฑ์ ์ง๋ ์น ์ ํ๋ฆฌ์ผ์ด์ ๊ฐ๋ฐ์์๊ฒ ์ธ๊ธฐ ์๋ ์ ํ์ด ๋์์ต๋๋ค. ๋ํ JQuery์ AppMaster ์ ์ ํ ํตํฉ์ ํตํด ๋ ๋น ๋ฅด๊ณ ๋น์ฉ ํจ์จ์ ์ธ ์น ๊ฐ๋ฐ์ด ๊ฐ๋ฅํด์ง๋ฉฐ ๊ณ ๊ฐ์ ๋ฐฑ์๋, ์น ๋ฐ ๋ชจ๋ฐ์ผ ํ๊ฒฝ์ ํฌํจํ ์ฌ๋ฌ ํ๋ซํผ์์ ํ์ฅ ๊ฐ๋ฅํ๊ณ ๊ฐ๋ ฅํ ์ ํ๋ฆฌ์ผ์ด์ ์ ๊ตฌ์ถํ ์ ์์ต๋๋ค.