๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
728x90

Vue2

jHipster: Modern Java Development์˜ ์„ ๋‘์ฃผ์ž 1. ๋ฐฐ๊ฒฝ๊ณผ ์†Œ๊ฐœ 1.1. ๋ฐฐ๊ฒฝ jHipster๋Š” Java ๊ฐœ๋ฐœ์„ ํ˜„๋Œ€์ ์ด๊ณ  ์ƒ์‚ฐ์ ์œผ๋กœ ๋งŒ๋“ค๊ธฐ ์œ„ํ•œ ๋ชฉ์ ์œผ๋กœ ๊ฐœ๋ฐœ๋˜์—ˆ์Šต๋‹ˆ๋‹ค. Spring Boot์™€ Angular/React/Vue.js ๋“ฑ์˜ ๊ธฐ์ˆ  ์Šคํƒ์„ ํšจ๊ณผ์ ์œผ๋กœ ๊ฒฐํ•ฉํ•˜์—ฌ ๊ฐœ๋ฐœ์ž๋“ค์ด ๋น ๋ฅด๊ฒŒ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๊ฐœ๋ฐœํ•˜๊ณ  ๋ฐฐํฌํ•  ์ˆ˜ ์žˆ๋„๋ก ์ง€์›ํ•ฉ๋‹ˆ๋‹ค. 1.2. ์†Œ๊ฐœ ๊ธฐ์ˆ  ์Šคํƒ ์œตํ•ฉ: Spring Boot๋ฅผ ๋ฐฑ์—”๋“œ๋กœ ์‚ฌ์šฉํ•˜๋ฉด์„œ Angular/React/Vue.js ๋“ฑ์˜ ํ”„๋ก ํŠธ์—”๋“œ ๊ธฐ์ˆ ๊ณผ์˜ ํ†ตํ•ฉ์„ ์‰ฝ๊ฒŒ ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ฝ”๋“œ ์ƒ์„ฑ๊ณผ ํ…œํ”Œ๋ฆฟ: CRUD ์ž‘์—… ๋ฐ ๋ณด์•ˆ ์„ค์ • ๋“ฑ์„ ์ž๋™์œผ๋กœ ์ƒ์„ฑํ•˜๋Š” ์ฝ”๋“œ ์ƒ์„ฑ๊ณผ ๋‹ค์–‘ํ•œ ํ…œํ”Œ๋ฆฟ์„ ์ œ๊ณตํ•˜์—ฌ ๊ฐœ๋ฐœ ์ƒ์‚ฐ์„ฑ์„ ํ–ฅ์ƒ์‹œํ‚ต๋‹ˆ๋‹ค. ๋งˆ์ดํฌ๋กœ์„œ๋น„์Šค ์•„ํ‚คํ…์ฒ˜ ์ง€์›: jHipster๋Š” ๋งˆ์ดํฌ๋กœ์„œ๋น„์Šค ์•„ํ‚คํ…์ฒ˜๋ฅผ ์ง€์›ํ•˜์—ฌ ์„œ๋กœ ๋‹ค๋ฅธ ๋…๋ฆฝ๋œ ์„œ๋น„์Šค ๊ฐ„.. 2024. 2. 10.
ํ˜„๋Œ€ ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ์—์„œ ์ฃผ๋ชฉ๋ฐ›๋Š” ํ”„๋ ˆ์ž„์›Œํฌ ๋น„๊ต React ์†Œ๊ฐœ React๋Š” Facebook์—์„œ ๊ฐœ๋ฐœํ•œ ํ”„๋ก ํŠธ์—”๋“œ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋กœ, ์‚ฌ์šฉ์ž ์ธํ„ฐํŽ˜์ด์Šค๋ฅผ ๊ตฌ์ถ•ํ•˜๊ธฐ ์œ„ํ•œ ๊ฐ•๋ ฅํ•œ ๋„๊ตฌ์ž…๋‹ˆ๋‹ค. ์ปดํฌ๋„ŒํŠธ ๊ธฐ๋ฐ˜ ์•„ํ‚คํ…์ฒ˜์™€ ๊ฐ€์ƒ DOM์„ ๊ธฐ๋ฐ˜์œผ๋กœ ํ•˜์—ฌ ์„ฑ๋Šฅ ํ–ฅ์ƒ๊ณผ ์œ ์—ฐ์„ฑ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. ์ฃผ์š” ํŠน์ง• JSX ๋ฌธ๋ฒ• ์‚ฌ์šฉ: ์„ ์–ธ์ ์ด๊ณ  ๊ฐ€๋…์„ฑ ์žˆ๋Š” ์ฝ”๋“œ ์ž‘์„ฑ์„ ๊ฐ€๋Šฅํ•˜๊ฒŒ ํ•˜๋Š” JSX ๋ฌธ๋ฒ•์„ ๋„์ž…ํ•˜์—ฌ UI๋ฅผ ํšจ๊ณผ์ ์œผ๋กœ ํ‘œํ˜„ํ•ฉ๋‹ˆ๋‹ค. ์ปดํฌ๋„ŒํŠธ ๊ธฐ๋ฐ˜ ์•„ํ‚คํ…์ฒ˜: ์žฌ์‚ฌ์šฉ์„ฑ์ด ๋†’์€ ์ปดํฌ๋„ŒํŠธ๋ฅผ ์ค‘์‹ฌ์œผ๋กœ ํ•˜๋Š” ์•„ํ‚คํ…์ฒ˜๋ฅผ ์ œ๊ณตํ•˜์—ฌ ์œ ์ง€๋ณด์ˆ˜๊ฐ€ ์‰ฝ์Šต๋‹ˆ๋‹ค. ๊ฐ€์ƒ DOM ํ™œ์šฉ: ํšจ์œจ์ ์ธ ๋ Œ๋”๋ง์„ ์œ„ํ•ด ๊ฐ€์ƒ DOM์„ ์‚ฌ์šฉํ•˜๋ฉฐ, ๋ณ€๊ฒฝ๋œ ๋ถ€๋ถ„๋งŒ ์‹ค์ œ DOM์— ๋ฐ˜์˜ํ•˜์—ฌ ์„ฑ๋Šฅ์„ ์ตœ์ ํ™”ํ•ฉ๋‹ˆ๋‹ค. ์ƒํƒœ ๊ด€๋ฆฌ์™€ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ React๋Š” ์ƒํƒœ ๊ด€๋ฆฌ๋ฅผ ์œ„ํ•œ ๋‹ค์–‘ํ•œ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์™€ ํ•จ๊ป˜ ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค. ํŠนํžˆ Redux์™€์˜ ์กฐํ•ฉ์€ ๋Œ€๊ทœ.. 2024. 2. 7.