[typescript] 파이어베이스 타입스크립트로 적용하기!

박소정·2022년 9월 6일
0
post-thumbnail

개인프로젝트를 시작하기 전에 파이어베이스를 배우고 싶어 파이어 베이스를 배우고 있는데, 공부용 프로젝트다 보니 타입스크립트를 붙이는데 왠지 더 부담이 적었다!

간단한 회원가입 페이지를 만들고 회원가입을 눌렀는데! 400에러가 나버렸다^0^ 뭐가 문제지 싶어서 이것저것 건들여봤지만 딱히 원인으로 보이는 것이 발견되지 않았고, 아직 파이어베이스에 타입스크립트 설정은 넣어주지 않은 것이 생각나 이 부분부터 수정해 보기로 했다.

타입스크립트로 파이어베이스를 붙이면 몇가지 작업을 거쳐야하는데 이 부분은 파이어베이스 공식문서를 참고했다.

사실 과정은 공식문서만 잘 따라한다면 굉장히 간단했는데,
터미널에 firebase init functions를 입력하면 여러가지 설정 사항들이 나오는데, 자신의 프로젝트에 맞는 설정을 선택하면 된다!

다음으로 tsconfig.json파일에서 자바스크립트를 허용하는 컴파일러 옵션인 "allowJs":true로 설정하고,
package.json파일에

{
   "name": "functions",
   "scripts": {
     "build": "npm run lint && tsc"
   }

해당 스크립트를 추가하고 다시 동작을 시켰더니
400에러가 나지 않고 회원가입 성공시 콘솔에 뜨도록 작성한 코드가

두둥✨
떴다!ㅎㅎ

파이어베이스로 백엔드를 붙이며 회원가입 과정까지 만든 지금까지의 느낌은 소셜로그인 구현과 비슷하다는 생각이 들었다!

0개의 댓글