Je개발 일지

[ Reference ] https://vuejs.org/guide/essentials/reactivity-fundamentals.html Reactivity Fundamentals | Vue.js vuejs.org 공식 문서에서는 예시 코드를 Options API, Composition API 둘 다 지원하고 있다. 나는 개인적으로 Composition API 를 더 선호하고 있기 때문에 Composition API 로 예시 코드를 가져오도록 하겠다. 1. Declaring Reactive State ** reactive( ) ** 함수를 사용하게 되면 반응성이 있는 객체나 배열을 만들 수 있다. import { reactive } from 'vue' const state = reactive({ cou..

[ Reference ] https://vuejs.org/guide/essentials/application.html Creating a Vue Application | Vue.js vuejs.org [ 2-1 ] Creating a Vue Application The application instance 모든 Vue 어플리케이션은 createApp 함수를 이용해서 application instance 를 만들어내야 한다. The Root Component createApp 함수로 넘기는 객체들은 사실상 컴포넌트들이다. 각 app 은 Root Component 를 필요로 한다. 그리고 이 Root Component 는 다른 컴포넌트들을 Children 으로 갖는다. (*첨언. 이 Root Componen..

[ Reference ] https://vuejs.org/guide/introduction.html Introduction | Vue.js vuejs.org [ 1-1 ] Introduction Vue 란 무엇인가? Vue 는 유저 인터페이스 기반의 자바스크립트 프레임 워크다. 컴포넌트 기반의 선언적 프로그래밍 모델이며 이런 특징은 유저 인터페이스를 효과적으로 개발할 수 있도록 도와준다. Vue 의 가장 큰 특징 두 가지는 다음과 같다 선언적 렌더링 Vue 는 template 문법을 이용해서 HTML 로 확장한다. 이 말은 자바스크립트를 이용해서 HTML 을 선언적으로 그려나갈 수 있다는 걸 의미한다. React 랑 비교를 하자면 React 의 경우에는 JSX 문법을 이용해서 HTML 을 만들어 나가고,..

Vue 가 이번에 공식적으로 3 버전을 정식 버전으로 선언하고 공식문서를 개편했다. 생각했던 것보다 많은 것이 바뀌었다. 프론트엔드를 공부할 때 React 로 처음 공부 시작한 입장에서는 이번 변화에서 반길만한 것들이 있지만, 회사에서 Vue 2 에서 Vue 3 로 옮기는 작업을 하고 있었는데, 이번 개편에서 또 변화된 것들이 있어서 기존에 리팩토링 한 내용들을 다시 리팩토링해야 하는 상황이 왔다. 이번 기회에 Vue 에 대한 공부를 확실하게 하기 위해 부족한 실력이지만, 공식문서를 영어로 읽고, 필요하다 싶은 것들은 한글로 번역해서 블로그에 작성하고자 한다.