FlutterFlow 프로젝트에 인증을 추가하는 방법은 무엇인가요?

FlutterFlow 프로젝트에 인증을 추가하면 오직 인증된 개인만 액세스 할 수 있도록하여 앱의 보안성을 크게 향상시킬 수 있습니다. 이에 대한 종합 가이드는 다음과 같습니다:

1단계: Flutter Flow 프로젝트 생성

아직 생성하지 않았다면 새로운 FlutterFlow 프로젝트를 만듭니다. FlutterFlow 홈페이지에서 New Project 버튼을 클릭하세요. 프로젝트에 적합한 이름과 설명을 제공된 텍스트 상자에 입력하세요. Create 버튼을 클릭하면 새로운 프로젝트가 생성됩니다.

2단계: 네비게이션 사이드바로 이동하기

프로젝트가 에디터에서 열리면 화면 왼쪽에 있는 네비게이션 사이드바를 찾습니다. 사이드바 내에서 Authentication 버튼을 찾아 클릭하세요.

3단계: 인증 활성화

나타나는 패널에서 Enable Authentication 토글을 확인할 수 있습니다. 이 토글을 클릭해 활성화하세요. Sign Up, Log In, Forgot Password, Reset Password 등 이전에 비활성화된 필드가 활성화되는 것을 확인할 수 있습니다.

4단계: 인증 설정 구성

인증 과정을 원하는 대로 사용자 정의할 수 있습니다.

• Sign Up: 앱 사용자가 자체 로그인 자격 증명으로 가입하도록 하려면 Sign Up+ 필드를 클릭한 다음 나타나는 메서드 섹션에서 Email/Password를 선택하세요.
• Log In: Log In을 클릭하고 그 안에서 Email/Password 버튼을 켭니다.
• Forgot Password & Reset Password: 사용자가 비밀번호를 재설정할 수 있도록 하고 싶다면 Forgot Password을 클릭하고, Forgot Password의 액션 설정에서 비밀번호 재설정 페이지를 추가합니다. Reset Password에 대해 동일하게 수행하세요.

5단계: OAuth 제공자 추가하기

사용자가 OAuth 제공자 (Google, Facebook, Apple 등)를 사용하여 가입하거나 로그인하도록 하려면 이 부분에 추가하면 됩니다. + 버튼을 클릭한 다음 선택한 제공자를 선택하세요. 이러한 제공자의 경우, 해당 제공자와 함께 앱을 설정하고,의 Client ID와 Client Secret 또는 Key를 얻고, 이를 해당 제공자에 대한 제공된 입력 필드에 입력해야 합니다.

6단계: 변경 사항 저장

마지막 단계! 이제 모든 변경 사항을 저장해야 합니다. 그러려면 화면의 오른쪽 상단 모서리로 이동하여 Save Project 버튼을 클릭하세요.

추가 단계: 인증을 위해 UI 요소 추가

앱 내 실제 로그인 및 가입 흐름의 처리는 생성하는 페이지에서 Button 이나 TextButton 위젯을 통해 이루어집니다. 예를 들면:

• 로그인 페이지에서 Button Widget를 추가할 수 있습니다. 버튼을 클릭하여 편집하고 Actions 탭에서 Type 드롭다운 메뉴에서 Login with Email을 선택하세요. Step 4에서의 인증 설정에서 관련 파라미터를 입력하세요.
• 가입 페이지에서 Button 동작을 Create Account로 설정하세요. 오류 화면과 성공 화면을 설정하는 것을 잊지 마세요.
• 비밀번호 재설정도 비슷한 방식입니다. 사용자 입력 이메일 화면에 버튼 액션을 Send Password Reset Email로 설정하고 이후 페이지에서 Reset Password로 설정하세요.

모두 그것이에요! FlutterFlow 프로젝트에 성공적으로 인증을 추가했습니다. 프로젝트를 계속 개발하면서 이러한 동작과 화면을 앱의 모양과 느낌에 맞게 사용자 정의하고 오류 처리를 장착하는 것을 기억하세요. 행복한 FlutterFlow를 즐기세요!