복습할겸 다시한번 진행해봅니다.

    
import flet as ft

def main(page: ft.Page):
  page.add(
    ft.Text("이메일")
  )

ft.app(main)
    
  

이전처럼 기본 구문을 만들어서 실행부터 해봅니다.

    
page.add(
  ft.Text("이메일"),
  ft.Text("패스워드"),
  ft.Text("패스워드확인"),
  ft.TextButton(text="회원가입"),
  ft.TextButton(text="로그인"),
)
    
  

페이지에 사용될 기본컨트롤을 배치합니다.

    
def main(page: ft.Page):
  email = ft.TextField()
  password = ft.TextField(password=True, can_reveal_password=True)
  password_check = ft.TextField(password=True, can_reveal_password=True)

page.add(
  ft.Text("이메일"),
  email,    
  ft.Text("패스워드"),
  password,
  ft.Text("패스워드확인"),
  password_check,
  ft.TextButton(text="회원가입"),
  ft.TextButton(text="로그인"),
)
    
  

입력필드를 추가합니다.

패스워드 관련해서는 기본적으로 내용을 알수없게 password 옵션을 주고

필요시 입력값을 확인할수있도록 can_reveal_password 옵션을 추가합니다.

추가한 입력필드를 페이지에 추가합니다.

실행하여 컨트롤 배치를 확인해봅니다.

    
def main(page: ft.Page):
  def open_snackbar(message: str):
    page.snack_bar = ft.SnackBar(ft.Text(message))
    page.snack_bar.open = True
    page.update()
    
  

snackbar를 사용하기 위한 함수를 추가합니다.

작성한 코드가 정상정으로 이루어지지 않았을때

snackbar를 호출하여 시각적으로 확인합니다.

    

def main(page: ft.Page):
  def signup_request(_):
    try:
      if not email.value or not password.value or not password_check.value:
          open_snackbar("이메일, 패스워드, 패스워드확인란을 입력해주세요.")
          return
    except Exception as e:
      print({e})
      open_snackbar(f"오류 발생: {e}") 

    
  

회원가입 버튼에서 사용할 signup_request 함수를 만들어줍니다.

on_click이벤트를 이용함으로 이벤트자체인 e를 넘기나

실직적으로는 사용하지 않으니 (_)으로 사용하지 않음을 명시합니다.

try문을 이용하여 예외사항이 있을때 터미널과 snackbar에서 확인할 수 있도록 하고

입력필드들의 값이 전부 입력하도록 조건을 만듭니다.

조건을 만족하지 않으면 snackbar로 알려주고

return을 이용하여 해당 위치에서 로직이 멈추도록합니다.

    
  
models.py

from pydantic import BaseModel, EmailStr

class EmailModel(BaseModel):
    email: EmailStr


main.py

from models import EmailModel

  def main(page: ft.Page):
    def signup_request(_):
      try:
        if password.value != password_check.value:
            open_snackbar("패스워드가 일치하지 않습니다.")
            return

        if len(password.value) < 6:
            open_snackbar("패스워드는 6자리 이상이어야 합니다.")
            return
                
        try:
          emailmodel = EmailModel(email=email.value)
        except ValidationError as e:
          open_snackbar("이메일형식으로 입력해주세요.")
          return
  
    
  

그 외 필요한 조건들을 고려해서 작성해봅니다.

패스워드 일치여부를 롹인하지 않고 한번만 기입후 가입한다면

실수할경우 해당 패스워드가 틀릴확률도 높아집니다.

보안을 위한 패스워드 규칙등도 추가해야합ㅇ니다.

이메일형태의 ID를 고려하였다면 그 규칙이 잘지켜지도록 유도해야합니다.

재사용과 검증을 위해 pydantic을 이용한 models.py파일을 만들고

해당 파일에 불러와서 사용해봅니다.

유지보수 및 재사용이 용이하도록 가능한것들은 만들어서 사용합니다.

    
  
config.py

import os
from dotenv import load_dotenv
from supabase import create_client, Client

load_dotenv()

SUPABASE_URL: str = os.getenv('SUPABASE_URL')
SUPABASE_KEY: str = os.getenv('SUPABASE_KEY')
supabase: Client = create_client(SUPABASE_URL, SUPABASE_KEY)


main.py

from config import supabase

  def main(page: ft.Page):
    def signup_request(_):
      try:
        response = supabase.auth.sign_up(
            {"email": emailmodel.email, "password": password.value}
        )
        open_snackbar(f"{response.user.email} 회원가입에 성공하였습니다.")

  page.add(
    ft.TextButton(text="회원가입", on_click=signup_request),
  )
  
    
  

config피일도 만들어서 재사용할 수 있도록 해봅니다.

supabase.auth.sign_up을 이용하여 회원가입을 진행합니다.

정상적으로 진행되었다면 snackbar를 확인할 수 있습니다.

    
  
def main(page: ft.Page):
    
  def signin_request(_):     
    try:
      if not email.value or not password.value:
          open_snackbar("이메일, 패스워드를 입력해주세요.")
          return

      if len(password.value) < 6:
          open_snackbar("패스워드는 6자리 이상이어야 합니다.")
          return
              
      try:
        emailmodel = EmailModel(email=email.value)
      except ValidationError as e:
        open_snackbar("이메일형식으로 입력해주세요.")
        return

      response = supabase.auth.sign_in_with_password(
          {"email": emailmodel.email, "password": password.value}
      )
      open_snackbar(f"{response.user.email} 로그인에 성공하였습니다.")
    except Exception as e:
        print({e})
        open_snackbar(f"오류 발생: {e}") 

  page.add(
    ft.TextButton(text="로그인", on_click=signin_request),
  )
  
    
  

로그인버튼은 앞선 회원가입의 반복입니다.

supabase.auth.sign_in_with_password을 이용하기위해

필요한 조건들을 추가하고 실행해봅니다.