너네 백엔드 하고 싶은 거 있으면 얼마든지 해 난 괜찮어 왜냐면 나는 파이어베이스가 있어대시보드

기존의 렌더링 -> 통신 순으로 진행되던 프로세스를통신 -> 렌더링 순으로 바꿔준다고 하는데그러면 렌더링 -> 통신 -> 변화된 상태 업데이트 였던 것을통신 -> 변화된 상태 업데이트 로 일종의 렌더링 최적화를 시켜준다는 뜻으로 이해해도 될까요?

 사전 설정은 다 제대로 한 것 같은데 회원가입하면 실패도 아니고 오류 로그가 뜹니다.. ㅠㅠapi 오류라고 해서 콘솔 sdk도 다 다시 설정해 보았는데 자꾸 오류가 뜹니다... ㅠㅠ 해결 부탁드립니다. 제 파이어베이스 API sdk입니다. useSignup.jsimport { useState } from 'react' import { appAuth } from '../firebase/config' import { createUserWithEmailAndPassword, updateProfile } from 'firebase/auth' export const useSignup = () => { // 에러 정보를 저장합니다. error 상수에 저장 기본값 null // setError -> 상태를 업데이트 하기 위한 것 const [error, setError] = useState(null); // 현재 서버와 통신중인 상태를 저장합니다. // isPending이 ture면 통신중 const [isPending, setIsPending] = useState(false); // signup 훅을 만듭니다. email, password, displayName 세가지 매개변수를 갖습니다. const signup = (email, password, displayName) => { setError(null); // 아직 에러가 없으니 null 입니다. setIsPending(true); // 통신중이므로 true입니다. // 파이어베이스에서 회원가입을 도와주는 함수 (도큐먼트에 있음) // 비밀번호 설정으로 유저 정보를 등록합니다. config에서 import 받아야합니다. createUserWithEmailAndPassword(appAuth, email, password) .then((userCredential) => { // 회원가입 // 성공했을 때, Signed in // 유저정보를 user에 담아옴 const user = userCredential.user; console.log(user); // 회원 정보를 정상적으로 받지 못하면 실패입니다. -> 경고 띄우기 if (!user) { throw new Error('회원가입에 실패했습니다.'); } // 회원 정보 업데이트 // 회원가입이 완료되고 유저 정보에 닉네임(displayName)을 업데이트합니다. import 받아야합니다.\ // appAuth.currentUser를 통해 현재 로그인 정보를 받아옴 updateProfile(appAuth.currentUser, { displayName }) .then(() => { setError(null); setIsPending(false); }).catch((err) => { //예외 처리 setError(err.message); setIsPending(false) console.log(err.message); }); }) .catch((err) => { // 예외 처리 setError(err.message); setIsPending(false); console.log(err.message); }); } // 에러값, 통신여부, signup 함수(밖에서 사용할 수 있도록) 리턴 return { error, isPending, signup } }  config.js// 계정과 관련된 파이어베이스 설정 -> 깃허브에 올리면 안됨 // Import the functions you need from the SDKs you need import { initializeApp } from "firebase/app"; import { getAuth } from "firebase/auth"; import { getFirestore } from "firebase/firestore"; // Your web app's Firebase configuration const firebaseConfig = { apiKey: process.env.REACT_APP_API_KEY, authDomain: process.env.REACT_APP_AUTH_DOMAIN, projectId: process.env.REACT_APP_PROJECT_ID, storageBucket: process.env.REACT_APP_STORAGE_BUCKET, messagingSenderId: process.env.REACT_APP_MESSAGING_SENDER_ID, appId: process.env.REACT_APP_APP_ID, }; // Initialize Firebase 인증 초기화 // firebase 초기화 const app = initializeApp(firebaseConfig); const appAuth = getAuth(); // firestore 초기화 const appFireStore = getFirestore(app); // 나중에 다른 곳에서도 사용 가능하게 빼놓는 것 export{appAuth, getFirestore}  .envREACT_APP_API_KEY = AIzaSyAIgKLWTMyx_t8VhSzEUB3XQF755FGB7_c REACT_APP_AUTH_DOMAIN = mydiary-ccb8c.firebaseapp.com REACT_APP_PROJECT_ID = mydiary-ccb8c REACT_APP_STORAGE_BUCKET = mydiary-ccb8c.appspot.com REACT_APP_MESSAGING_SENDER_ID = 1047629886497 REACT_APP_APP_ID = 1:1047629886497:web:59ffb871ffeb3054261f60

(Mac)firebase init 입력 후 Hosting 까지 선택했으나,Use an existing project 선택 시Error: Failed to list Firebase projects. See firebase-debug.log for more info.위와 같은 에러가 발생했다면저의 경우 firebase login --reauth 를 통해 해결할 수 있었습니다.혹시 저와 같은 상황을 맞닥드리신 분이 있다면 시도해보시면 좋을 것 같습니다.

import { appFireStore } from "../firebase/config" import { useEffect, useState } from "react" import { onSnapshot, collection, query, where, orderBy } from "firebase/firestore"; export const useCollection = (transaction, myQuery) => { const [documents, setDocuments] = useState(null); const [error, setError] = useState(null); useEffect(() => { let q; if (myQuery) { q = query(collection(appFireStore, transaction), where(...myQuery), orderBy("createdTime", "desc")); } const unsubscribe = onSnapshot((myQuery ? q : collection(appFireStore, transaction), (snapshot) => { let result = []; snapshot.docs.forEach((doc) => { result.push({...doc.data(), id: doc.id}); }) setDocuments(result); setError(null); }, (error) => { setError(error.message); } )) return unsubscribe; }, [collection]) return { documents, error } }이런 error가 뜨는데 어떻게 해결해야 할까요?

   const { dispatch } = useAuthContext(); 위와 같이 사용했을 때 dispatch 아래에 밑줄이 생기는데  'null' 형식에 'dispatch' 속성이 없습니다.ts(2339)const dispatch: any  와 같은 에러가 생깁니다. (alias) const AuthContext: Context<null>import AuthContext 이렇기 때문인 것 같은데 어떻게 수정해야할까요..타입스크립트를 사용하고 있습니다.

안녕하세요! 혹시 프로젝트를 따라서 만들고, 별도로 수정한 내용을 다른 컴퓨터로 옮겨서 실행했어요.깃허브 커밋까지 완료는 했고, firebase deploy --only hosting을 실행하긴 했는데요.아래 에러가 떠요. 혹시 이 부분 어떤 원인인지 알 수 있을까요?Error: Directory 'dist' for Hosting does not exist.

next js 에는 browserRouter가 없어서 상태에 맞는 화면을 어떻게 노출하나요?로그인 전후에 따라서 표시하는 페이지를 어떻게 비슷하게 만들 수 있는지 궁금합니다.

import styles from './Nav.module.css' import Link from 'next/link' export default function Nav() { return( <nav className={styles.nav}> <h1 className={styles.title}>두근 두근 비밀일기</h1> <ul className={styles.list_nav}> <li><Link href={'/login'}>로그인</Link></li> <li><Link href={'/signup'}>가입하기</Link></li> </ul> </nav> ) } li 태그가 그대로 * 점으로 표기되면서로그인가입하기이런식으로 보이는데 선생님 화면에서는 점 표시가 안보이는데 어떤 차이때문인가요?

안녕하세요.. 강의를 다 듣고 빌드 후 배포하고 업데이트하는 과정에서 재빌드를 하고 재배포하는 과정에서 오류가 나면서 수정 중에 npm이 전체 먹통이 되고 아무것도 안되는데 완성본을 받을 수 있을까요 ..?

context 를 안 써봐서 선생님 강의 보는데 그거에 대한 설명이 없어서 구글링을 해봤거든요.https://velog.io/@velopert/react-context-tutorial여기 블로그 글을 보면 컴포넌트가 많을 경우 선생님 처럼 커스텀 후크로 만들어서 사용하는 걸 추천한다고만 했지 그 이유에 대한 설명이 없어서 아직도 왜 이렇게 쓰는 건지 모르겠습니다 ㅠㅠ

개발환경 : React.js(최신), Next.js(최신), TypeScript, Emotion(Styled-component),chromBrowserfirebase설정과 사용부분만 배워보려고 강의 수강중인데설정하고 hook제작하고 테스트 해보려는데 500에러가 납니다.env문제인것 같아서 process.env.REACT_APP_API_KEY 이런 식으로 하니 이번엔config파일 아래에 있는const app = initializeApp(firebaseConfig); const analytics = getAnalytics(app); const appAuth = getAuth(); const appFireStore = getFireStore(app);이 부분에 getAnalytics(app); 여기 부분에 에러가 나면서 window is undefined라는 에러가 나옵니다.서버사이드 렌더링 과정에서 문제가 생기는 것인가요? 도저히 해결법을 모르겠어서 질문 남깁니다.

안녕하세요! import시키고 npm start시켰을 때, 페이지는 나오는데, login, signup 페이지의 글자가 선생님처럼 나오지 않습니다! 어떤 부분이 잘못된 걸 까요?

강의를 참고하면서 진행하던 중, useSignup hook 을 만들고 회원가입 테스트를 하던 도중 콘솔에서 400 번대 에러가 나는 상황입니다.우선, env 파일도 최상위 루트에 존재하고 있고, api키도 잘못 받아왔나 싶어서 여러번 체크도 했습니다.혹시 그럴리는 없겠지만, env를 못 읽는건가 해서 firebaseconfig의 내용들을 env 없이 config.js에 그대로 붙여줬는데도, 여전히 유효하지 않은 api key 라는 에러 메시지가 뜨는데, 어떻게 해결해야 할까요..?

16:40 ~