본문 바로가기

분류 전체보기89

node.js] url 모듈 사용하기 1. URL 구성요소 URL 모듈을 사용해보셨나요? URL 모듈을 사용하면 주소로된 문자열을 URL 객체로 만들거나 URL 객체를 일반 문자열로 변환해서 다양한 용도로 사용할 수 있습니다. 오늘은 node.js에서 URL 모듈을 간단하게 사용해보겠습니다. 먼저, 아래의 URL을 구성요소 별로 쪼개봅시다 http://nodestudy.com:9300/coding/nodejs/capter?page=5&line=23 (1) scheme 'http' : 프로토콜을 의미하며, 클라이언트와 서버가 통신할 때 정해놓은 통신규약입니다. (2) host & port 'nodestudy.com' : 네트워크에 연결된 서버에 부여되는 고유한 이름을 의미합니다. ':9300' : 하나의 host와 데이터통신을 하는 소켓들을 .. 2022. 4. 19.
Vue] Vuetify 설치, 적용하기 Vuetify란? Vuetify란 구글의 material design을 사용할 수 있게 만든 Vue.js를 위한 UI 프레임워크입니다. Vuetify는 사용자가 원하는 컴포넌트를 사용할 수 있도록 다양하고 유용한 라이브러리를 제공합니다. vuetify를 사용하고자한다면, vue-cli를 이용하여 vue 프로젝트를 생성한 직후 vuetify를 바로 설치하는 것이 좋습니다. 프로젝트 진행 중에 설치하면 잘못하다간 폴더 구조가 바뀔 수 있습니다. 저는 무튼 프로젝트 생성 직후는 아니지만 지금 설치 하였습니다. 설정은 권장되는 Default로 고고! vue add vuetify 설치가 완료되면 main.js에서 vue생성자에 vuetify가 추가된 걸 볼 수 있습니다. 그리고 화면은 아래처럼 바뀝니다 우리는 이.. 2022. 4. 8.
Vue] Router 생성·구현하기 1. 터미널에 아래의 명령어로 라우터 설치합니다. npm i vue-router@3.5.3 --save 버전 문제때문에 'npm install --save vue-router' 요거쓰면 에러가 뜨니 조심하세요... 1. 먼저 라우터로 연결할 페이지를 만들어줍니다. 저는 src 아래에 views 디렉토리를 만들고, 그 안에 Contact.vue, Product.vue, History.vue 페이지를 만들어 주었습니다. product 2. main.js에 router를 넣어줍니다. import Vue from 'vue' import App from './App.vue' import './assets/css/style.css' import { router } from './routes/index.js' Vue.. 2022. 4. 6.
Vue] Vue CLI 3.0 프로젝트 생성하기 먼저 Vue Project를 시작하기 위해선 간단한 준비물이 필요합니다. 1. Visual Sudio Code Visual Studio Code는 Microsoft에서 개발한 코드 에디터 어플리게이션입니다. 무료로 사용할 수 있는 소스 코드 편집기이죠. 다양한 프로그래밍 언어를 다양한환경에서 지원하는데 가볍기까지해서 인기가 많은 IDE입니다. Visual Studio Code가 아직 설치되어 있지 않다면 아래 링크에서 설치해주세요. https://code.visualstudio.com/download 2. Extention 설치 Visual Studio Code의 왼쪽 메뉴바에서 extention이모티콘을 클릭한 뒤, 원하는 플러인 명을 검색해주세요. 그리고 오른쪽에서 install을 클릭하면 끝! Ve.. 2022. 4. 5.

티스토리툴바