새로운 프로젝트 생성
1
2
3
4
5
6
// npm
npx nuxi@latest init <project-name>
// yarn
yarn dlx nuxi@latest init <project-name>
작년에 취업을 하면서 회사에서 React.JS와 Next.JS로 여러 프로젝트를 진행했었는데, 몇 개월 전부터 다른 프로젝트에 투입되면서 Vue.JS를 처음 접하게 되었습니다. 막상 시작하기 전에는 Vue를 별로 좋아하지 않았었는데 막상 Vue3를 써보니 생각보다 편하고 생산성에서는 리액트보다 빠르고 안정적인 느낌까지 받았습니다.
특히 v-if, v-for, ref, reactive 등 Vue의 기능들이 너무 편했으며 특히 v-for과 v-if는 진짜 편리했습니다.
v-for과 v-if 사용법을 React.JS와 비교해보면
React.JS
1
2
3
4
5
6
7
8
9
10
11
const Test = () => {
const arr = [1,2,3,4,5]
return (
<div>
{arr.map((num) => {
return <div>{num}</div>
})}
</div>
)
}
Vue.JS
1
2
3
4
5
6
7
8
9
10
11
<script setup>
const arr = ref([1,2,3,4,5])
</script>
<template>
<div>
<div v-for="num in arr">
{{num}}
</div>
</div>
</template>
여기서 놀랐던 점은 React.JS의 경우 빈 배열이면 에러가 발생하지만 Vue.JS는 그냥 렌더링을 안 한다는 점에서 안전성을 느끼면서 나름 만족하면서 사용하고 있습니다.
이것 이외에도 장점도 많이 있지만 단점도 존재하기에 아직까지는 저는 React.JS가 더 편하기는 하네요.