1. express 서버 사용해보기

1) express 소개

• http 모듈로 웹 서버를 만들면 코드 가독성도 떨어지고 확장성도 떨어짐 -> 프레임워크로 해결
• 대표적인 프레임워크가 Express(익스프레스), Koa(코아), Hapi(하피)

2) package.json 만들기

• 직접 만들거나 npm init 명령어로 생성
• nodemon이 소스 코드 변경 시 서버를 재시작해줌

• npm init -> package.json 파일 생성됨
• npm i -D nodemon -> devDependencies 생성
• npm i express -> dependencies 생성

2. express로 html 서빙하기

3. 미들웨어 사용하기

• app.use에 모든 라우터에서 공통으로 사용될 부분이 들어가게 됨
• 미들웨어는 매개변수로 next를 해줘야 다음으로 넘어간다
• 엑스프레스 와일드 카드 라우팅

4. 미들웨어 특성 이해하기

app.use((req, res, next) => {
  console.log('모든 요청에 실행');
})

• 여기서 app.use 뒷부분이 다 미들웨어임. 미들웨어를 use라는 부분에 장착한 것
• 라우터 뒤에도 미들웨어를 장착할 수 있음
• 미들웨어 여러 개 넣어줄 수도 있음

순서
1. const app = express(); : 앱을 먼저 만들어준다
2. app.set('port', process.env.PORT || 3000); :앱에 관한 설정을 해준다
3. 그 다음에 공통 미들웨어들 넣어준다

app.use((req, res, next) => {
  console.log('모든 요청에 실행');
})

4. 그 다음에 라우터들 넣어준다 -> 와일드카드같이 범위가 넓은 애들은 뒤로!
5. 그 다음 마지막으로 에러 미들웨어를 넣어준다. -> 매개변수가 반드시 4개 여야 한다.

app.use((err, req, res, next) => {
  console.error(err);
  res.send('에러 이렇게 나옴');
})

• 한 라우터, 미들웨어에서 sendFile 이나 send가 2번 이상 나오면 에러 나온다!!! 주의!! (res.json도 포함)
• 요청 한 번에 응답 한 번이라는 개념을 이해

5. next 활용법

app.get('/', (req, res) => {
  res.json({ hello : 'max'});
  console.log('hello zerocho');
});

여기서 res.json({ hello : 'max'}); 는 응답을 보낼뿐이지 리턴값이 아니기 때문에 실행되면서 함수가 종료되는게 아니다. 그래서 밑에 console.log('hello zerocho');도 실행된다

app.get('/', (req, res) => {
  res.writeHead(200, { 'Content-Type' : 'application/json' });
  res.end(JSON.stringify({ hello : 'max' }));

원래는 이렇게 써줘야 json에 응답하는 것인데 복잡하고 길기 때문에 이것을 익스프레스에서

app.get('/', (req, res) => {
  res.json({ hello : 'max' });

이렇게 줄여준 것 -> API 서버를 만들때 이걸 많이 쓴다 res.render도 응답을 보내는 것

1) 미들웨어

익스프레스는 미들웨어로 구성됨

• 요청과 응답의 중간에 위치하기 때문에 미들웨어
• app.use(미들웨어) 로 장착
• 위에서 아래로 순서대로 실행됨
• 미들웨어는 req, res, next 가 매개변수인 함수
• req: 요청, res: 응답 조작 가능
• next()로 다음 미들웨어로 넘어감. next(error)이렇게 되어있을 경우 에러 처리로 감
• 미들웨어가 실행되는 경우
  • app.use(미들웨어) : 모든 요청에서 미들웨어 실행
  • app.use('/abc', 미들웨어) : abc로 시작하는 요청에서 미들웨어 실행
  • app.post(('/abc', 미들웨어) : abc로 시작하는 POST 요청에서 미들웨어 실행

2) 에러 처리 미들웨어

에러가 발생하면 에러 처리 미들웨어로 감

• err, req, res, next까지 매개변수가 4개
• 첫 번째 err에는 에러에 관한 정보가 담김
• res.status 메서드로 HTTP 상태 코드를 지정 가능 (기본값 200)
• 에러 처리 미들웨어를 안 연결해도 익스프레스가 에러를 알아서 처리해주긴 함
• 특별한 경우가 아니면 가장 아래에 위치하도록 함

3) 미들웨어의 특성

req, res, next를 매개변수로 가지는 함수

app.user((req, res, next) => {
  console.log('모든 요청에 다 실행됩니다.');
  next();
});

4) next

next를 호출해야 다음 코드로 넘어감

• next를 주석 처리하면 응답이 전송되지 않음
• 다음 미들웨어(라우터 미들웨어)로 넘어가지 않기 때문
• next에 인수로 값을 넣으면 에러 핸들러로 넘어감 ('route'인 경우 다음 라우터로)

6. morgan, bodyParser, cookieParser (여기서부터 다시 듣기)

7. static 미들웨어

8. express-session 미들웨어

9. multer 사용하기

10. dotenv 사용하기

11. 라우터 분리하기

12. Pug 템플릿 엔진

13. 넌적스 템플릿 엔진