리액트 학습 노트 (중급) 6일차 정리

express란?

노드로 구축한 서버에 라우팅을 쪼갤 수 있게 지원하는 프레임워크

express 지원 메서드

methodaction
get가져오기
post생성하기
put전체 수정하기
delete제거하기
patch부분 수정하기
options찔러 보기 (서버가 응답이 가능한 상태인지 확인, 핸드쉐이킹 기법)
head헤더만 가져오기

약속은 이렇지만 실무에서는 post를 많이 쓴다.

예를 들어

게시물을 가져오고 조회수를 1 올려주기

이런 케이스는

게시물을 가져오는 method는 get인데

조회수를 높여주는 method는 patch라 애매하니까

post로 합의를 한다.

express 라우터 쪼개기

loginRouter.js

postRouter.js

app.js

이런 식으로 파일별로 라우터를 쪼개고
app.js에서 통합한다.

시퀄라이즈

javascript의 간단한 코드를 mysql 쿼리로 컴파일하거나
관계형 디비를 간단하게 설계해주는 ORM.

시퀄라이즈 테이블 설계 지원 메서드

1. belongsTo
1 대 N 관계일 때 N에 해당하는 테이블에 설정.
부모 테이블의 pk 컬럼을 자동으로 생성해준다.

2. hasMany
1 대 N 관계일 때 1에 해당하는 테이블에 설정.

2. belongsToMany
N 대 N 관계일 때 해당 테이블 둘에게 모두 설정.
자동으로 중간의 매핑 테이블을 만들어준다.
두 번째 인자로 { through: 'tablename' } 객체를 넣어서
테이블 명을 설정해줘야 한다.

npx sequelize db:create

디비 설계를 마쳤다면 이 명령어를 npm에 입력했을 때
데이터 베이스를 생성해준다.

nodemon

리액트의 핫리로딩처럼 수정사항을 바로 반영해주고 디버깅도 지원하는 모듈

express의 미들웨어

express.use();로 등록한 모듈은 다 미들웨어다.

1. cors
브라우저의 도메인과 서버의 도메인이 다르면
브라우저가 서버에게 api요청시 cors 에러가 나는데
이를 서버쪽에서 허락을 하면 에러를 없앨 수 있다.
이를 쉽게 설정할 수 있도록 도와주는 모듈이다.

  const express = require('express');
  const cors = require('cors');
  const app = express();
  app.use(cors({
      origin: true,
  }));

{ origin: true } 옵션을 주면 자동으로 요청한 도메인을 허락한다.

2. 쿠키와 세션
쿠키와 세션의 컨트롤을 쉽게 도와주는 모듈

const express = require('express');
const session = require('express-session');
const cookieParser = require('cookie-parser');
const app = express();
app.use(cookieParser(process.env.COOKIE_SECRET));
app.use(session({
    saveUninitialized: false,
    resave: false,
    secret: process.env.COOKIE_SECRET,
}));

3. json
app.use(express.json())
프론트에서 json으로 데이터를 보냈을 때 req.body에 넣어준다.

  1. urlencoded
    app.use(express.urlencoded({ extended: true }));
    프론트에서 formsubmit등등 urlencoded로 데이터를 보냈을 때 req.body에 넣어준다.

좋은 웹페이지 즐겨찾기