반응형
GetX란 무엇인가?
Flutter를 사용하다 보면 애플리케이션의 복잡도가 높아질수록 상태 관리, 라우팅, 의존성 주입이라는 3가지 과제를 만나게 됩니다. 특히 앱이 점점 커지면서 여러 개의 위젯에서 동일한 데이터를 공유하거나, 페이지 간 데이터 전달이 복잡해질 때, 기존의 Provider나 setState() 방식만으로는 한계를 느끼게 되죠.
이럴 때 등장한 것이 GetX입니다. GetX는 Flutter에서 상태 관리, 라우팅, 의존성 주입을 하나의 패키지로 간편하게 해결할 수 있도록 도와주는 종합 솔루션입니다.
1. GetX의 철학
- 간결성 (Simplicity): 최소한의 코드로 최대한의 기능 구현
- 성능 (Performance): 위젯 트리에 영향을 거의 주지 않아 빠른 반응 속도
- 반응형 프로그래밍 (Reactivity): 상태 변화에 따른 자동 UI 반영
2. GetX의 주요 기능
1. 상태 관리 (State Management)
GetX는 2가지 방식의 상태 관리를 지원합니다.
- 반응형 상태 관리 (Reactive State Management)
- .obs를 이용해 값을 옵저버블로 만들고, Obx()로 UI를 감싸 자동으로 업데이트
- 단순 상태 관리 (Simple State Management)
- GetBuilder()를 사용해 특정 컨트롤러의 업데이트 시에만 UI 리빌드
2. 의존성 주입 (Dependency Injection)
- Get.put()으로 객체를 전역으로 등록하고,
- Get.find()로 어디서든 인스턴스 접근 가능
- 메모리 누수를 방지하고, Controller 생명주기 관리까지 가능
3. 라우팅 (Routing)
- Navigator.push()보다 훨씬 간결한 코드로 페이지 이동 가능
- Named routing, argument 전달, middlewares, transition animation 등도 쉽게 구현 가능
3. GetX vs Provider: 무엇이 다른가?
항목 Provider GetX
| 상태 선언 방식 | ChangeNotifier | .obs, Rx<Type> |
| UI 갱신 | notifyListeners() 필요 | 값만 바꾸면 자동 반영 |
| DI(의존성 주입) | context 필요 | context 없이 전역 접근 |
| 라우팅 지원 | 별도 패키지 필요 | 내장 기능 제공 |
| 코드량 | 다소 많음 | 매우 간결 |
실습: GetX로 카운터 앱 만들기
목표
- 카운터 값을 +1 증가시키는 UI 만들기
- 상태 관리, DI, UI 반영 과정을 GetX 방식으로 구현
1. pubspec.yaml에 의존성 추가
dependencies:
flutter:
sdk: flutter
get: ^4.6.5
2. CounterController 작성
import 'package:get/get.dart';
class CounterController extends GetxController {
RxInt count = 0.obs;
void increment() {
count.value++;
}
}
- RxInt: int 타입을 리액티브로 만듭니다.
- .obs: 옵저버블 객체로 변환
- count.value: 실제 값에 접근하고 수정할 때 사용
3. 메인 함수 및 앱 진입점 설정
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'counter_controller.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return GetMaterialApp(
title: 'GetX Counter App',
home: CounterPage(),
);
}
}
- GetMaterialApp: GetX 기능을 사용하려면 반드시 필요함
4. CounterPage UI 구현
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'counter_controller.dart';
class CounterPage extends StatelessWidget {
// 의존성 주입: 컨트롤러를 메모리에 등록
final CounterController controller = Get.put(CounterController());
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('GetX Counter')),
body: Center(
child: Obx(() => Text(
'현재 값: ${controller.count.value}',
style: TextStyle(fontSize: 30),
)),
),
floatingActionButton: FloatingActionButton(
onPressed: controller.increment,
child: Icon(Icons.add),
),
);
}
}
- Obx: 상태가 변경되면 자동으로 다시 빌드되는 위젯
- controller.increment(): GetX 컨트롤러 메서드 호출
정리 및 결론
GetX는 단순히 상태 관리 패키지가 아닙니다. 의존성 주입, 라우팅, 전역 상태 관리, 그리고 높은 성능을 갖춘 완전한 아키텍처 솔루션입니다.
초보자에게도 친절하며, 복잡한 앱 구조에서도 유연하게 사용할 수 있는 GetX는 Flutter에서 가장 인기 있는 패키지 중 하나입니다.
다음 주제 제안
- GetBuilder vs Obx vs GetX 차이점 비교
- Bindings를 통한 Controller 초기화 관리
- GetStorage를 통한 로컬 상태 저장
- 중복된 상태 관리 Controller 재사용 전략
- GetX에서의 테스트 코드 작성 방법
반응형