Front-End (26) 썸네일형 리스트형 Vue 3 주요 Hook 정리표 (Composition API 기준) React 주요 Hook 정리표 React에서 자주 쓰는 Hook 들 (with Vue 비교) Vue 에서 vo, dto 원활한 컨트롤을 위한 개발방법 VO 별로 컨트롤을 위해 vo 구조대로 class 도 만들어보고 class TestVO { this.idx = 0; this.pidx = 0; this.name = "TEST"; } vat testVO = new this.TestVO() Object로만 만들어보고 var testVO = { idx : 0 pidx: 0, name: 'TEST' } function 으로도 만들어 봤더니 TestVO: function() { this.idx = 0 this.pidx = 0 this.name = "TEST" } var testVO = new this.TestVO() function이 제일 낫더라 vo 객체 모은 내용만 js로 따로 뺄까 고민중 서버 설정 예제 Apache RewriteEngine On RewriteBase / RewriteRule ^index\.html$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.html [L] #nginx location / { try_files $uri $uri/ /index.html; } #Native Node.js const http = require("http") const fs = require("fs") const httpPort = 80 http.createServer((req, res) => { fs.readFile("index.htm", "utf-8", (err, conten.. Vue 컴포넌트 간의 통신 Introduction Icon 1장과 3장에서 Vue의 특징중 컴포넌트 기반 프레임워크라는 내용과 인스턴스의 유효 범위에 대해서 설명하였습니다. 결국 인스턴스를 생성하여 컴포넌트로 사용하기 때문에 결국 컴포넌트가 유효 범위가 있다고 할 수 있습니다. 따라서 Vue의 컴포넌트는 유효 범위가 있기 때문에 서로 다른 컴포넌트 끼리 값을 직접적으로 참조할 수 없습니다. 그렇다면 서로 다른 컴포넌트 끼리 데이터 공유가 필요할 경우 어떻게 해야할까요? 이번장에서는 서로 다른 컴포넌트간의 통신에 대해서 설명하겠습니다. 1. 컴포넌트 간 통신과 유효 범위 2. 상위 하위 컴포넌트 관계 3. 상위에서 하위 컴포넌트로 데이터 전달하기 4. 하위에서 상위 컴포넌트로 이벤트 전달하기 5. 관계 없는 컴포넌트 간 통신 - 이.. Vue 의 화면 개발 단위 (인스턴스 & 컴포넌트) Introduction Icon Vue로 화면을 개발하기 위해 필수적으로 생성해야 하는 기본 단위는 인스턴스(Instance)입니다. 앞 2장에서 'Hello Vue.js!' 가 출력될 수 있었던 것은 인스턴스가 생성되었기 때문입니다. 그리고 1장에서 Vue의 특징 중 하나를 컴포넌트(Component)기반 이라고 설명하였습니다. 컴포넌트란 화면을 블록처럼 조합하여 화면을 구성할 수 있도록 하는 단위입니다. 이 글에서는 인스턴스와 컴포넌트에 대해서 설명하겠습니다. 1. 인스턴스 생성 2. 인스턴스의 유효 범위 3. 인스턴스 라이프 사이클 4. 컴포넌트 등록 Conclusions Prerequisite Icon 생성자 - https://ko.wikipedia.org/wiki/%EC%83%9D%EC%84%B.. Hello Vue & 개발환경 설정 Introduction Icon Vue.js 의 초기 개발환경은 그다지 어려운 설정이 없습니다. Angular 상위 버전(2 이상)에서는 Node.js 가 필수이지만 Vue.js는 일반 Javascript 라이브러리처럼 사용할 수 있고, Node.js로 프로젝트를 구성할 수도 있습니다. 간단한 개발 프로젝트에서는 텍스트 에디터와 대부분 사용하는 브라우저 Chrome에서 개발자 도구 설치만 하면 개발 할 수 있습니다. 1. Hello Vue.js! 2. Vue 개발자 도구 설치 및 사용방법 3. Vue 개발자 도구 사용 방법 Conclusions Prerequisite Icon Text Editor - Notepad, Atom, Sublime Text, VSCode 등... Browser - Chrome .. 이전 1 2 3 4 다음