오늘의 목표
-
정예반 과제 (O)
-
알고리즘 문제풀기 (O)
새로 알게 된것
- 오늘 정예반 회원가입 기능을 구현하던 도중
Firebase: Error (auth/invalid-api-key). FirebaseError: Firebase: Error (auth/invalid-api-key).
에러를 마주했는데
이에러를 해결하기 위해서는
- .env가 root에 있는지 확인해야 되었고.
- API key가 잘못된경우
- firebaseConfig epxort를 하고, 다른파일에서 import를 할 경우
였다. 나는 다 확인을 했는데 문제가 없었고 다른 곳에서 문제를 찾았는데
.env 파일은 파일을 변경한 후에는 개발 서버를 다시 시작해야 되는 거였다.
참고한곳 : https://create-react-app.dev/docs/adding-custom-environment-variables/
- 회원 가입 기능을 하던중 내가 로그인이 되었을때 Header에 있는 로그인과 회원가입 버튼을
로그아웃과 이메일 정보가 표시되게 하던중 새로운 Hook을 알게되었다.
yarn add react-firebase-hooks
설치한후 useAuthState 훅을 사용할수있는데 useAuthState(auth)를 넣어주면 로그인 정보를 뽑아 올수 있었다. Firebase Auth 상태를 추적하는 데 사용할 수 있는 React 훅이다.
느낀점
- 오늘 정예반 과제에서 회원가입 로그인 기능을 과제로 부여받았다.
로그인 회원가입 기능을 한번도 해본적이 없었지만 firebase를 그래도 조금 사용을 해봤는데도
아직 데이터를 가져오는데에 조금어려움이 있었다. 강의를 다시 돌려보고 firebase 공식 사이트도 보면서 최대한 생각을 하고 하나하나 만들어가서 기능을 완성했는데.
생각보다 유효성 검사를 하는 부분이 하나해결하면 하나가 더 나오고 해서 까다롭게 느껴졌다 하지만 오늘 회원가입 로그인 부분을 해내면서 프로젝트때 해보지 못한 부분을 해서 뜻깊은 시간이었고
다음에도 이 기능을 하게 된다면 유효성검사부분을 alert말고 실시간 반응으로 해봐야 겠다는 생각도 했습니다.
