사랑과 유머에 중독된 개발자 사랑과 유머에 중독된 개발자

서버로 들어온 정보를 분석해 우리가 다룰 수 있는 형태로 만들어내보자. 1. form 요청 만들기 먼저 html에서 데이터를 전달할 때 가장 많이 사용하는 form 태그로 POST 요청을 만들어보자. 요청부분 app.use("/add-product", (req, res, next) => { res.send( 'Add Product' ); }); app.use("/product", (req, res, next) => { console.log(req.body); res.redirect("/"); // redirect(): express에서 추가된 경로 설정 함수 }); form은 POST 형태로 /product 미들웨어로 데이터를 전달한다. 익스프레스에서는 req.body를 통해 들어온 요청을 직접 확인할 ..

https://expressjs.com/ Express - Node.js web application framework Fast, unopinionated, minimalist web framework for Node.js $ npm install express --save expressjs.com 익스프레스 공식홈페이지에서 api 설명서를 보자 app.use() 항목을 보면 여기서 path를 지정해주는 것이 바로 라우터 지정이다. 브라우저에서 어떤 url로 요청을 하느냐에 따라 다른 미들웨어를 추가할 수 있다. const express = require("express"); const app = express(); app.use("/", (req, res, next) => { console.log("I..

https://github.com/expressjs/express GitHub - expressjs/express: Fast, unopinionated, minimalist web framework for node. Fast, unopinionated, minimalist web framework for node. - GitHub - expressjs/express: Fast, unopinionated, minimalist web framework for node. github.com 위 링크에 들어가면 익스프레스가 어떤 코드로 짜여져 있는지 확인할 수 있다. lib 폴더에 들어가보면 express 코드를 볼 수 있다. 먼저 response.js를 보면 서버의 응답을 보내기 위해 사용했던 send()가 ..

서버의 요청을 처리해 응답하는 과정에서 익스프레스는 미들웨어를 사용할 수 있다. 기존 코드 const http = require("http"); const express = require("express"); const app = express(); const server = http.createServer(app); server.listen(3000); 미들웨어 추가 const http = require("http"); const express = require("express"); const app = express(); app.use((req, res, next) => { // 새로운 미들웨어 추가 console.log("In the middleware!"); }); const server = ht..

1. Express.js가 뭐지? 노드로 서버를 구성하는 로직은 비교적 간단하지만, 그래도 복잡하다. 일련의 귀찮은 과정을 프레임워크에게 맡기고, 정말 중요한 핵심 비즈니스 로직들에게 집중할 수 있다. 그 프레임 워크 중 하나가 익스프레스로, 가장 유명하고 널리 사용된다. 2. Express.js 설치하기 설치를 원하는 폴더로 이동해 아래 코드를 실행한다. --save 옵션을 쓰는 이유는 프로덕션 의존성 툴이기 때문이다. 따라서 배포 후, 실행하게 될 모든 서버에도 설치되어야 한다. npm install --save express //app.js 파일 const http = require("http"); // 1. node 전용 모듈 const express = require("express"); // ..

디버그 모드에서 코드를 수정한 뒤 자동으로 앱이 재시작 되도록 설정할 수 있다. Nodemon을 활용한다. VS Code 메뉴바 상단에서 다음을 클릭 Run - Add Configuration - 디버그 환경 선택(여기서는 Node.js) '.vscode' 폴더와 'launch.json' 파일이 생성된다. 'Add Configuration' 버튼을 클릭해서 설정을 추가한다. 물론 직접 입력해도 된다. program : 디버거 실행시 기본으로 실행되는 앱을 설정. 서버 시작 등 최초 구동 코드가 들어있는 app.js로 설정 restart : 재시작 설정 runtimeExcutable : node가 기본값. nodemon을 통해 앱을 실행하는 것으로 변경 console : 터미널에서 디버그 콘솔을 확인할 수..

디버그 모드에서 앱이 실행되는 과정을 한줄 한줄 뜯어볼 수 있다. 변수에 어떤 값이 입력되고 어디로 이동하고 있는지 확인할 수 있어 의도한 대로 코드가 작동하고 있는지 확인하기 좋다. 1. 디버그 모드 진입 윈도우 f5 버튼 또는 왼쪽 메뉴바에서 진입하여 Run and Debug 클릭 두가지 방법 중 하나로 디버거 선택 창에 진입한다. 우리는 현재 노드 환경에서 코딩 중이므로 Node.js 디버거를 선택한다. 화면 하단에 디버그 콘솔창이 뜬다. 2. 중단점Breakpoint 설정 앱을 실행하면 중단점이 설정된 곳에서 코드 실행이 멈춘다. 그 지점에서 필요한 정보를 확인하면 된다. 논리 오류가 발생하는 것으로 추측되는 지점에 주로 설정한다. 중단점을 설정하고자 하는 행의 왼쪽에 마우스 커서를 가져가면 빨간..

1. 오류의 유형 구문 오류 Syntax Errors : 오타나 괄호 등 요소를 빼먹은 경우 런타임 오류Runtime Errors : 구문 오류는 발생하지 않으나 서버 실행 시 오류가 발생 논리 오류Logical Errors : 알고리즘 등 논리 구조에서 발생 2. 구문 오류 찾기 및 수정 잘 찾아서 수정하면 된다. VS Code 등 IDE가 수정안을 제대로 제시는 못해도 어디가 이상하다고 잘 찾아주긴 한다. 3. 런타임 오류 찾기 및 수정 const fs = require("fs"); const requestHandler = (req, res) => { const url = req.url; const method = req.method; if (url === "/") { res.write(""); re..