반응형 공부/Flutter30 Flutter + Firebase Auth 로그인 구현｜이메일 비밀번호 인증 실습 Flutter 앱에서 사용자 로그인을 구현할 때가장 많이 사용되는 서비스 중 하나가 Firebase Authentication입니다.이메일/비밀번호 기반의 인증부터 소셜 로그인까지 확장 가능하죠.이번 글에서는 초보자를 위한Firebase Auth 기반의 기본 로그인 구현 방법을 차근차근 설명드릴게요.✅ 1. Firebase 프로젝트 생성https://console.firebase.google.com 접속새 프로젝트 생성‘앱 추가’ → Android 혹은 iOS 선택Android는 android/app/build.gradle의 applicationId를 패키지명으로 사용google-services.json 파일을 android/app 폴더에 넣기✅ 2. Firebase SDK 설정android/build... 2025. 7. 13. Flutter 자동 로그인 구현하기｜SharedPreferences로 로그인 유지 실습 로그인 기능이 있다면 꼭 필요한 기능!바로 **자동 로그인(로그인 유지)**입니다.Flutter에서는 SharedPreferences를 이용하면 간단하게앱을 다시 실행해도 로그인 정보를 저장할 수 있어요.이번 글에서는 기본 로그인 + SharedPreferences 연동으로자동 로그인 기능을 직접 구현해보겠습니다.✅ 1. shared_preferences 패키지 추가pubspec.yaml에 아래 내용 추가:dependencies: shared_preferences: ^2.2.0✅ 2. 로그인 성공 시 저장하기import 'package:shared_preferences/shared_preferences.dart';void _loginSuccess() async { final prefs = await .. 2025. 7. 13. Flutter 로그인 화면 만들기｜Provider로 상태 관리까지 실습 완전 정복 이번 글에서는 실제 앱 개발에서 가장 많이 쓰이는로그인 화면을 Flutter로 구현하고,입력값은 Provider를 활용해 상태 관리하는 실습 예제를 소개합니다.초보자도 따라할 수 있도록 UI부터 로직까지 하나씩 설명드릴게요!✅ 1. 준비 사항pubspec.yaml에 provider 패키지를 추가해 주세요.dependencies: flutter: sdk: flutter provider: ^6.1.0✅ 2. Form 모델 클래스 정의import 'package:flutter/material.dart';class LoginFormModel with ChangeNotifier { String email = ''; String password = ''; void updateEmail(String v.. 2025. 7. 13. Flutter 폼 상태 관리 방법｜Provider & Riverpod으로 유연하게 처리하기 TextFormField를 활용한 유효성 검사까진 좋았지만,입력값을 저장하거나 공유하려면 ‘상태 관리’가 꼭 필요합니다.이번 글에서는Provider로 입력값을 안전하게 상태로 관리하는 법Riverpod로 더 간결하게 다루는 방식까지초보자도 따라올 수 있도록 예제를 통해 설명해드릴게요.✅ 1. 왜 상태 관리가 필요할까?String? email;TextFormField( onSaved: (value) { email = value; },)이처럼 변수로 직접 값을 받으면 일시적이고,여러 위젯에서 공유하거나 상태를 반영하기 어렵습니다.이럴 때 Provider나 Riverpod을 쓰면 훨씬 명확하게 상태를 추적할 수 있어요.✅ 2. Provider로 폼 상태 관리하기 (ChangeNotifier)① pro.. 2025. 7. 12. Flutter TextFormField와 유효성 검사｜폼 입력 검증 완전 정복 로그인, 회원가입, 설문 등 사용자 입력이 필요한 앱에는**입력값 검증(Validation)**이 반드시 필요합니다.Flutter에서는 TextFormField와 Form 위젯을 활용해유효성 검사를 손쉽게 구현할 수 있어요.이번 글에서는 초보자도 따라할 수 있는TextFormField 사용법 + Form 유효성 검사 예제를 정리해볼게요.✅ 1. TextFormField와 TextField 차이TextField: 단일 입력 필드 (가벼운 사용)TextFormField: Form 위젯 내부에서 유효성 검사 가능즉, 입력값 검증을 원한다면 TextFormField를 써야 합니다.✅ 2. 기본 사용법 (with Form)final _formKey = GlobalKey();Form( key: _formKey, .. 2025. 7. 12. Flutter TextField 사용법｜입력값 받기부터 상태 관리까지 한 번에 배우기 앱에서 사용자 입력을 받는 기능은 필수입니다.Flutter에서는 이를 위해 TextField 위젯을 사용합니다.이번 글에서는 초보자도 이해하기 쉽게,텍스트 입력 받고 화면에 표시하는 법 + 상태 관리 방법까지 알려드릴게요.✅ 1. 기본 TextField 사용법가장 간단한 형태의 텍스트 필드입니다.TextField( decoration: InputDecoration( labelText: '이름을 입력하세요', ),)labelText: 입력창 위에 표시되는 안내 문구decoration: 꾸미는 용도, 없애면 기본 스타일✅ 2. 입력값 가져오기 – TextEditingController 사용입력된 텍스트를 코드로 가져오려면 TextEditingController를 사용해야 해요.final TextEd.. 2025. 7. 12. 이전 1 2 3 4 5 다음 반응형
