jundyu 님의 블로그

지난 글에서 로그인/회원가입까지 알아보았습니다. 마지막으로 로그아웃 및 회원탈퇴하는 방법을 살펴보겠습니다.  [Firebase] Authentication으로 Email 로그인 구현하기 (2) - 로그인/회원가입이전 글에서 Email로 로그인/회원가입하기 위해 기본적인 설정하는 방법들을 알아봤습니다. 이전 포스트에 이어서 리액트와 Firebase의 Authentication으로 실제 로그인/회원가입하는 코드를 설명드리jundyu.tistory.com  로그아웃로그아웃은 아래의 코드가 끝입니다. 만약 Recoil 등으로 로그인 중인 사용자에 대한 상태 관리 전역 변수를 사용하고 있다면 함께 초기화 해줍니다.import { auth } from "../../firebase";import { signOut }..

이전 글에서 Email로 로그인/회원가입하기 위해 기본적인 설정하는 방법들을 알아봤습니다. 이전 포스트에 이어서 리액트와 Firebase의 Authentication으로 실제 로그인/회원가입하는 코드를 설명드리겠습니다.  [Firebase] Authentication으로 Email 로그인 구현하기 (1) - 기초들어가며Firebase에서 제공하는 인증 기능은 구현이 간편할뿐만 아니라 사용자 데이터 보호를 위한 보안 메커니즘이 적용되어 있습니다. 또한 확장성도 뛰어나서 개발 후 추가적인 로그인/회원가jundyu.tistory.com  회원가입먼저 회원가입 핸들러입니다.import React, { useState } from "react";import { auth } from "../../firebase";..

들어가며Firebase에서 제공하는 인증 기능은 구현이 간편할뿐만 아니라 사용자 데이터 보호를 위한 보안 메커니즘이 적용되어 있습니다. 또한 확장성도 뛰어나서 개발 후 추가적인 로그인/회원가입 기능을 구현할 수 있습니다.Authentication에서 제공하는 다양한 Provider 중에 저는 이메일과 구글로 로그인 하는 방법을 사용했습니다. Authentication의 메서드들을 이미 숙지하고 있다는 가정 하에 우선 이메일로 로그인하는 과정부터 설명하고 나중에 구글 로그인도 보여드리겠습니다.내용이 생각보다 길어서 이번 글에서는 Firebase의 console에서 제품을 선택하고, VS Code에서 어떤 설정이 필요한지 알려드리겠습니다. 프로젝트에서 사용한 기술 스택은 아래와 같습니다.Reactnpmvit..

파이어베이스란?이번에 리액트 프로젝트에서 UI/UX에 더 집중하기 위해 백엔드는 파이어베이스라는 백엔드 플랫폼으로 전부 구현하기로 했습니다. 간단하게 말하면 파이어베이스는 Google에서 제작한 모바일 & 웹 애플리케이션 개발용 플랫폼(BaaS : Backend as a Service)입니다. 파이어베이스를 사용하면 인증, DB, storage 등을 직접 구현하지 않아도 되기 때문에 프론트에 투자할 수 있는 시간을 더 늘릴 수 있습니다.파이어베이스의 주요 기능1. Firebase Authentication - 인증간편한 사용자 인증 기능을 제공해줍니다. google, facebook 등의 다양한 소셜 로그인 등을 지원해줍니다.2. Firestore - Cloud DB NoSQL 기반 클라우드 데이터베이스..

파이어스토어(Firestore)는 구글이 제공하는 NoSQL 클라우드 데이터베이스로, 실시간 데이터 동기화 및 대규모 데이터 처리에 적합합니다. 문서 기반 구조로 데이터를 컬렉션의 문서에 저장하며, 서버리스 환경에서 확장성과 성능이 뛰어납니다. Storage에 비해 확장성과 복잡한 쿼리에 강점이 있습니다.파이어스토어의 데이터베이스를 다룰 땐 컬렉션, 문서, 필드라는 용어를 사용하는데 이 용어들을 RDBMS와 비교하자면 각각 테이블, 레코드, 컬럼에 해당합니다. 예를 들어, 컬렉션은 users, posts 같은 테이블이 될 수 있고 문서는 각각의 사용자, 게시글 같은 행이 될 수 있습니다. 마지막으로 필드는 user_id, post_title 같은 컬럼에 해당합니다. 아래는 Firestore의 메서드를 정..