44,000원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
eslint 질문 있습니다.
eslint 저장을 하고 강의처럼 props에 값을 주면 똑같은 메세지가 안나옵니다. jsx로 파일 설정을 안해서 그럴까요?
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
npm create react app
안녕하세요 강사님 제목처럼 react app 만들어도 될까요?큰 차이가 있나요?
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
[리덕스 미들웨어]강의 중에 createStore에서 막혔습니다.
강사님과 같이 했는데 저는 이렇게 빨간 줄이 뜨면서 리액트앱을 실행시키면 이러한 오류가 뜹니다.ㅠㅠ왜이런걸까요..? 어떻게 해결해야 할까요?
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
회원가입 유효성 부분 페이지 안뜨는 이유 좀요....
import React ,{useRef}from 'react' import { Link } from 'react-router-dom' import {useForm} from 'react-hook-form' function RegisterPage() { const {register,watch,errors} = useForm() const password = useRef(); console.log(watch("email")) return ( <div className='auth-wrapper'> <div style={{textAlign:'center'}}> <h3>Register</h3> </div> <form> <label>Email</label> <input name="email" type='email' // ref={register({ required: true, pattern: /^[0-9a-zA-Z]([-_._]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_._]?[0-9a-zA-Z])*\.[a-zA-Z]{2,3}$/i })} /> {/* {errors.email && <p>This field is required</p>} */} <label>Name</label> <input name="name" // ref={register({ required: true, maxLength: 10 })} /> {/* {errors.name && errors.name.type ==="requirerd" && <p>This field is required</p>} {errors.name && errors.name.type ==="maxLength" && <p>This input exceed maximum length</p>} */} <label>Password</label> <input name="password" type='password' // ref={register({required: true, minLength:6})} /> {/* {errors.password &&errors.password && errors.password.type ==="required" && <p>This name field is required</p>} {errors.password &&errors.password && errors.password.type ==="minLength" && <p>비밀번호 자리가 6자리 이상이어야 합니다.</p>} */} <label>Password Confirm</label> <input name="Password Confirm" type='password' // ref={register({ // required:true, // validate:(value)=> // value === password.current // })} /> {/* {errors.password_confirm && errors.password_confirm.type ==="required" && <p>This password confirm field is required</p>} {errors.password_confirm && errors.password_confirm.type ==="validate" && <p>This passwords do not match</p>} */} <input type="submit" /> <Link style={{color:'gray',textDecoration:'none'}}to="/login" >이미 아이디가 있다면</Link> </form> </div> ) } export default RegisterPage 이렇게 저 부분을 주석처리하면 회원가입 페이지가 나오는데 주석처리를 해제하면 회원가입 페이지가 안떠요...
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
강의 pdf 파일
안녕하세요, 강의 자료 pdf #2 Authentication 부분에 깨져서 보이는데 업데이트 해주실수 있나요?
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
파이어베이스 파일 삭제, 사진 업로드 기능 오류
강의를 따라서 어플을 완성한 뒤에 파이어베이스를 만지다가실수로 파이어베이스 파일들을 전부 삭제 시켰습니다.그래서 다시 실행시켜보니 리얼타임 데이터베이스의파일들은 다시 생성이 되어서 채팅기능이 잘 작동하지만storage의 message/ 파일이 다시 생성이 되지않아사진 업로드 기능이 작동되지 않습니다.이거 혹시 해결 방법이 있을까요?밑에는 사진 업로드 눌렀을 때 나오는 오류 코드입니다
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
firebase 초기화 오류
firebase에 이메일로 회원가입 기능 구현 강의를 듣고 있는데이메일과 이름 비밀번호를 입력하고 제출을 누르면 Firebase: No Firebase App '[DEFAULT]' has been created - call initializeApp() first (app/no-app). 이런 오류 코드가 나오면서 firebase에 저장이 되지 않는데 뭐가 문제일까요
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
mime-types 패키지를 import 할 때 에러 발생
mime-types를 설치하고 import 시킨 후에 해당 사진과 같은 에러가 발생합니다..
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
리덕스 스토어에 로그인 유저 정보가 저장이 되지 않는 문제
리덕스 스토어에 로그인 유저 정보 저장이 되지 않는 것 같습니다.로그인은 잘 되어 라우팅 되는 거 같은데 왜 스토어에 저장이 안되는지 질문드립니다!
- 해결됨따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
강의 리뉴얼 일정을 알 수 있을까요?
"따라하며 배우는 리액트, 파이어베이스"이 강의를 리뉴얼 예정이라고 하셨는데언제 완성이 될지 일정을 알 수 있을까요?
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
완성본으로 제공된 코드를 구동시켜보려면
어떻게해야하나요.?이거 뭐 강의영상이랑 최종본코드랑도 많이 다르고 커뮤니티 뒤적거려보니까 버전이 달라져서 뭐 안맞다는 얘기도 많고 한데 구버전 강의를 계속 파는게 맞나요 ??
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
DB와 강의 리뉴얼
먼저 좋은 강의 감사합니다!Firestore 대신에 Realtime DB를 사용하신 이유가 궁금합니다 강의 리뉴얼은 언제쯤 마무리 될지, 아예 v9으로 다시 만드시는 것인지 여쭙고 싶습니다.감사합니다.좋은 하루 보내세요 : )
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
next.js 환경에서 이 수업을 들을 수 있나요?
next.js 환경에서 이 수업을 들을 수 있나요?
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
Cannot read properties of undefined (reading 'isLoading') 오류 해결법 혹시 알 수 있을까요...
안녕하세요 제가 이번 강의를 따라하다가 파이어베이스 버전이 달라지는 시점부터 영상과 다른 내용을 찾으면서 해결하는 게 너무 힘들어서 일단 완성된 앱을 가지고 보면서 공부하자고 생각하여 완성본 코드와 똑같이 만든 후 모듈도 다 설치하고 파이어베이스에 연결도 다 했는데요 앱을 실행시키니 아래와 같은 오류가 뜹니다ㅠㅠ 정말 도저히 어떻게 해야할 지 모르겠습니다.. 정말 앱이 실행만 됐으면 좋겠는데 방법이 있을까요..?
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
addChatRoom 함수 작성시
add Chat Room 함수 작성시 await부분에서 오류가 나는데 await는 async내에서만 작성할 수 있다고 하더라구요. 어떻게 변경해야 한나요?
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
강의 도표 자료 다운을 받으면, zip파일에 아무것도 들어있지않다고 나옵니다.
윈도우 운영체제를 쓰는데 강의 도표 자료 다운을 받으면, zip파일에 아무것도 들어있지않다고 나옵니다.다시 강의 도표 자료를 올려주실 수 있을까요?
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
Favorite.js 질문입니다.! 화면 새로고침하면, 추가한 Favorite chatrooms가 날라가고 딱 1개만 남습니다!
Favorite.js 질문입니다.! 화면 새로고침하면, 추가한 Favorite chatrooms가 날라가고 딱 1개만 남습니다! MessageHeader에서 채팅방 하트 꾸욱 눌러 favorite에 넣으면,SidePanel에 Favorite이 업데이트되어 채팅방이 입력됩니다.Favorite 채팅방 목록 나오고, 개수까지 다 잘 나와요;잘 됩니다. 하지만, F5 새로고침을 누르면 Favorite에는 결국, 1개의 채팅방만 나오고 나머지는 싹 다 날라갑니다.최초에 파이어베이스에서 채팅방목록을 모두 못불러오는것 같아요.코드 수정을 해야할 것 같은데요,작성해주신 코드를 보면 잘못된건 없는것 같은데 왜 그럴까요?
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
npm run start를 하면 흰색 화면만 나옵니다.
소스코드는 다음과 같습니다.import React, { useEffect } from "react"; import { Routes, Route, useNavigate } from "react-router-dom"; import ChatPage from "./components/ChatPage/ChatPage"; import LoginPage from "./components/LoginPage/LoginPage"; import RegisterPage from "./components/RegisterPage/RegisterPage"; function App() { return ( <Routes> <Route path="/" element={<ChatPage />} /> <Route path="/login" element={<LoginPage />} /> <Route path="/register" element={<RegisterPage />} /> </Routes> ); } export default App;
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
파이어스토어에서 db 값 가져오기 테스트 중...에러
코드샌드박스에서 작성중인 데이터입니다.https://codesandbox.io/s/upbeat-jasper-gfb978?file=/src/App.js:0-563 import "./styles.css";import { db } from "./firebase";import { doc, onSnapshot } export default function App() { const unsub = onSnapshot(doc(db, "cities", "SF"), (doc) => { let word = "hsdsi"; console.log("Current data: ", doc.data().name); word = doc.data().name; }); //word = unsub.name; return ( <div> <p> {word} </p> </div> ); // Add a new document in collection "cities"} word 변수를 선언해서 return 값으로 word 변수를 받아서 rendering 하려고 합니다. onSnapshot( ) 안에서 let word = "" ;으로 초기 변수 설정을 해주지 않으면, 에러가 계속 뜨더라구요.어쩔수없이 이렇게 선언해서 return 값에서 불러왔는데, 렌더링은 잘되지만, 코드 자체는 에러가 뜹니다.제가 볼때도 const 내부에서 선언하면 호이스팅이 안되기때문에 변수 초기화가 안되서 이렇게 하면 안될것 같지만, 일단 렌더링이 되긴하네요. 근데 코드상에서는 빨간줄이 밑줄 그어지면서잘못 코드한것처럼 에러가 나는것 같습니다.어떻게 해줘야할까요?
- 미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
파이어 베이스 회원가입 오류
회원가입을 하려고 할때 이런 오류가 뜨는대요 완성본 파일에서 ChatPage의 Manipanel을 가져오면 이런 오류가 사라집니다.오류내용을 번역하면 소스를 통해 호스팅에 배포되지 않은 경우 옵션을 제공해야 합니다. (app/no-timeout).이게 뭘 의미하는지 모르겠습니다답변 부탁드립니다!