이번에는 프론트엔드 개발자가 꼭 알아야 할 정보를 의미하는 태그들에 대해 알아보자. title 태그는 웹브라우저의 tab부분에 출력할 값을 설정할 때 사용된다. 주로 회사명, 서비스명, 슬로건 등을 조합해서 사용한다. 주로 css 파일(문서)을 가져와서 사용할 때 쓰인다. 하지만 css 파일이 아닌 다른 파일을 가져올 경우도 있다. 웹브라우저는 파일의 확장자까지 체크하지 않기 때문에, 가져오려는 파일이 html 파일과 어떤 관계를 가지는지 명시해줘야 한다. 이 때 사용되는 html 속성이 'rel'이다. rel은 'Relationship'단어의 약어이며 가져올 외부문서가 현재의 HTML과 어떤 관계인지를 명시하는 HTML속성(Attribute)이다. rel에 명시된 값을 이용하여 웹브라우저는 해당 파일이..

[클립명] 1. Moment.js 2. DB수정 3. DB삭제 DB 수정 (update) sequelize에서의 DB update는 아래와 같이 처리한다. ( models.테이블명.update ) update 함수의 매개변수로 2개가 전달된다. - 첫번째 : update할 칼럼명과 값 - 두번째: where절 조건 exports.post_products_edit = (req, res) => { //update models.Products.update( //update할 칼럼 정보 { name:req.body.name, price:req.body.price, description:req.body.description }, //where절 { where : { id : req.params.id} }).the..

[클립명] 1. DB조회 2. 상세페이지 작성 3. ES6 DB조회 저번 시간까지는 sequelize를 이용하여 데이터베이스에 데이터를 insert 하는 것까지 알아보았다. 이번에는 입력한 데이터를 조회하는 방법에 대해 알아보자. 일단 seuelize에서는 DB를 조회하는 함수 중에서 데이터를 모두 조회하는 findAll을 연습해보자. root/controllers/admin/index.js (/admin~~ url로 들어오는 요청에 대한 route 설정) const { Router } = require('express'); const router = Router(); const ctrl = require('./admin.ctrl'); //입력한 데이터를 조회 (ex)http://localhost:300..

프론트엔드 개발자라면 반드시 알아야 하는 웹애플리케이션의 화면을 만들 수 있는 HTML 파일에 대해 알아보자. 우선 기본적인 index.html 파일을 만들어보자. 내가 사용하고 있는 텍스트에디터인 VS Code에서 index.html 파일을 생성한 후, ! 를 타이핑한 후 자동완성시키면 아래와 같은 코드가 자동으로 작성된다. VS Code ? 마이크로소프트사에서 개발한 텍스트에디터 프로그램인 'Visual Studio Code' 의 약자이다. 일단 프로그램 차제가 가볍고, 수많은 라이브러리를 지원하고 있어서 현재 프론트엔드 개발자 및 백엔드 개발자를 막론하고 핫한 프로그램 중 하나이다. 한글 언어팩을 설치하면 각종 메뉴도 한글로 나오기 때문에 편하다. HTML(HyperText Markup Langua..

[클립명] 1. DB접속 2. 모델 작성 3. DB입력 DB접속 우선 DB에 접속하기 위해서 DBMS인 MySql을 설치한다. (구글링해서 각자 설치) 그리고 node.js 프로젝트에 DB접속을 하기 위한 패키지 2개를 설치한다. 1. DB접속을 위한 패키지 설치 //mysql 접속용 패키지 $ npm install mysql2 //node.js ORM 라이브러리 패키지 $ npm install sequelize@4.42.0 2. DB접속 소스 코딩 /** ~~/models/index.js */ var Sequelize = require('sequelize'); var path = require('path'); var fs = require('fs'); var dotenv = require('dotenv..

[클립명] 1. Sequelize란 2. dotenv 설정 3. Database 생성 dotenv 설정 프로젝트를 진행하다보면 데이터베이스 접속정보, 소셜로그인용 계정정보, 외부 API키값 등 모든 소스에서 공통으로 사용해야 하는 각종 설정값들이 있다. 이런 환경변수 값들을 파일로 저장하여 사용할 수 있게 해주는 것이 dotenv 패키지이다. ✔중요 정보가 들어 있으므로, 보안을 위해서 git/svn 같은 곳에 버전관리 대상 파일에서 제외 (ignore 처리 필요) 1. dotenv 설치 npm install 명령어를 이용하여 패키지를 설치한다. //dotenv 패키지 설치 $ npm install dotenv 2. .env 파일 생성 dotenv 패키지는 기본적으로 현재 경로의 .env 파일에서 환경변..