Vue3, Firebase 프로젝트 - 채팅앱 VSignal
12. Firebase Authentication란?
그랜파 개발자
2025. 4. 20. 02:48
Firebase Authentication
Firebase Authentication(파이어베이스 인증)은 웹 및 모바일 앱에서
사용자 인증을 쉽게 구현할 수 있도록 도와주는 서비스입니다.
서버 없이도 이메일 로그인, 소셜 로그인(Google, Facebook 등), 익명 로그인 등 다양한 인증 방법을 제공해요.
🔐 Firebase Authentication이 뭔데?
👉 사용자 인증(로그인/회원가입 등)을 쉽게 구현할 수 있게 해주는 서비스
Firebase가 모든 인증 로직을 알아서 처리해주고,
우리는 간단한 코드만 작성하면 끝!
✅ 주요 기능
기능설명
이메일/비밀번호 로그인 | 가장 기본적인 로그인 방식 |
소셜 로그인 | Google, Facebook, GitHub, Apple 등 |
전화번호 로그인 | SMS 인증 기반 |
익명 로그인 | 비회원 상태에서 앱 체험 가능 |
JWT 토큰 제공 | 다른 서비스와 연동 가능 |
사용자 관리 | Firebase 콘솔에서 직접 사용자 확인/관리 |
🧑💻 예시: 이메일 회원가입 + 로그인 (Vue 3 + Firebase)
import { auth } from "@/firebase";
import {
createUserWithEmailAndPassword,
signInWithEmailAndPassword,
} from "firebase/auth";
// 회원가입
const register = async (email: string, password: string) => {
const userCredential = await createUserWithEmailAndPassword(auth, email, password);
console.log("회원가입 성공:", userCredential.user);
};
// 로그인
const login = async (email: string, password: string) => {
const userCredential = await signInWithEmailAndPassword(auth, email, password);
console.log("로그인 성공:", userCredential.user);
};
🔐 로그인 후 상태 확인 (onAuthStateChanged)
import { onAuthStateChanged } from "firebase/auth";
onAuthStateChanged(auth, (user) => {
if (user) {
console.log("로그인됨:", user.email);
} else {
console.log("로그아웃됨");
}
});
🛡️ 보안도 자동으로?
✔ Firebase Authentication은 보안도 Google Cloud 수준으로 처리해줘요
✔ JWT 토큰 기반 인증으로 안전하게 사용자 상태 관리 가능
💡 요약하면?
장점설명
빠른 구현 | 몇 줄의 코드로 인증 구현 |
다양한 로그인 지원 | 이메일, 소셜, 전화번호 등 |
보안 | 강력한 Google 보안 시스템 기반 |
상태 관리 쉬움 | 로그인 상태 자동 감지 (onAuthStateChanged) |