본문 바로가기

Back-End/Node.js

(103)
Express - 10. 미들웨어 만들기 목표 다른 이의 미들웨어를 사용하는 것이 아닌, 미들웨어 생산자가 되어 보자! 미들웨어 작성 Express 앱에서 사용하기 위한 미들웨어 작성 Express 앱에서 사용하기 위한 미들웨어 작성 개요 미들웨어 함수는 요청 오브젝트(req), 응답 오브젝트 (res), 그리고 애플리케이션의 요청-응답 주기 중 그 다음의 미들웨어 함수 대한 액세스 권한� expressjs.com var express = require('express'); var app = express(); var myLogger = function (req, res, next) { console.log('LOGGED'); next(); }; app.use(myLogger); app.get('/', function (req, res) { r..
Express - 9.2. 미들웨어의 사용 - compression 압축(Compression) 사용하는 이유 만약 create로 엄청 많은 데이터를 넣어보자. 개발자 도구 > Size 를 보니 데이터 크기는 49.6kB로 꽤 큰 데이터 양이다. 웹 사이트에는 많은 사람들이 접속을 하고, 그 사람들이 접속할 때마다 10MB씩 다운로드한다고 생각하면 돈과 시간, 부담이 많이 될 것이다. 이 문제는 압축을 통해 해결할 수 있다. 웹 브라우저에게 응답을 할 때 데이터를 압축하는 것이다. 예로 들어서 zip처럼 말이다. 응답을 압축하고, 이 응답이 zip방식으로 압축되었으니 zip방식으로 압축을 풀라고 알려주면 웹 브라우저가 이를 받아 압축 방식에 따라 해제하고 응답을 보게 된다. 그렇게 되면 압축된 데이터가 전송되기 때문에 데이터의 양이 획기적으로 줄어들 수 있다. 압축을 하..
Express - 9.1. 미들웨어의 사용 - body parser Express의 중요한 기능 두 가지 1. Route 2. Middleware 이전에도 말했듯이, Express에서는 처음부터 코드를 작성하지 않고 다른 이가 작성한 소프트웨어를 부품으로 하여 나의 소프트웨어를 만들어간다. 이를 미들웨어라고 한다. 미들웨어 사용 Express 공식 페이지> 미들웨어 사용 을 클릭해보자. Express 미들웨어 사용 미들웨어 사용 Express는 자체적인 최소한의 기능을 갖춘 라우팅 및 미들웨어 웹 프레임워크이며, Express 애플리케이션은 기본적으로 일련의 미들웨어 함수 호출입니다. 미들웨어 함수는 요청 오�� expressjs.com Third-party middleware : 다른 이들이 만든 미들웨어. 즉, express가 만들지 않은, 비공식적인 미들웨어 여러 ..
Express - 8. 페이지 삭제 구현 + redirect 목표 delete 기능을 Express을 이용해 semantic url 방식으로 작성하기 이전 코드 }else if(pathname === '/delete_process'){ var body = ''; request.on('data', function(data){ body = body + data; }); request.on('end', function(){ var post = qs.parse(body); // id만 받으면 된다 var id = post.id; var filteredId = path.parse(id).base; fs.unlink(`data/${filteredId}`, function(error){ response.writeHead(302, {Location: `/`}); response..
Express - 7. 페이지 수정 구현 목표 update페이지를 Express을 이용해 semantic url 방식으로 작성하기 이전 코드 // 5. update 버튼을 누른 페이지 }else if(pathname == '/update'){ fs.readdir('./data', function(err, filelist){ var filteredId = path.parse(queryData.id).base; fs.readFile(`data/${filteredId}`, 'utf8', function(err, description){ var title = queryData.id; var list = template.list(filelist); var html = template.html(title, list, //form 부분 ` ${descrip..
Express - 6. 페이지 생성 구현 목표 create페이지를 Express을 이용해 semantic url 방식으로 작성하기 이전 코드 // 3. create 버튼을 누른 페이지 }else if(pathname === '/create') { fs.readdir('./data', function(err, filelist){ var title = 'WEB - create'; var list = template.list(filelist); var html = template.html(title, list, '', ` `); response.writeHead(200); //200: 파일을 성공적으로 전송하였음 response.end(html); }); // 4. create button을 눌러 데이터를 제출한 페이지 }else if(pathnam..
Node.js - get & post 네트워크 전송 방식으로 get, post가 있다. app.get() : 데이터를 전달해주는 방식 app.post() : 데이터의 값을 변경하는 방식. url의 query string에서 개인 정보가 노출되지 않는다. Node.js (3) — get and post 이번 시간에는 get 과 post 를 알아보도록 하겠습니다. medium.com
Express - 5.2. 상세페이지 구현 2 목표 리스트 목록 페이지를 Express을 이용해 semantic url 방식으로 작성하기 request.params app.get('/page/:pageId', function(request, response){ console.log(request.params); } { pageId: 'CSS' } 따라서 request.params.pageId를 이용하여 클릭된 제목을 인지한다. 이전 코드 // 2. id값을 선택한 page } else { fs.readdir('./data', function(err, filelist){ var filteredId = path.parse(queryData.id).base; fs.readFile(`data/${filteredId}`, 'utf8', function(err..

반응형