월드스토리의 코딩 나라

body-parser 데이터를 쉽게 처리할 수 있도록 도와주는 라이브러리Post로 정보를 전송할 때 요청의 body(req.body)로 받을 수 있게 도와 줌설정하지 않으면 undefined로 데이터 값을 읽을 수 없음.express 4.x 부터 body-parser가 내장되어 있어 설치 필요 없음extended: true => express에 기본 내장된 querystring 모듈 사용하지만, 멀티파트 데이터인 이미지, 동영상, 파일을 다른 방식으로 처리해야 한다. multerconst multer = require('multer'); // multer 모듈을 불러옴(npm install multer 먼저 실행)const upload = multer({dest: 'upload/',});app.post(..

Axios 요청 방법axios({url : '통신하고자 하는 함수',method: '통신하고자 하는 방식',data: {json 형태의 보내고자 하는 데이터 }}); url서버 주소를 의미함즉, 내가 데이터를 보내고자 하는 서버단 주소method데이터를 보내는 요청 방식으로 get, post, patch, put, delete가 있음data/params{ key: value, key: value } 형태로 데이터를 보낼 때 사용Request의 body로 데이터를 보냄단, Get에선 paramsGet엣넌 url에 ?를 이용해서 해당 데이터를 붙여서 보내도 동작함  Axios 문법 –응답 response.data서버가 제공한 응답(데이터)response.status서버 응답의 HTTP 상태 코드 성공이면 2..

JSON이란?• JavaScript Object Notation의 약자• 데이터를 문자열의 형태로 나타내기 위해서 사용• 네트워크를 통해 다른 시스템들이 소통할 때 사용하는 경량의 DATA 교환 형식• 자바스크립트에서 파생되었으나 현재는 다른 프로그래밍 언어에서도 지원하는 데이터 포맷• 가독성이 뛰어나 컴퓨터와 사람 모두 해석하기 편함• JavaScript의 Object를 기반으로 하는 텍스트 형식• JavaScript 객체와 유사하며, key 이름을 큰 따옴표("key-name")로 감싸는 차이점이 있음 JSON 내장 객체JavaScript에서는 JSON 데이터를 간편하게 다룰 수 있는 JSON 내장 객체 존재 JavaScript Object와 JSON 문자열을 서로 변환할 수 있도록 메서드 제공  대..

1. Ajax Asynchronous JavaScript And XML자바스크립트를 이용해 클라이언트와 서버 간에 데이터를 주고 받는 비동기 HTTP 통신JQuery를 이용해 쉽게 구현이 가능하며, Error, Success, Complete의 상태를 통해 실행 흐름을 조절함Jquery를 사용해야만!! 간편하고 호환성이 보장된다. ( xml 사용은 복잡 )Promise 기반이 아니다. 2. AxiosNode.js와 브라우저를 위한 Promise API를 활용비동기 HTTP 통신이 가능, return이 Promise 객체로 온다.Promise 기반으로 만들어졌으며, 브라우저 호환성이 뛰어나다.하지만 모듈 설치 or 호출을 해줘야 사용이 가능하다. 3. Fetch• JavaScript 내장 라이브러리이므로 ..

템플릿 엔진• 문법과 설정에 따라 파일을 html 형식으로 변환시키는 모듈 ejs란?• Embedded Javascript 의 약자로, 자바스크립트가 내장되어 있는 html 파일확장자는 .ejs ejs 템플릿을 사용하는 방법  대표적인 EJS 문법 무조건 자바스크립트 코드가 들어가야 하고, 줄바꿈을 할 경우에는 새로운 를 이용해야 한다.넘겨 받은 변수 값을 템플릿에 출력할 때 사용다른 view 파일(즉, 다른 ejs) 미들웨어요청이 들어옴에 따라 응답까지의 중간 과정을 함수로 분리한 것서버와 클라이언트를 이어주는 중간 작업use() 를 이용해 등록할 수 있다 미들웨어 -static이미지, css 파일 및 Javascript 파일(front)과 같은 정적 파일 제공Express 에 있는 static 메소..

http 모듈웹 서버를 구동하기 위한 node.js 내장 웹 모듈server 객체, request 객체, response 객체를 사용한다server : 웹 서버를 생성할 때 사용하는 객체request : 응답 메세지를 작성할 떄 첫번째 매개 변수로 전달되며, 프론트엔드로 부터 정보를 받아드림response : 응답 메세지를 작성할 때 두번째 매개 변수로 전달되며, 백엔드에서 프론트엔드로 정보를 보냄 http 모듈 서버 만들기const http = require('http');const server = http.createServer( function(req, res) { res.writeHead(200); //응답헤더 res.write("Hello!"); //응답 본문 작성 res.end("E..

모듈이란?1. 특정한 기능을 하는 함수나 변수들의 집합2. 재사용 가능한 코드 조각을 말함3. node js에선 여러개의 모듈이 하나의 큰 프로젝트를 이룸 모듈의 장점코드 추상화복잡한 시스템이나 객체를 단순화하여 핵심적인 부분에 집중하는 프로그래밍 원칙코드 캡슐화코드의 무분별한 변경을 막기 위해 모듈 내부에 코드를 숨김코드의 재사용같은 기능으로 동작하는 버튼일 경우, 동일한 코드를 여러개 쓸 필요 없이 호출해서 쓸 수 있다.의존성 관리프로젝트 간 의존성 충돌이 발생했을 때, 빠르게 원인을 찾아 수정할 수 있다. 모듈을 호출하는 방법   const { } 로 가져올 때는 구조분해해 가져오기에 이름이 동일해야 한다.하나만 내보낸 모듈은 다른 이름이어도 불러올 수 있다.  ※ 이미지 출저 : KDT 국비교육 ..

Node.js 특징특징설명JavaScript 언어 사용javascript 라는 언어는 원래 웹 브라우저 환경에서만 동작했음즉, 프론트엔드를 만들기 위해 만들어진 언어하지만 Node js의 등장으로 백엔드 서버를 만드는데, 이용할 수 있게 되었음Single Thread Node.js는 사용자가 직접 제어할 수 있는 스레드는 하나이다. 즉 하나의 파일 CPU가 점유하고 있으면 다른 파일을 실행하려면 대기해야 함.에러를 처리하지 못하면 멈춰버림비교적 프로그래밍 난이도가 쉽게, CPU, 메모리 자원을 적게 사용하는 장점을 지님.Non-blocking I/ONode js에서의 모든 명령어는 동시에 일어나지 않으며, 요청을 내리면 응답을 기다리지 않고, 다른 활동을 수행함.단, 비동기 처리를 해준다면 기다림 Eve..

Node.js구글 크롬의 자바스크립트 엔진( V8 Engine ) 에 기반해 만들어진 JavaScript 런타임이벤트 기반, 비동기 I/O 모델을 사용해 가볍고 효율적가장 기본적으로 사용하는 npm 패키지는 세계에서 가장 큰 오픈 소스 라이브러리  런타임이란?프로그래밍 언어가 동작하는 환경을 통칭하는 단어웹 브라우저에서가 아니라 서버단에서 javascript를 사용하기 위하여 개발된 언어가 node js  Node js를 다운로드 하는 방법 Node.js — Node.js® 다운로드 Node.js — Node.js® 다운로드Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.nodejs.org Node.js 설치 - 버전확인  ..

setTimeOut(함수, 지연시간) 설정한 delay 시간이 지난 뒤, 함수를 실행함 비동기 처리란?☆특정 코드의 연산이 끝날 때까지 코드의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 자바스크립트의 특성☆서버로 데이터를 요청 시 서버가 언제 응답을 줄 지 모르는데 마냥 다른 코드를 실행 안하고 기다릴 수는 없음☆ 비동기 처리가 아니고 동기처리라면 코드 실행하고 기다리고, 실행하고 기다리고하면 수십분이 소요될 수 있음  비동기로만 처리 시 나타날 수 있는 문제점function goMart() { console.log("마트에 가서 어떤 음료를 살지 고민한다."); } function pickDrink() { setTimeout(function () { console.log("고민 끝"); ..