์‹ฑ๊ธ€ ํŒŒ์ผ ์ปดํฌ๋„ŒํŠธ

์‹ฑ๊ธ€ ํŒŒ์ผ ์ปดํฌ๋„ŒํŠธ๋Š” ํ™”๋ฉด์˜ ํŠน์ • ์˜์—ญ์— ๋Œ€ํ•œ HTML, CSS, JS ์ฝ”๋“œ๋ฅผ ํ•œ ํŒŒ์ผ์—์„œ ๊ด€๋ฆฌํ•˜๋Š” ๋ฐฉ๋ฒ•์ž…๋‹ˆ๋‹ค. ๋ทฐ CLI๋กœ ํ”„๋กœ์ ํŠธ๋ฅผ ์ƒ์„ฑํ•˜๊ณ  ๋‚˜๋ฉด App.vue๋ผ๋Š” ํŒŒ์ผ์„ ํ™•์ธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด์ฒ˜๋Ÿผ vue ํ™•์žฅ์ž๋ฅผ ๊ฐ€์ง„ ํŒŒ์ผ์„ ๋ชจ๋‘ ์‹ฑ๊ธ€ ํŒŒ์ผ ์ปดํฌ๋„ŒํŠธ๋ผ๊ณ  ํ•ฉ๋‹ˆ๋‹ค.

์ฝ”๋“œ๋ฅผ ์‚ดํŽด๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค.

<!-- .vue ํŒŒ์ผ ๊ตฌ์กฐ -->
<template>
  <!-- html (๋ทฐ ์ปดํฌ๋„ŒํŠธ์˜ ํ‘œํ˜„๋‹จ, ํ…œํ”Œ๋ฆฟ ๋ฌธ๋ฒ•) -->
</template>

<script>
  // ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ (๋ทฐ ์ปดํฌ๋„ŒํŠธ ๋‚ด์šฉ)
</script>

<style>
  /* CSS (๋ทฐ ํ…œํ”Œ๋ฆฟ์˜ ์Šคํƒ€์ผ๋ง) */
</style>

์‹ฑ๊ธ€ ํŒŒ์ผ ์ปดํฌ๋„ŒํŠธ์˜ ๋™์ž‘ ์›๋ฆฌ

์‹ฑ๊ธ€ ํŒŒ์ผ ์ปดํฌ๋„ŒํŠธ๋Š” ๋ทฐ ๋กœ๋”์— ์˜ํ•ด HTML, CSS, JS์™€ ๊ฐ™์€ ์›น ์ž์›์œผ๋กœ ๋ถ„๋ฆฌ๋˜์–ด ์‹คํ–‰๋ฉ๋‹ˆ๋‹ค. ๋ทฐ ๋กœ๋”๋Š” ์›นํŒฉ์˜ ๋กœ๋” ์ข…๋ฅ˜ ์ค‘ ํ•˜๋‚˜์ด๊ณ  ๋ทฐ CLI๋กœ ํ”„๋กœ์ ํŠธ๋ฅผ ์ƒ์„ฑํ•˜๋ฉด ๊ธฐ๋ณธ์ ์œผ๋กœ ์„ค์ •์ด ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค.