firebase 적용

import {getFirestore} from "firebase/firestore";    << 추가


//마지막에

initializeApp(firbseConfig);
const db = get Firestor();                        <<< 쓰고 위에 두줄 지움

export { db }

Firebase 홈페이지

• Firestore Database 클릭
• 컬렉션 시작 클릭
• 컬렉션 아이디 입력
  ex)ranking
• 문서아이디 ---> 자동id 클릭
  -필드
  ex) score number 100
  user-name string 이민국
  저장
  

추가한다. 그럼 클랙션 생김.

추가할곳 가서 (vscode)

import { db } from "./firebase";
import { collection, addDoc } from "@firebase/firestore";

• 추가할 부분 ex)onClick

**추가할떄 순서

1. DB 찾기
2. collection 찾기
3. addDoc (멀 넣어줄지까기)

ex)

      <button onClick={async() => {
        dispatch(setMessage(message_ref.current.value));
        dispatch(
          addRank({
            score: score,
            user_name: user_name,
            message: message_ref.current.value,
        }))
  
        const docRef = await addDoc(collection(db, "ranking"), {
          score: score,
            user_name: user_name,
            message: message_ref.current.value,
        });

async awaut <<<-- 서버가 넘겨줄때 까지 기다렷!

오늘은 하루 종일 과제하고 강의 반복해서 들었다..
들으면 들을수록 듣는게 편해지는거 같긴하다..
하지만 너무 느리다.
아무래도 직접 만들면서 해야겠다.
아 그리고 CSS도 좀 했다..