IT (32) 썸네일형 리스트형 nodemon (소스 수정 시 서버 재시작 없이 반영) nodejs 진행하면 소스 수정 시 서버 재시작을 해야한다. 개발 진행 시 수정할 때 마다 재시작을 하면 여간 불편한게 아니다. 그 대안으로 nodemon(소스 수정 시 재시작 없이 반영) 모듈이 있다. 모듈을 설치해보자 npm i --save-dev nodemon 설치 완료!! nodejs 서버를 설치한 nodemon으로 실행 nodemon ./bin/www 실행되면 소스 수정 없이 바로 반영된다. 실행 명령어를 패키지 스크립트에 등록하자 경로 : package.json (scripts: dev) 추가 { "name": "back", "version": "0.0.0", "private": true, "scripts": { "start": "node ./bin/www" ,"dev": "nodemon ./.. vuejs 게시판 만들기 #4 (router 사용하기) npm으로 vue-router 모듈을 설치 npm i --save vue-router 게시판 리스트 컴포턴트 생성 src/components/board/List.vue 게시판 리스트 src/routes 폴더 생성 후 index.js 파일 생성 import Vue from 'vue'; import Router from 'vue-router'; import HelloWorld from '@/components/HelloWorld'; //메인 컴포넌트 호출 import List from '@/components/board/List'; //게시판 리스트 컴포넌트 호출 Vue.use(Router); //vue 라우터 사용 export default new Router({ //라우터 연결 routes:[ { pat.. vuejs 게시판 만들기 #3 (레이아웃 만들기) 홈페이지 기본 레이아웃을 만들어보자 1. 헤더 컴포넌트를 만들기 경로 : src/components/common/Header.vue 메뉴1 메뉴2 메뉴3 메뉴4 2. 콘텐츠 영역은 프로젝트 생성 시 존재하는 HelloWorld.vue 파일 사용 경로 : src/components//HelloWorld.vue 3. 풋터 컴포넌트를 만들기 경로 : src/components/common/Footer.vue copyRight fyzh99.tistory.com 4. App.vue 파일수정 경로 : src/App.vue 웹 브라우져에서 화면을 실행시켜 확인해 보장 node js 설치방법 https://nodejs.org/en/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 최신버전으로 설치 설치가 완료되면 express node js 웹 프레임워크 설치해서 구현 npm install express-generator -g npm(자바스크립트 프로그래밍 언어를 위한 패키지 관리자) npm 이용해서 express을 설치한다. express 기반 node js 프로젝트 생성 express [프로젝트 명] 실행화면 폴더 구조 생성된 nodejs [back] 프로젝트 (front 폴더는 vuejs 프로젝트 폴더) back 폴더로 이동 후 express 의존된 모듈을 설치 (pack.. vuejs 게시판 만들기 #2 (구조 및 문법) 디렉토리 구조 1) if문 if문 조건이 맞으면 노출합니다. if문 조건이 맞으면 노출합니다. else if문 조건이 맞으면 노출합니다. 일치하는 조건이 없으면 노출합니다. 2) for문 {{n}} {{n}} vuejs 게시판 만들기 #1 (프로젝트 생성) #1 vuejs 프로젝트 생성을 진행할려고 한다. 먼저 npm 설치가 필요하다. https://nodejs.org/en/download/ 이동해서 nodejs 환경에 맞는 설치 프로그램을 설치하자. nodejs와 npm이 같이 설치된다. 설치 완료 후 확인(npm 버전확인) npm -v vue-cli3 설치 npm i -g @vue/cli vue --version vue 프로젝트 생성 vue create [프로젝트명] 생성된 프로젝트 실행해 보자!! [프로젝트명] 경로로 이동 후 vuejs 실행~~ npm run serve http://localhost:8080/ 으로 오류없이 실행 되었다 :) 웹화면에서 실행된 vuejs를 확인 고고!! mysql 계정 추가 신규계정을 발급하는 경우 1. mysql 로그인 후 데이터베이스 mysql 사용 2. 사용자 추가 명령어 - CREATE user '[아이디]'@'[아이피]' IDENTIFIED BY '[비밀번호]'; 무료 이미지 사이트 무료 이미지 사이트 1. https://unsplash.com/ Beautiful Free Images & Pictures | Unsplash Beautiful, free images and photos that you can download and use for any project. Better than any royalty free or stock photos. unsplash.com 2. https://pixabay.com/ 아래 블로그 참고 https://tagilog.tistory.com/192 이전 1 2 3 4 다음