개인 프로젝트
1.리액트 개인 토이프로젝트 Lazy Diary✏️
일기 쓰기가 귀찮은 사람들을 위한 이모지 일기오늘 하루의 기분을 표현할 수 있는 이모지를 선택하는 것만으로 일기 쓰기 완료!그 외에 기억하고 싶은 글이나 그림이 있다면 추가로 작성 가능로그인 및 회원가입일단은 이메일 기반으로 공부 예정이메일 로그인 방법이 어려우면 파베
2.[React + Vite + TS] 카카오 소셜 로그인 🔑
카카오 공식문서 너무 복잡해서 나중에 내가 보려고 작성함. 일단 나는 카카오 소셜 로그인 사용하고, JavaScript SDK 사용한다. 웹에서는 REST API도 사용할 수 있는데 솔직히 둘의 차이 뭔지 잘 모르겠다. 일단은 JavaScript SDK 사용한다.
3.[Firebase + React ]Uncaught (in promise) TypeError: n.indexOf is not a function 해결 방법
파이어베이스에서 특정 컬렉션의 모든 문서를 받아오는 getDocs 함수 사용하는 과정에서 해당 에러가 발생하였다.파이어베이스에서 문서를 읽을 때 컬렉션, 문서 등의 이름은 string 타입이어야하는데내가 사용하고 있는 userId = currentUser.id 라는 값
4.Firebase - Firestore 구글 콘솔에서만 접근 가능한 문제 해결 방법 (Datastore / Native mode)
구글 콘솔에 가면 코드 편집기 아이콘이 있다.구글 클라우드 쉘 이라고 부르는것같은데 암튼 해당 아이콘을 클릭하고,거기에서 아래 명령어를 복붙하면 datastore 모드였던 것이 native 모드로 변경되어 내가 기존에 알고 있던 데이터베이스 방식으로 돌아온다.datas
5.[Firebase + React ] Uncaught (in promise) FirebaseError: Missing or insufficient permissions. 해결 방법
firestore의 규칙이 false 로 되어있어서 안되어있던 것으로 파악된다.true 로 바꿔준 후에는 잘 작동했다.
6.[React] 이미지 눌러서 파일 업로드 & 이미지 미리보기 기능
일전에 패캠 JS과제로 이미지 업로드 및 미리보기 기능을 경험해봤지만당시에는 JS 지식이 부족했고 (물론 지금도 많이 부족함...)그냥 구글링으로 얻어낸 코드를 복붙하고 제대로 이해하지 못한 것 같아서이번 기회를 통해 코드 한줄 한줄에 대한 이해를 기반으로 파편화된 지
7.리액트 앱(SPA)를 외부 배포 플랫폼(vercel, netlify 등)을 통해 배포했을 때, 새로고침하면 404 페이지가 뜨는 문제 원인 및 해결방법
리액트 앱은 / 가 아닌 곳에서 새로고침을 하면 404 페이지가 뜬다.리액트는 SPA(Single Page Application)이므로 단 하나의 index.html을 가지고 라우팅 처리를 하는데 기본 경로 / 가 아닌 곳에서 새로고침을 하면 서버는 해당 경로의 리소스