FE

[CND-Project] Firebase Firestore Data types에는 Map이 있다! 본문

삽질일지

[CND-Project] Firebase Firestore Data types에는 Map이 있다!

zizonemoi 2023. 2. 3. 23:30

CND Project에서 삽질 1 

1. 왜 Firebase였나

CND에서 코인 모의투자를 위해서 유저별 투자 정보를 담을 데이터베이스가 필요했다.

FE 3명이 만드는 프로젝트라 백엔드 코드를 모르더라도 사용할 수 있는 툴이 필요했다.

= Firebase(No-SQL) CRUD 메소드 사용

 

2. Firebase를 담당하게 됐다...

Next.js를 사용하면서 페이지 단위로 개발을 나누게 됐다.

나를 제외한 두분은 회원가입, 로그인 기능을 하신 적이 있어서 내가 회원가입, 로그인 파트를 맡게 됐다.

사실 이 부분은 복잡한 상태가 있거나 하지 않아서 얼마 걸리지 않았다. 금방 끝나버려서 할 것도 없었다.

또 Firebase에 대한 지식은 0이었지만 써보고 싶기도 했어서 담당하게 됐다.

 

3. Firestore에서 하게 된 삽질은 Data types🐟

간단히 데이터를 표시하자면

코인 : 금액, 자산 : 금액

이런 형식의 키, 값을 보관할 수 있는 자료가 필요했다.

당연히 객체를 생각할 수 밖에 없다.

처음 Firestore를 접했을 때 콜렉터랑 필드 만드는 부분이 코드를 짜지 않아도 UI로 직접 입력해서 확인할 수 있는 구조였다.

왜 삽질을 하게 됐냐면 객체 타입을 입력하려고 타입을 봤는데 원시 타입들만 보였다.(???)

그래서 이 원시 타입으로 어떻게 데이터 구조를 잘 만들 수 있을까하고 새벽까지 삽질을 했었다.

 

4. 삽질은 해결했는가?

그렇다.

새벽까지 고민을 했는데 너무 복잡한 형식이 나오게 됐다.

그래서 다음날에 팀원들에게 SOS를 요청했다. 이 구조 괜찮은지 다른 좋은 방법이 있는지 집단 지성을 믿었다.

먼저 짜놓은 구조를 설명하려고 Firestore의 필드를 입력하고 있었는데 팀원분께서 밑에 데이터 타입 더 있는 것 같다고 하셨다.

보니까 Map이 있었다... 진짜 충격적

너무 간편한 UI여서 코드 짜기 전에 빠르게 타입 파악하고 테스트를 하고 데이터 구조를 생각해 봐야겠다고 한 게 땅을 더 파게 만들었다.

문서 보니까 데이터 타입 설명도 잘 돼 있었다.

사실 데이터 타입 부분 드래그해서 오버플로된 부분 타입만 봤어도 1~2일은 아낄 수 있었을텐데...

조금 더 꼼꼼함이 필요했지 않았나

Firestore Data types

 


📌 간단하게 객체 리터럴로 만든 객체와 Map의 차이를 알아보자

JS에서 객체의 키에는 string과 Symbol만 들어올 수 있다.

Map은 키에 문자열 아니어도 모든 자료형이 쓰일 수 있다.

Comments