<참고 링크>
우선 서버를 여는 방법은 다음과 같습니다.
기존과 같이 CRA(create-react-app)을 통해서 프로젝트를 생성해줍니다.
그 후, 다음 명령어를 통해 Koa를 사용할 환경을 만들어줍니다.
$ yarn add koa
📁src/📋server.js
를 생성 한 후 아래와 같이 작성합니다.
const koa = require('koa'); const app = new Koa(); app. use(ctx => { ctx.body = 'Server is Connecting...'; }); app. listen(4000, () => { console.log('server is listening to port 4000'); });
서버를 작성했으니 실행해보겠습니다.
$ node src/server.js server is listening to port 4000
터미널에 서버가 연결됐다고 뜹니다.
그 후, 포트 4000번(http://localhost:4000/)을 들어간다면,
Koa 어플리케이션은, 미들웨어의 배열로 구성되어있습니다.
우리가 위 코드에서 app.use
라는 함수를 사용하여 미들웨어를 어플리케이션에 등록하는 것입니다.
app.use(ctx => { ctx.body = 'Server is Connecting...'; });
여기서 ctx => {...}
코드가, 하나의 미들웨어입니다.
koa의 미들웨어 함수에서는, 두 가지의 파라미터를 받습니다. 첫 째는 위 코드에서 나오는 ctx
이고, 두 번째는 next
입니다.
ctx
는, 웹 요청과, 응답에 대한 정보를 지니고 있고, enxt
는 다음 미들웨어를 실행시키는 함수입니다.
만약에 미들웨어에서 next를 호출하지 않게 된다면, 그 부분에서 요청 처리를 완료시키고, 응답을 하게 됩니다.
그리고 미들웨어는, 등록하는 순서대로 실행하게 됩니다.
다음과 같이 기록을 하는 미들웨어 두 개를 기존 미들웨어 상단에 추가합니다.
// src/server.js const Koa = require('koa'); const app = new Koa(); app.user(ctx => { console.log(1); }); app.use(ctx => { console.log(2); }); app.use(ctx => { ctx.body = 'Server is Connecting...' }); app.listen(4000, ()=> { console.log('server is listening to port 4000'); });
작성 후, 터미널에서 node
를 이용해 실행시켜줍니다.
$ node src/server.js server is listening to port 4000 1
두 번째 미들웨어 console.log(2)를 실행하지 않고, 첫 번째 미들웨어 console.log(1)을 출력하고 멈췄습니다.
이는, next()
를 호출하지 않았기 때문입니다. 함수의 파라미터 부분에 next를 받아와서 호출합니다.
app.use((ctx, next) => { console.log(1); next(); }); app.use((ctx, next) => { console.log(2); next(); });
다음과 같이 수정 후, 터미널에서 node
를 이용해 다시 서버를 열어줍니다.
$ node src/server.js server is listening to port 4000 1 2
이제, 우리가 예상했던대로 작동합니다.
next()
를 실행하면, 프로미스를 반환합니다.
따라서, 작업들이 끝나고 다시 할 작업들을 정해줄 수 있습니다.
첫 번째 미들웨어의 코드를 다음과 같이 수정하고, 다시 페이지를 열어봅시다.
app.use((ctx, next) => { console.log(1); const stated = new Date(); next().then() => { console.log(new Date() - started + 'ms'); }); });
$ node src/server.js server is listening to port 4000 1 2 1ms
코드를 express
처럼 콜백 위주로만 한다면, 이걸로 하기는 굉장히 번거롭습니다. 하지만 Koa에서는 매우 편하게 가능합니다.
Koa에서 별도의 작업없이 async/await
을 바로 사용할 수 있습니다.
방금 작성했던 미들웨어를, async/await
을 이용해 작성해보겠습니다.
app.use(async (ctx, next) => { console.log(1); const started = new Date(); await next(); console.log(new Date() - started + 'ms'); });
위 코드는 이전 코드와 동일하게 작동합니다.
이렇게 미들웨어에서 next()
를 기다리는 것 말고도 서버측에서 async/await
은 자주 사용됩니다.
이는 데이터베이스에 요청을 할 때, 매우 유용하게 사용됩니다.
이 문법이 있으니, 콜백이 여러 개 겹칠 일이 없어졌습니다.