Search

GetX

GetX

: Flutter ์ƒํƒœ๊ด€๋ฆฌ, ๋ผ์šฐํŒ…, ์˜์กด์„ฑ ์ฃผ์ž… ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ
GetX๋Š” Flutter์—์„œ ์ƒํƒœ๊ด€๋ฆฌ, ๋ผ์šฐํŒ…, ์˜์กด์„ฑ ์ฃผ์ž…(DI) ์„ ํ•œ ๋ฒˆ์— ํ•ด๊ฒฐํ•  ์ˆ˜ ์žˆ๋Š” ๊ฐ•๋ ฅํ•˜๊ณ  ๊ฐ€๋ฒผ์šด ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์ž…๋‹ˆ๋‹ค.

GetX์˜ ์ฃผ์š” ํŠน์ง•

๊ฐ„๋‹จํ•œ ์ƒํƒœ๊ด€๋ฆฌ โ†’ obs(Observable) ๋ณ€์ˆ˜๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ƒํƒœ ์ž๋™ ์—…๋ฐ์ดํŠธ
๋น ๋ฅธ ์„ฑ๋Šฅ โ†’ ์ตœ์†Œํ•œ์˜ ๋ฆฌ์†Œ์Šค๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ตœ์ ํ™”๋จ
๋ผ์šฐํŒ… ๊ด€๋ฆฌ โ†’ Get.to(), Get.off()๋กœ ๊ฐ„ํŽธํ•˜๊ฒŒ ํ™”๋ฉด ์ด๋™
์˜์กด์„ฑ ์ฃผ์ž…(DI) โ†’ Get.put(), Get.find()๋กœ ๊ฐ์ฒด๋ฅผ ์‰ฝ๊ฒŒ ์ฃผ์ž…
๋ณ„๋„์˜ context ๋ถˆํ•„์š” โ†’ BuildContext ์—†์ด UI ์—…๋ฐ์ดํŠธ ๊ฐ€๋Šฅ
๋‹ค์–‘ํ•œ ํ”Œ๋žซํผ ์ง€์› โ†’ ๋ชจ๋ฐ”์ผ, ์›น, ๋ฐ์Šคํฌํ†ฑ๊นŒ์ง€ ์ง€์›

GetX ์„ค์น˜

flutter pub add get
Shell
๋ณต์‚ฌ
๋˜๋Š”
dependencies: get: latest_version
YAML
๋ณต์‚ฌ

GetX ์ƒํƒœ๊ด€๋ฆฌ ์‚ฌ์šฉ๋ฒ•

๊ฐ„๋‹จํ•œ ์ƒํƒœ๊ด€๋ฆฌ (obs ์‚ฌ์šฉ)

import 'package:flutter/material.dart'; import 'package:get/get.dart'; class CounterController extends GetxController { var count = 0.obs; // Observable ๋ณ€์ˆ˜ void increment() => count++; } void main() { runApp(GetMaterialApp(home: CounterScreen())); // GetMaterialApp ์‚ฌ์šฉ } class CounterScreen extends StatelessWidget { final CounterController controller = Get.put(CounterController()); // ์˜์กด์„ฑ ์ฃผ์ž… Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: Text('GetX Counter')), body: Center( child: Obx(() => Text('Count: ${controller.count}', style: TextStyle(fontSize: 24))), ), floatingActionButton: FloatingActionButton( onPressed: controller.increment, child: Icon(Icons.add), ), ); } }
Dart
๋ณต์‚ฌ
obs๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ƒํƒœ๋ฅผ ๊ฐ์ง€ํ•˜๊ณ , Obx ์œ„์ ฏ์„ ์‚ฌ์šฉํ•˜์—ฌ UI ์ž๋™ ์—…๋ฐ์ดํŠธ!
Get.put()์œผ๋กœ Controller๋ฅผ ์ „์—ญ์—์„œ ๊ด€๋ฆฌ

GetBuilder ์‚ฌ์šฉ (์„ฑ๋Šฅ ์ตœ์ ํ™” ๊ฐ€๋Šฅ)

class CounterController extends GetxController { int count = 0; void increment() { count++; update(); // UI ์—…๋ฐ์ดํŠธ } } class CounterScreen extends StatelessWidget { Widget build(BuildContext context) { return GetBuilder<CounterController>( init: CounterController(), builder: (controller) => Scaffold( body: Center(child: Text('Count: ${controller.count}')), floatingActionButton: FloatingActionButton( onPressed: controller.increment, child: Icon(Icons.add), ), ), ); } }
Dart
๋ณต์‚ฌ
GetBuilder๋Š” ํ•„์š”ํ•œ ์œ„์ ฏ๋งŒ ๋ฆฌ๋ Œ๋”๋ง ํ•˜๋ฏ€๋กœ ์„ฑ๋Šฅ ์ตœ์ ํ™” ๊ฐ€๋Šฅ!
Obx์™€ ๋น„๊ตํ–ˆ์„ ๋•Œ, ๋” ์ ์€ ๋ฆฌ์†Œ์Šค๋ฅผ ์‚ฌ์šฉํ•˜๋ฏ€๋กœ ์ตœ์ ํ™”๊ฐ€ ํ•„์š”ํ•  ๋•Œ ์‚ฌ์šฉ

GetX ๋ผ์šฐํŒ… (ํŽ˜์ด์ง€ ์ด๋™)

GetX ๋ผ์šฐํŒ… ์„ค์ •

void main() { runApp(GetMaterialApp( initialRoute: '/', getPages: [ GetPage(name: '/', page: () => HomeScreen()), GetPage(name: '/second', page: () => SecondScreen()), ], )); }
Dart
๋ณต์‚ฌ

ํŽ˜์ด์ง€ ์ด๋™ (Get.to(), Get.off())

class HomeScreen extends StatelessWidget { Widget build(BuildContext context) { return Scaffold( body: Center(child: ElevatedButton( onPressed: () => Get.to(SecondScreen()), // ๋‹ค์Œ ํŽ˜์ด์ง€๋กœ ์ด๋™ child: Text('Go to Second Page'), )), ); } } class SecondScreen extends StatelessWidget { Widget build(BuildContext context) { return Scaffold( body: Center(child: ElevatedButton( onPressed: () => Get.off(HomeScreen()), // ๋’ค๋กœ๊ฐ€๊ธฐ ์—†์ด ์ด๋™ child: Text('Back to Home'), )), ); } }
Dart
๋ณต์‚ฌ
Get.to(NextScreen()) โ†’ ์ƒˆ๋กœ์šด ํŽ˜์ด์ง€๋กœ ์ด๋™
Get.off(NextScreen()) โ†’ ํ˜„์žฌ ํŽ˜์ด์ง€๋ฅผ ์ œ๊ฑฐํ•˜๊ณ  ์ด๋™
Get.offAll(NextScreen()) โ†’ ๋ชจ๋“  ์ด์ „ ํŽ˜์ด์ง€ ์ œ๊ฑฐ ํ›„ ์ด๋™

GetX ์˜์กด์„ฑ ์ฃผ์ž… (DI)

์ฆ‰์‹œ ์ฃผ์ž… (Get.put())

final CounterController controller = Get.put(CounterController());
Dart
๋ณต์‚ฌ
โ€ข
์•ฑ์ด ์‹คํ–‰๋˜๋ฉด ๊ฐ์ฒด๊ฐ€ ๋ฉ”๋ชจ๋ฆฌ์— ์ฆ‰์‹œ ์ƒ์„ฑ๋จ

์ง€์—ฐ ์ฃผ์ž… (Get.lazyPut())

Get.lazyPut<CounterController>(() => CounterController());
Dart
๋ณต์‚ฌ
โ€ข
ํ•„์š”ํ•  ๋•Œ๋งŒ ๊ฐ์ฒด ์ƒ์„ฑ (๋ฉ”๋ชจ๋ฆฌ ์ ˆ์•ฝ)

์˜๊ตฌ์ ์ธ ๊ฐ์ฒด (Get.putAsync())

Get.putAsync<CounterController>(() async => CounterController());
Dart
๋ณต์‚ฌ
โ€ข
๋น„๋™๊ธฐ ์ดˆ๊ธฐํ™”๊ฐ€ ํ•„์š”ํ•œ ๊ฒฝ์šฐ ์‚ฌ์šฉ

GetX vs Bloc vs Provider vs Riverpod ๋น„๊ต

๊ธฐ๋Šฅ
GetX
Bloc
Provider
Riverpod
์ƒํƒœ ๊ด€๋ฆฌ
๊ฐ„ํŽธํ•จ (obs, GetBuilder)
๊ตฌ์กฐ์  (Cubit, Bloc)
๊ธฐ๋ณธ (ChangeNotifier)
๊ฐ•๋ ฅํ•จ (StateNotifier, Notifier)
๋น„๋™๊ธฐ ์ƒํƒœ ๊ด€๋ฆฌ
RxDart ์—†์ด ๊ฐ€๋Šฅ (FutureBuilder ์—†์ด๋„ ๊ฐ€๋Šฅ)
BlocObserver, Cubit ๋“ฑ ์ง€์›
๊ธฐ๋ณธ์ ์œผ๋กœ ์ง€์› X (FutureBuilder ์‚ฌ์šฉํ•ด์•ผ ํ•จ)
FutureProvider, AsyncNotifier ์ œ๊ณต
์˜์กด์„ฑ ์ฃผ์ž… (DI)
Get.put(), Get.find()
RepositoryProvider, MultiBlocProvider
DI ๊ธฐ๋ณธ ์ง€์› ์—†์Œ (Provider ์ง์ ‘ ์ฃผ์ž…)
Provider ๊ธฐ๋ฐ˜ DI ์‚ฌ์šฉ (ref.read(), ref.watch())
๋ผ์šฐํŒ… ๊ด€๋ฆฌ
Get.to(), Get.off()
์—†์Œ
์—†์Œ
์—†์Œ
์ „์—ญ ์ƒํƒœ ๊ด€๋ฆฌ
Get.put()์œผ๋กœ ์‰ฝ๊ฒŒ ๊ฐ€๋Šฅ
๊ฐ€๋Šฅ (BlocProvider)
๊ฐ€๋Šฅ (MultiProvider)
ProviderScope ์‚ฌ์šฉ
๋ฐ˜์‘ํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์ง€์›
๊ฐ€๋Šฅ (RxDart ์—†์ด๋„ ๋ฐ˜์‘ํ˜• ๊ฐ€๋Šฅ)
๊ฐ•๋ ฅํ•œ ์ด๋ฒคํŠธ ๊ธฐ๋ฐ˜
์ œํ•œ์ 
๊ฐ€๋Šฅ (watch(), listen())
์ฝ”๋“œ ๋ณต์žก๋„
์‰ฌ์›€ (๋ณด์ผ๋Ÿฌํ”Œ๋ ˆ์ดํŠธ ์ ์Œ)
๊ฐ€์žฅ ๋ณต์žกํ•จ
๋ณด์ผ๋Ÿฌํ”Œ๋ ˆ์ดํŠธ ๋งŽ์Œ
๋น„๊ต์  ๋ณต์žกํ•จ
์„ฑ๋Šฅ ์ตœ์ ํ™”
์šฐ์ˆ˜ (GetBuilder ์‚ฌ์šฉ ๊ฐ€๋Šฅ)
์šฐ์ˆ˜ (BlocListener, BlocObserver)
๋น„๊ต์  ๋‚ฎ์Œ
์šฐ์ˆ˜ (watch(), read())
๋ฉ”๋ชจ๋ฆฌ ํšจ์œจ์„ฑ
๋†’์€ ์„ฑ๋Šฅ (Get.lazyPut() ์ง€์›)
์ด๋ฒคํŠธ ๋‹จ์œ„๋กœ ์ƒํƒœ ์œ ์ง€
ํ•ญ์ƒ ์ธ์Šคํ„ด์Šค ์œ ์ง€
ํ•„์š”ํ•  ๋•Œ๋งŒ ์ดˆ๊ธฐํ™” (lazy initialization)
ํ…Œ์ŠคํŠธ ์šฉ์ด์„ฑ
์ƒ๋Œ€์ ์œผ๋กœ ๋ถ€์กฑ
๊ฐ€์žฅ ์šฐ์ˆ˜
๋น„๊ต์  ์‰ฌ์›€
๋งค์šฐ ์šฐ์ˆ˜
์•ฑ ํฌ๊ธฐ ์˜ํ–ฅ
๊ฐ€์žฅ ๊ฐ€๋ฒผ์›€
๊ฐ€์žฅ ๋ฌด๊ฑฐ์›€
์ƒ๋Œ€์ ์œผ๋กœ ๋ฌด๊ฑฐ์›€
๊ฐ€๋ฒผ์›€
Flutter ๊ณต์‹ ์ง€์›
๋น„๊ณต์‹
Flutter ํŒ€ ๊ณต์‹ ์ง€์›
๊ณต์‹ ํŒจํ‚ค์ง€
๊ณต์‹ ํŒจํ‚ค์ง€
๋Œ€๊ทœ๋ชจ ์•ฑ ์ ํ•ฉ์„ฑ
์ž‘์€ ์•ฑ์— ์ ํ•ฉ
๋Œ€๊ทœ๋ชจ ์•ฑ์— ๊ฐ€์žฅ ์ ํ•ฉ
๊ฐ€๋Šฅ
์ค‘ยท๋Œ€๊ทœ๋ชจ ์•ฑ ๊ฐ€๋Šฅ

GetX๋ฅผ ์‚ฌ์šฉํ•ด์•ผ ํ•˜๋Š” ๊ฒฝ์šฐ

์ƒํƒœ๊ด€๋ฆฌ + ๋ผ์šฐํŒ… + ์˜์กด์„ฑ ์ฃผ์ž…์„ ํ•œ ๋ฒˆ์— ํ•ด๊ฒฐํ•˜๊ณ  ์‹ถ์„ ๋•Œ
BuildContext ์—†์ด UI๋ฅผ ์—…๋ฐ์ดํŠธํ•˜๊ณ  ์‹ถ์„ ๋•Œ
๋น ๋ฅด๊ณ  ๊ฐ€๋ฒผ์šด ํผํฌ๋จผ์Šค ์ตœ์ ํ™”๊ฐ€ ํ•„์š”ํ•œ ๊ฒฝ์šฐ
์ดˆ๋ณด์ž๋„ ์‰ฝ๊ฒŒ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ๊ฐ„๋‹จํ•œ ์ƒํƒœ๊ด€๋ฆฌ๋ฅผ ์›ํ•  ๋•Œ
๊ฒฐ๋ก : GetX๋Š” ๊ฐ€์žฅ ๊ฐ„๋‹จํ•˜๋ฉด์„œ๋„ ๊ฐ•๋ ฅํ•œ Flutter ์ƒํƒœ๊ด€๋ฆฌ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ ์ค‘ ํ•˜๋‚˜!