Post

๐Ÿ“ ๊ฒฐ๊ตญ Svelte๋ฅผ ์‹œ์ž‘ํ•˜๊ฒŒ ๋˜์—ˆ์Šต๋‹ˆ๋‹ค

๐Ÿ“ ๊ฒฐ๊ตญ Svelte๋ฅผ ์‹œ์ž‘ํ•˜๊ฒŒ ๋˜์—ˆ์Šต๋‹ˆ๋‹ค

์•ˆ๋…•ํ•˜์„ธ์š”. ์‹ ์ž… ๊ฐœ๋ฐœ์ž์ž…๋‹ˆ๋‹ค. ์ตœ๊ทผ์— ํšŒ์‚ฌ์— ๋“ค์–ด๊ฐ”๋Š”๋ฐ, ๋ฉ”์ธ ๊ธฐ์ˆ  ์Šคํƒ์ด Svelte๋”๋ผ๊ณ ์š”. ์‚ฌ์‹ค ์ €๋Š” ์•„์ง React๋„ ์ œ๋Œ€๋กœ ๋งŒ์ ธ๋ณธ ์ ์ด ์—†์–ด์„œ ์ข€ ๊ฑฑ์ •ํ–ˆ์Šต๋‹ˆ๋‹ค. ๐Ÿ˜ฅ ๊ทธ๋ž˜๋„ ์–ด์ฉŒ๊ฒ ์–ด์š”! ์ด์™• ์ด๋ ‡๊ฒŒ ๋œ ๊ฑฐ, ํ•œ๋ฒˆ ์ œ๋Œ€๋กœ ๋ฐฐ์›Œ๋ณด์ž ๋งˆ์Œ๋จน์—ˆ์Šต๋‹ˆ๋‹ค. ๊ทธ๋ž˜์„œ Svelte๊ฐ€ ๋Œ€์ฒด ๋ญ”์ง€ ํ•œ๋ฒˆ ์ฐพ์•„๋ดค์Šต๋‹ˆ๋‹ค.

๐Ÿค” Svelte, ๋„Œ ๋ˆ„๊ตฌ๋‹ˆ?

Svelte๋Š” ์›น UI๋ฅผ ๋งŒ๋“œ๋Š” ํ”„๋ ˆ์ž„์›Œํฌ์ž…๋‹ˆ๋‹ค. ๊ทธ๋Ÿฐ๋ฐ React๋‚˜ Vue์™€๋Š” ์ž‘๋™ ๋ฐฉ์‹์ด ์กฐ๊ธˆ ๋‹ค๋ฅด๋‹ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค. React๋Š” ๋ธŒ๋ผ์šฐ์ €์—์„œ ์ฝ”๋“œ๊ฐ€ ์‹คํ–‰๋  ๋•Œ ์ž‘๋™ํ•˜๋Š” ๋Ÿฐํƒ€์ž„ ํ”„๋ ˆ์ž„์›Œํฌ์ธ ๋ฐ˜๋ฉด, Svelte๋Š” ์šฐ๋ฆฌ๊ฐ€ ์ฝ”๋“œ๋ฅผ ์งœ๊ณ  ๋‚˜์„œ ๋นŒ๋“œํ•˜๋Š” ์‹œ์ (์ปดํŒŒ์ผ ํƒ€์ž„)์— ์ฝ”๋“œ๋ฅผ ์ˆœ์ˆ˜ HTML, CSS, JavaScript๋กœ โ€˜๋ฏธ๋ฆฌโ€™ ๋ณ€ํ™˜ํ•ด ๋ฒ„๋ฆฝ๋‹ˆ๋‹ค. ์‰ฝ๊ฒŒ ๋งํ•ด, Svelte๋Š” ์ฝ”๋“œ๋ฅผ ๋˜‘๋˜‘ํ•˜๊ฒŒ ๋ฒˆ์—ญํ•ด์ฃผ๋Š” ์—ญํ• ์„ ํ•˜๋Š” ๊ฑฐ์ฃ . ๊ทธ๋ž˜์„œ ์•ฑ์ด ์—„์ฒญ ๊ฐ€๋ณ๊ณ  ๋น ๋ฅด๋‹ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค.


โœจ Svelte์˜ ๋งค๋ ฅ

Svelte์˜ ๊ฐ€์žฅ ํฐ ๋งค๋ ฅ์€ ์ง„์ •ํ•œ ๋ฐ˜์‘์„ฑ์ž…๋‹ˆ๋‹ค. React์—์„œ๋Š” ์ƒํƒœ๋ฅผ ๋ณ€๊ฒฝํ•˜๊ธฐ ์œ„ํ•ด useState ๊ฐ™์€ ํ›…(Hook)์„ ์จ์•ผ ํ•˜์ง€๋งŒ, Svelte๋Š” ๊ทธ๋ƒฅ ์ผ๋ฐ˜ ๋ณ€์ˆ˜์— ๊ฐ’์„ ์žฌํ• ๋‹นํ•˜๊ธฐ๋งŒ ํ•˜๋ฉด ํ™”๋ฉด์ด ์ž๋™์œผ๋กœ ์—…๋ฐ์ดํŠธ๋ฉ๋‹ˆ๋‹ค.

์•ž์œผ๋กœ Svelte๋ฅผ ๋ฐฐ์šฐ๋ฉด์„œ ๊ฒฝํ—˜ํ•œ ๊ฒƒ๋“ค์„ ์†”์งํ•˜๊ฒŒ ๊ธฐ๋กํ•ด ๋ณด๋ ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค. ์ €์ฒ˜๋Ÿผ ์ƒˆ๋กœ์šด ๊ธฐ์ˆ ์— ๋„์ „ํ•˜๋Š” ์‹ ์ž… ๊ฐœ๋ฐœ์ž๋ถ„๋“ค์ด ์žˆ๋‹ค๋ฉด ํ•จ๊ป˜ ์„ฑ์žฅํ•ด ๋‚˜๊ฐ”์œผ๋ฉด ์ข‹๊ฒ ์Šต๋‹ˆ๋‹ค!

This post is licensed under CC BY 4.0 by the author.