본문 바로가기

전체 글

(9)
[FirebaseError] the client is offline. - firestore 데이터 불러오지 못하는 에러 해결 Firebase와 React를 연동하는 과정에서, FirebaseError: Failed to get document because the client is offline 이라는 에러를 만났다. 외국 형님들의 StackOverflow를 참고하면 버전을 다운그레이드 하라는 해결법만 제시되는데, 필자 같은 경우에는 조금 더 근본적인 해결 법들이 먹혔다. 1. .env 파일의 위치 확인 firebaseConfig인 firebase의 설정값을 환경변수로 관리 해 주기 위해서 .env파일을 생성해서 process.env.REACT_APP_ 형식으로 코드를 작성 했었는데, 필지의 경우에는 파일이 src 디렉토리 안에 있었다. 이것이 문제였던 것으로 판단되는데, .env 파일은 항상 프로젝트 디렉토리의 루트 디렉토리..
[React.js + Firebase] Firestore 데이터 React로 연동하기 - 초간단 사진 게시판 만들기(1) 이 전 포스트에서 React와 Firebase를 활용하여 서버리스한 게시판을 만들기 위해 기본적인 세팅을 완료했다 이번 포스트에서는 연결 해 놓은 Firebase에서 Firestore이라는 빌드를 활용하여 아주아주 간단한 Back-end 환경을 구축 해 보도록 하겠다. 2023.05.25 - [Web] - [React.js + Firebase] 초간단 사진 게시판 만들기(0) - create-react-app, firebase 연동 [React.js + Firebase] 초간단 사진 게시판 만들기(0) - create-react-app, firebase 연동 간단한 기능의 게시판이나 웹사이트를 만들 때, React.js를 사용한 정적 페이지로 만드는 방법은 추후에 콘텐츠 수정이나 구조 변경을 해야 할 때..
[React.js + Firebase] React, firebase 연동하는법 - 초간단 사진 게시판 만들기(0) 간단한 기능의 게시판이나 웹사이트를 만들 때, React.js를 사용한 정적 페이지로 만드는 방법은 추후에 콘텐츠 수정이나 구조 변경을 해야 할 때 코드에 접근해야 하는 것이 필수적이다. 따라서 이번 시리즈에서는 Firebase를 활용하여 Serverless하고 가벼운 용도에 맞는 웹사이트를 구축해 보는 것이 목적이다. 개인적인 목표로는 복무하면서 만들고 공부했던 지식들과 하나의 웹사이트를 만들어서 호스팅하는 과정 까지 이해가 되질 않았던 부분들을 해결했던 과정에 대한 정리이기도 하다. 세팅 환경은 Mac이지만, Windows도 크게 다르지 않다. ➬Front-end: React.js 사실 Next.js를 사용하는 것이 SEO 측면에서 훨씬 우수하지만, 이번 프로젝트에서는 작년 react-router-..