Week2) Event API 만들기

Routing

라우팅(Routing)이란 URI가 클라이언트 요청에 응답하는(특정한 뷰로 연결되는) 방식이다.
Next.js는 File-based Rouing 방식이라고 해서 pages 폴더의 파일을 바탕으로 라우트를 자동 생성한다.
최상단의 pages 폴더를 기준으로 새로운 폴더와 파일을 만들고 그것이 라우터 경로(path)가 되는 것이다.

pages/index.js ⇒ /
pages/blog/index.js ⇒ /blog

Dynamic Routing

동적 라우팅의 경우 대괄호를 사용한다.

pages/api/events/[eventtId]/orders/index.ts --> /api/events/:eventId/orders

API Route

API Route는 pages/api 이하로 들어오는 모든 파일을 반환해준다.
Express.js와 마찬가지로 Request와 Response의 인스턴스를 제공한다. (req, res)

Event API 만들기

입력값 검증

실제 운영을 하다보면 개발자가 예상하지 못한 입력값이 들어오는 경우가 있다.
이런 일을 대비해 입력값을 검증해야 하는데, 모든 경우를 직접 확인하기는 어렵다.
따라서 유효성 검사 모듈을 사용하는 것이 편리하다.
Fastify 프레임워크는 Ajv 모듈을 활용할 수 있으나, Next.js는 직접 설치해야 한다고 한다.

스터디에서는 매번 Ajv 인스턴스를 생성하는 대신 util 메서드 validateParamWithData가 미리 준비되었다.
JSON Schema 까지 작성해 전달하여 유효성 검증을 할 수 있게 된다.
구체적인 코드는 스터디에서 제공받았기 때문에 올리지 않는다.

데이터 불러오기

검증 후 데이터를 불러올 때는 req.query.eventId 값을 활용한다.
events 콜렉션에서 데이터를 가져오면 된다고.
클라우드 파이어스토어에 접근하는 것은 공식 문서를 참고 한다.

간단한 테스트를 진행했다.
먼저 파이어스토어에 임의로 문서를 추가한다.

소스는 파이어스토어 인스턴스를 가져와 events 콜렉션에 접근, 그 후 doc 을 통해 콜렉션 안의 문서까지 들어간다. 그 후 가져온 문서에서 get 을 실행.

FirebaseAdmin.getInstance().Firestore.collection('events').doc('문서 id');

포스트맨에서 실행해 아래와 같이 정상적으로 데이터를 불러온 것을 확인했다.

이렇게 데이터를 불러올 수 있으면, 이제 데이터를 등록하는 API도 필요하다.

데이터 등록하기

파이어스토어의 공식문서에 따르면 데이터를 등록하는 방법에는 2가지가 있다.

• add()를 사용하면 파이어스토어에서 자동으로 ID를 생성한다.

// Add a new document with a generated id.
const res = await db.collection('cities').add({
  name: 'Tokyo',
  country: 'Japan'
});

console.log('Added document with ID: ', res.id);index.js

• set()을 사용하면 직접 ID를 설정해 등록할 수 있다.

await db.collection('cities').doc('new-city-id').set(data);index.js

인증(Authentication)과 인가(Authorization)

• 인증 : 유저의 신원을 확인
• 인가 : 유저의 권한을 승인

스터디에서 인증은 Firebase 인증을 활용한다. 처음 받은 소스에 이미 인증이 구현되어 있었다.
구글 인증을 하게 되는데, 로그인 하고 나면 토큰(token)으로 인증 사실이 저장된다.
await FirebaseAuthClient.getInstance().Auth.currentUser?.getIdToken(); 을 통해 토큰에 접근할 수도 있다.