[개발하는남자 핸즈온 플러터] 챕터12 최신화 및 회원가입 시 Get.create를 사용한 이유

개요

안녕하세요, 개발하는남자 개남입니다. 지난 포스트에 이어서 핸즈온 플러터 챕터 12장을 리뷰하겠습니다. 이번 장에서는 크게 다룰 만한 내용은 없고 최신화 정도로 리뷰를 하면 될 것 같습니다. 책의 내용을 생각보다 잘 정리했다고 생각됩니다. 다만, 후반부 회원가입 관련에서 소스코드를 만들 때 Get.put으로 사용하지 않고 Get.create를 사용한 이유에 대한 내용이 빈약하여 해당 부분을 좀 더 다루고 넘어가도록 하겠습니다.

소스코드 : https://github.com/sudar-life/bamtol_market_clone_coding
브런치 정보 : chapter12
플러터 버전 : Flutter 3.32.5
Dart 버전 : Dart 3.8.1

최신화

pubspec.yaml 파일

google_sign_in: ^6.1.0
sign_in_with_apple: ^6.1.4
crypto: ^3.0.3

이번 장에서 사용될 sns 로그인에서 구글 로그인과 애플 로그인을 진행합니다. 이때 필요한 라이브러리 버전을 최신화에 맞춰 업데이트했습니다.

Info.plist 파일

기존 google_sign_in에서는 Info.plist 파일에 수정할 부분 없이 진행했지만, 최신 버전 google_sign_in에서는 Info.plist 파일에 GIDClientID 값을 추가하고 해당하는 값을 추가해야 한다는 iOS integration 사항이 추가되었습니다.

iOS integration에 대한 최신화 문서를 확인하는 게 좋지만, 개발을 하다 보면 그냥 버전만 최신화로 올리고 개발을 진행하는 경우가 있습니다. 이럴 경우 문제가 발생하고 로그로 문제를 확인할 수 있습니다. No active configuration. Make sure GIDClientID is set in Info.plist. 명확하게 가이드하고 있습니다.

google_sign_in에서 제공되는 문서를 살펴보면

여기에 입력되어야 할 값은 주석에 나와 있는 것처럼 GoogleService-Info.plist의 CLIENT_ID 값을 넣어주면 됩니다.

SplashPage의 GetxListener 수정

이전 장에서 SplashPage는 페이지 이동되면서 종료되기 때문에 AuthenticationController의 상태 관리는 SplashPage에서 제거하고 그 상위 위젯인 main.dart 파일의 MyApp 위젯에 옮겨왔었습니다. chapter12에서 여전히 SplashPage에서 AuthenticationController를 사용하고 있기 때문에 해당 소스코드를 MyApp의 builder로 옮겨줍니다.

builder: (context, child) {
  return GetxListener<AuthenticationStatus>(
    listen: (AuthenticationStatus status) async {
      switch (status) {
        case AuthenticationStatus.authentication:
          Get.offNamed('/home');
          break;
        case AuthenticationStatus.unAuthenticated:
          var userModel =
              Get.find<AuthenticationController>().userModel.value;
          await Get.offNamed('/signup/${userModel.uid}');
          Get.find<AuthenticationController>().reload();
          break;
        case AuthenticationStatus.unknown:
          Get.offNamed('/login');
          break;
        case AuthenticationStatus.init:
          break;
      }
    },
    stream: Get.find<AuthenticationController>().status,
    child: child ?? const SizedBox.shrink(),
  );
},

SignUp 페이지에서 GetxController를 Get.put이 아닌 Get.create를 사용한 이유

이유를 살펴보기 전에 Get.put과 Get.create에 대해서 간략하게 다루고 이유를 설명드리겠습니다.

Get.put / Get.lazyPut

Get.put<SignupController>(() => SignupController(...));
// 또는
Get.lazyPut<SignupController>(() => SignupController(...));

• 싱글톤 패턴: 한 번 생성되면 앱이 종료될 때까지 같은 인스턴스를 재사용
• 메모리에 계속 유지됨

Get.create

Get.create<SignupController>(() => SignupController(...));

• 팩토리 패턴: 매번 새로운 인스턴스를 생성
• 페이지를 벗어나면 자동으로 메모리에서 해제됨

SignupPage에서 Get.create를 사용한 이유

GetPage(
  name: '/signup/:uid',
  page: () => const SignupPage(),
  binding: BindingsBuilder(
    () {
      Get.create<SignupController>(
        () => SignupController(Get.find<UserRepository>(),
            Get.parameters['uid'] as String),
      );
    },
  ),
)

1. 동적 파라미터 처리

• URL에서 uid 파라미터를 받아와서 컨트롤러 생성자에 전달
• 각각 다른 uid로 회원가입 페이지에 접근할 때마다 새로운 컨트롤러가 필요

2. 메모리 효율성

• 회원가입은 일회성 작업이므로 페이지를 벗어나면 컨트롤러가 필요 없음
• 자동으로 메모리에서 해제되어 메모리 누수 방지

3. 상태 초기화

• 매번 새로운 인스턴스로 시작하므로 이전 회원가입 시도의 상태가 남아있지 않음
• 깨끗한 상태로 시작 가능

4. 다중 사용자 시나리오

• 여러 사용자가 동시에 회원가입을 진행할 수 있는 상황 대비
• 각각 독립적인 컨트롤러 인스턴스 보장