[Flutter] 스나이퍼팩토리 Flutter 중급과정 (11)

GONG·2023년 5월 7일

flutter 스나이퍼팩토리

스나이퍼팩토리 Flutter

목록 보기

37/44

32일차 과제 링크 👉 32일차 과제

Binding

뷰(View)와 컨트롤러(Controller) 사이의 연결을 설정하는 것
컨트롤러를 뷰에 연결하여 데이터를 전달하고 상태를 업데이트할 수 있음

사용 목적

의존성 주입(Dependency Injection)
바인딩은 컨트롤러 인스턴스를 뷰에 주입하는 역할을 함
→ 뷰에서 컨트롤러에 접근하고 컨트롤러의 메서드를 호출하거나 상태를 가져올 수 있다

상태 업데이트
컨트롤러의 상태가 변경될 때 뷰가 이를 감지하고 업데이트할 수 있음
→ 데이터의 양방향 바인딩을 구현하거나 상태 변화에 따라 UI를 업데이트하는 등의 작업을 수행할 수 있음

라우트 설정
바인딩은 특정 라우트나 페이지에 컨트롤러를 연결하는 데 사용될 수 있음
→ 이를 통해 해당 라우트나 페이지에 진입할 때 컨트롤러가 자동으로 생성되고 초기화될 수 있음

장점

라이프사이클 관리, 상태 관리, 의존성 주입 등을 편리하게 활용할 수 있음

코드의 가독성과 유지보수성을 향상시키는 데 도움을 줌

initialBinding

GetMaterialApp이 생성될 때 함께 생성할 Controller 정의 가능

initialBinding: BindingsBuilder(() {
	Get.put(LoginController());
	Get.put(MainController());
	Get.put(AuthController());
	...
})

GetPage에 묶어놓기

GetPage에 정의할 때 binding 걸어놓기

GetPage(
	name: LoginPage.route,
	page: () => const LoginPage(),
	binding: BindingsBuilder(() {
		Get.put(LoginController());
	}),
)

사용

initialBinding

main.dart

GetMaterialApp(
  initialBinding: BindingsBuilder(() {
    Get.put(LoginController());
  }),
  getPages: AppPages.pages,
  home: LoginPage(),
);

login_page

class LoginPage extends GetView<LoginController> {  // Stateless -> GetView<controller명>
	...
	TextField(
	  controller: controller.idController,  // Get.find 없이 바로 controller 사용 가능
	  decoration: InputDecoration(
	    hintText: 'ID'
	  ),
	),
	...
}

initialRoute

pages.dart

...
GetPage(
  name: AppRoutes.login,
  page: () => const LoginPage(),
  binding: BindingsBuilder(() {
    Get.put(LoginController());
  })
),
...

main.dart

GetMaterialApp(
  getPages: AppPages.pages,
  home: LoginPage(),
  initialRoute: LoginPage.route,
)

login_page

class LoginPage extends GetView<LoginController> {  // Stateless -> GetView<controller명>
	...
	TextField(
	  controller: controller.idController,  // Get.find 없이 바로 controller 사용 가능
	  decoration: InputDecoration(
	    hintText: 'ID'
	  ),
	),
	...
}

lazyPut

컨트롤러를 지연 생성하여 필요한 시점에 생성
이후 같은 컨트롤러에 대한 요청이 있을 때마다 이전에 생성된 인스턴스를 반환 → 필요한 시점에만 컨트롤러가 생성되어 메모리 사용을 최적화할 수 있다
```
initialBinding: BindingsBuilder(() {
  Get.lazyPut(() => LoginController());
}),
```

디자인 패턴

소프트웨어 개발에서 재사용 가능한 해결책을 제공하는 구조화된 접근 방식
주로 객체 지향 프로그래밍에서 사용됨

장점

개발자들 간의 의사소통과 코드의 가독성을 높이는 데 도움을 줌

소프트웨어 시스템 전체의 일관성을 유지할 수 있음

재사용 가능한 솔루션을 구축하여 개발 시간을 단축시킬 수 있음

MVC 패턴

애플리케이션의 구성 요소를 세 가지 역할로 나누어 관리하여 코드의 구조화, 유지 보수성, 확장성을 향상시키는 데 사용됨
모델과 뷰, 컨트롤러 사이의 분리로 코드를 더욱 모듈화하고, 각 역할에 집중할 수 있음
각 구성 요소의 역할이 명확하게 분리되어 있으므로 개발자들은 독립적으로 작업할 수 있음
변경이 발생할 때 다른 구성 요소에 영향을 덜 주면서 수정과 확장이 용이함

Model-View-Controller

Model
데이터와 비즈니스 로직을 담당
→ 애플리케이션의 상태와 데이터를 표현하고, 이를 조작하고 처리하는 책임을 가짐

View
사용자 인터페이스(UI)를 표현
→ 모델의 데이터를 시각적으로 표현하고 사용자 입력을 받아 컨트롤러로 전달
→ 주로 화면에 표시되는 요소들을 구성하고, 사용자와의 상호작용을 처리함

Controller
모델과 뷰를 연결하고 상호작용을 조정
→ 사용자 입력을 받아 모델을 업데이트하고, 모델의 변화를 뷰에 반영
→ 비즈니스 로직을 처리하고 애플리케이션의 흐름을 제어

Singleton 패턴

클래스의 인스턴스를 오직 하나만 생성하고 전역적으로 접근할 수 있도록 하는 패턴
전역 변수의 사용을 최소화하고, 여러 곳에서 동시에 같은 인스턴스에 접근할 수 있는 단일 지점을 제공
주로 리소스 관리, 로깅, 데이터베이스 연결 등의 상황에서 사용됨

특징

하나의 인스턴스
싱글톤 클래스는 오직 하나의 인스턴스만을 생성
→ 인스턴스는 클래스 내부에서 관리되며, 외부에서는 직접 생성할 수 없음

전역적인 접근
싱글톤 인스턴스는 전역적으로 접근 가능함
→ 다른 클래스나 모듈에서 인스턴스에 접근할 수 있으며 동시에 같은 인스턴스에 접근할 수 있음

지연된 초기화
싱글톤 인스턴스는 필요한 시점에서 생성됨
→ 처음 사용되기 전까지는 인스턴스가 생성되지 않음
→ 자원의 낭비를 방지할 수 있음

예시 코드

class Singleton {
  static Singleton _instance;

  // private 생성자
  Singleton._();

  factory Singleton.getInstance() {
    if (_instance == null) {
      _instance = Singleton._();
    }
    return _instance;
  }

  // 싱글톤 인스턴스의 기능과 데이터
}