본문 바로가기
타입스크립트로 함께하는 웹 풀 사이클 개발(React, Node.js)/TIL

웹풀사이클 14일차 - map (object), express

by 슈크림 붕어빵 2023. 12. 11.

map (object)

string을 저장하는 것과 다를 것 없이 object를 map에 넣어준다.

 

다음은 map에 object를 저장한 뒤, url로 받은 id를 이용해서 json을 보내주는 코드이다. 

 

받아온 object에 id를 추가하는 코드는 다음과 같다. 

let youtuber = db.get(id);

let product = youtuber;

product.id = id; or  product["id"] = id

 

const express = require('express')
const app = express()

//map - object
app.get('/youtuber/:id', function (req, res) {
  let {id} = req.params;
  id=parseInt(id);
  let youtuber = db.get(id);
  if( youtuber== undefined){
    res.json({
      msg: "no data"
    });
  }
  else{
    let product = youtuber;
    // product.id = id;
    product["id"] = id 
    res.json(product);
  }
});

app.listen(3000)

let db = new Map();

let youtuber1 = {
    channelName: "성은 채널",
    sub: "100만명",
    videioNum: "2개"
  };
  let youtuber2 = {
    channelName: "침착맨",
    sub: "300만명",
    videioNum: "500개"
  };
  

db.set(1,youtuber1);
db.set(2,youtuber2);

console.log(db);

 

 

express 

 

node.js로 http모듈을 이용하여, 서버를 만들고 route를 하는 등 하나하나 구현한다면 할 일이 많고 사람마다 다 체계가 달라질 수 있다. 이 때 , 웹 프레임워크인 express를 이용하면 편리하다.

 

express-generator

Express 환경을 간단하게 구축해주는 npm이다.

이미 폴더가 만들어져서 그 안에서 설치하는 경우이다.

 

1. 설치

알아서 체계를 만들어주고 필요한 패키지를 설치할 수 있도록 만들어주는 express-generator 

npm install express-generator -g

 

2. 새 프로젝트 생성

express

 

3. npm i

package.json에 있는 필요한 npm 파일을 설치해준다.

npm i

 

에러

https://bsu0404.tistory.com/72

 

이 시스템에서 스크립트를 실행할 수 없으므로 C:\Users\사용자명\AppData\Roaming\npm\expre ss.ps1 파일을

에러 원인 권한이 없기 때문에 실행할 수 없다는 에러이다. 해결 방법 1 get excutionpolicy =>Restricted 2 Set-ExecutionPolicy =>RemoteSigned 3 Get-ExecutionPolicy =>RemoteSigned 이후 원래 사용하려던 명령어를 입력하면

bsu0404.tistory.com

 

express의 구조

간단히 몇가지 파일을 살펴보겠다.

 

bin-> www.js

var app = require('../app');
var debug = require('debug')('express-base:server');
var http = require('http');

//...

var server = http.createServer(app);

//...

위와 같은 부분이 있다. http를 이용하면 직접 서버를 만드는데 express generator를 이용하면 해당 부분에서 서버를 만들어주며, 서버를 실행하는 스크립트이다. 또한, port넘버도 설정한다.

 

routes->index.js

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

module.exports = router;

 

라우터들을 관리하는 경로와 관련된 js파일이다. 서버의 로직은 route 폴더 안의 파일에서 작성한다. 단, index.js를 기반으로!

 

app.js

핵심적인 서버의 역할을 하며, 미들웨어를 관리한다.

app.set으로 app을 설정, app.use로 미들웨어를 연결한다.

var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');

var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');

var app = express(); //express

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

app.use(logger('dev')); //use는 미들웨어(http를 제외한 모듈을 일컫는 말) 연결
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', indexRouter);
app.use('/users', usersRouter);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

js함수 4가지 종류

function add1(x,y){
    return x+y;
}

let add2 = function(x,y)
    return x+y;
}

const add3 = (x,y) =>{ //화살표함수(arrow function)
    return x+y;
}

var add4 = (x,y) => x+y;