트위터 클론코딩 * 1

🐥

setPersistence : 사용자를 어떻게 기억할 것인지 선택. (초기값: local)

• local : 브라우저를 닫더라도 사용자의 정보가 기억됨
• session : 탭이 열려있는 동안 사용자의 정보가 기억됨
• none : 사용자의 정보를 기억하지 않음

📛 Error

1.

fbase__WEBPACK_IMPORTED_MODULE_0__.authService.createUserWithEmailAndPassword is not a function

강의에서 사용하는 firebase보다 버전이 높아서 발생한 콘솔 오류이다.

import { getAuth, signInWithEmailAndPassword, createUserWithEmailAndPassword } from 'firebase/auth';
import React, { useState } from 'react';

{...}

    const onSubmit = async (event) => {
        event.preventDefault(); // 기본 행위 실행 X
        try {
            let data;
            if (newAccount) { // 두 상황 모두 로그인 O 
                // 새 계정 생성
                // createUserWithEmailAndPassword
                const auth = getAuth();
                data = await createUserWithEmailAndPassword(
                    auth, email, password
                )        
                // data = await authService.createUserWithEmailAndPassword (
                //     email, password
                // );
            } 

주석 처리된 부분이 기존 작성 코드이고, 새로 작성한 코드는 이와 같다.

2.

Cannot create property '_canInitEmulator' on string aaaa@...

이 또한 버전 문제로 발생한 오류이다 😥 바로 위의 코드에서 else 문만 다음과 같이 수정한다.

else {
                // 로그인
                const auth = getAuth();
                data = await signInWithEmailAndPassword (
                    auth, email, password
                );

3.

Uncaught (in promise) TypeError: fbase__WEBPACK_IMPORTED_MODULE_0__.authService.signInWithPopup is not a function

이 또한... ... 버전!

    const onSocialClick = async (event) => {
        const {target : {name}} = event;
        let provider;

        if (name === 'google') {
            provider = new GoogleAuthProvider();
        } else if (name === 'github') {
            provider = new GithubAuthProvider();
        }
        // const data = await authService.signInWithPopup(provider);
        // ★ 이 코드를
        
        const data = await signInWithPopup(authService, provider);
        // 로 수정
        console.log(data);
    }

🌙 주차 후기

Firebase는 정말 대박이다. '이런 것까지 된다고...?'라는 생각을 몇 번이나 하게끔 만들어주었으니 🤣🤣🤣 부족한 게 있다면 그것은 나의 리액트와 JS 실력일 것,,,
이번주는 이런저런 사정(+올림픽... ^^)에 의해 성실히 학습하지 못했던 것 같다. 😢 반성 또 반성...