나만의 컴퓨터 공학

컴포넌트에 속성과 이벤트를 뷰에 정의할 수 있는데, 사용자 정의 속성 및 사용자 정의 이벤트를 만들어서 적용할 수 있다. 속성사용자 정의 속성 : 전역 등록하거나 지역 등록한 컴포넌트를 사용할 때 컴포넌트와 함께 속성을 정의. App.vue 코드script>import UserProfile from './components/UserProfile.vue'; export default{ components : { UserProfile, }, data(){ return{ name : 'LJH', company : 'ljh99', age : 26, }; }, }script>template> UserProfile :name="name" :company="company" :age="age"/>template>st..

라이프 사이클 훅(Life Cycle Hook)Vue.js 프레임 워크에서 컴포넌트는 생성되고 파괴될때까지 여러 단계(생명주기)를 거치면서 특정 기능과 역할을 하는 함수를 호출할 수 있도록 설계되어 있다.그러한 함수를 훅 이라고 한다.컴포넌트에서 호출되는 함수를 라이프 사이클 훅이라고 한다.라이프 사이클 훅 예제 코드script> export default{ beforeCreate(){ console.log('beforeCreate'); }, created(){ console.log('created'); }, beforeMount(){ console.log('beforeMount'); }, mounted(){ console.log('mounted'); }, beforeUpdate(){ console.lo..

Vue 애플리케이션의 실행 과정에서 package.json, index.html, main.js, App.vue는 각기 다른 역할을 맡으면서 유기적으로 연결되어 애플리케이션을 구동합니다. 그에 대해 앞선 글에서 뷰 애플리케이션의 기본 구조를 설명했습니다.그렇다면 이것들이 어떻게 동작하는지 실행 흐름에 맞춰 설명해 보겠습니다. 1. package.json과 개발 서버 실행역할 : package.json은 Vue 애플리케이션의 메타 정보와 스크립트를 정의한 파일입니다.연관 : npm run dev 명령어를 실행하면 package.json 파일의 scripts에 정의된 serve 명령어(vue-cli-service serve)가 호출됩니다. 이 명령어는 개발 서버를 구동하고, 소스 파일을 감시하며 변경 사항을..

Vue.js 애플리케이션의 기본 구조는 package.json, index.html, main.js, App.vue 파일들로 구성되어 있으며, 이 파일들은 서로 유기적으로 연관되어 애플리케이션을 구동하는 중요한 역할을 합니다. 각 파일을 자세하게 설명하고, 이들이 어떻게 연결되어 있는지 설명하겠습니다. package.json뷰 애플리케이션에서 가장 중심이 되는 파일은 package.json입니다.package.json 파일은 뷰 애플리케이션에서 사용하는 기본 정보, 의존성 모듈 정보, 스크립트 명령어 정보 등을 담고 있습니다.{"name": "vue-project","version": "0.0.0", "private": true, "type": "module", "scripts": { "dev": "vi..