[React] Timer 만들기 오류 해결, 앞으로의 계획, 느낀 점

오류

DB에 있는 id값과 현재 로그인 중인 user의 id값을 비교하던 중, map을 사용하니 조건에 맞지 않는 값들은 undefined
로 출력이 되었다.

undefined 상태로 DB에 넣으려 했더니 'FirebaseError: Function addDoc() called with invalid data. Unsupported field value: undefined' 오류가 나왔다.

undefined를 없애기 위해 이런저런 시도를 하다가 filter를 통해 다시 돌려주었고 undefined를 지울 수 있었다.

아래 코드는 해결이 된 코드이다.

    useEffect(() => {
        dbService.collection("currentTime").onSnapshot(snapshot => {
            const contentMap = snapshot.docs.map(doc => {
                if (doc.data().creatorId === userObj.uid) {
                return { id: doc.id, ...doc.data() }
                // }
            })
            const contentTimeArray = contentMap.filter(doc => {
                if (doc !== undefined) {
                    const returnValue = {
                        time: doc.saveTime,
                        text: doc.text,
                    }
                    return returnValue
                }
            })
            setContent(contentMap)
        })
    }, [])

---

계획

프로젝트를 이번 주 내로 끝낼 예정이다.

내가 기록한 시간과 내용을 DB에 저장해서 Contents에서 볼 수 있도록 해주었는데, 다른 계정에서 확인이 안 되는 것을 먼저 수정해야 한다.

호스팅도 해볼 계획이다.

---

느낀 점

확실히 이론 공부보다는 도움이 된다고 생각한다.

내 자신이 생각 없이 코딩을 하고 있다는 것을 느낄 수 있었다.
-> 다음 프로젝트는 구체적인 목표와 계획을 갖고 해야겠다.

알고 있는 내용으로만 활용하는 것이 아니라 새로운 것을 찾아보고 활용하는 능력도 길러야 할 것 같다.