#문제 ▶ 이미지를 첨부하고 [등록하기] 버튼을 누르면 fireStorage에 사진을 저장 & FireStore DB에 url 저장 기능 구현을 하고 싶은데 FireStore DB에 image_url이 저장되기 전에, 동기 부분이 완료되서 image_url 저장이 안됨. #해결 ▶ FireStore에 데이터가 저장되기 전에 이미지 파일 업로드가 우선 실행되도록 위치로 조정 ▶ 이미지 저장이 끝나고 FireStore에 데이터 저장되도록 async + await 코드로 수정 [Inputform.jsx] //이미지 파일 업로드 const handleUpload = async () => { const imageRef = ref(storage, `${auth.currentUser.uid}/${selectedFil..

▼(회원가입 기능 구현) ▼ #03 React 프로젝트에서 Firebase 사용하기 : Authentication (회원가입 기능 구현) ▼ 2023.11.21 - [Database] - #02 React 프로젝트에서 Firebase 환경 설정하기 ▼ #02 React 프로젝트에서 Firebase 환경 설정하기 2023.11.21 - [Database] - FireBase 주요 서비스 기능 (Authentication , Firestore , Storage ) FireBas zerotonine2da.tistory.com (1) 기존 사용자 로그인 [App.js] import { useEffect, useState } from 'react'; import { auth } from './firebase'; ..

▼ Firebase 환경 설정하기 ▼ #02 React 프로젝트에서 Firebase 환경 설정하기 2023.11.21 - [Database] - FireBase 주요 서비스 기능 (Authentication , Firestore , Storage ) FireBase 주요 서비스 기능 (Authentication , Firestore , Storage ) 1. FireBase 개념 (1) 구글이 제공하는 서버리스(serverless) 플랫폼 ▶ zerotonine2da.tistory.com ▼파이어베이스 API 라이브러리 참고 자료 (사용법): 외우지 말고 찾아서 사용하기! ▼ JavaScript 프로젝트에 Firebase 추가 의견 보내기 JavaScript 프로젝트에 Firebase 추가 컬렉션을 사용..

1. FireBase 개념 (1) 구글이 제공하는 서버리스(serverless) 플랫폼 ▶ 서버리스 : Firebase가 웹 서버 개발에 필요한 인프라 제공 => 개발자는 서버 관리 안해도 됨! : 서버 있음! : [사용 이유] 백엔드의 지식없이도 웹 서비스 출시 가능 (2) BaaS (Backend as a Service) : 백엔드 부분을 서비스로 사용하기! : 로그인, 스토리지 등 API형태로 사용 가능 (3) FireBase 주요 서비스 ▶ Authentication : 사용자인증 (회원가입 + 로그인 ) => 이메일, 패스워드 로그인 + 구글 로그인 쉽게 가능 ▶ Firestore : NoSQL DB / 자바스크립트 객체와 유사하여 사용하기 편리 ▶ Storage : 파일 업로드 & 다운로드 (..