본문 바로가기

Flutter-플러터/플러터 공부

Get X 1편 - Get X에 대해

반응형
getx/README.ko-kr.md at master · jonataslaw/getx (github.com)
 

GitHub - jonataslaw/getx: Open screens/snackbars/dialogs/bottomSheets without context, manage states and inject dependencies eas

Open screens/snackbars/dialogs/bottomSheets without context, manage states and inject dependencies easily with Get. - GitHub - jonataslaw/getx: Open screens/snackbars/dialogs/bottomSheets without c...

github.com

 

코딩의 발전의 속도는 무자비하다 하지만 그 발전의 방향은 일관성이 존재한다. 바로 "효율" 이다. 

 

1. 공간의 효율 -> 프로그램의 실행횟수를 줄여서 메모리를 적게 쓰게 하자 

2. 시간의 효율-> 프로그램의 실행횟수를 최소화해서 빠른시간내에 처리가 가능하게 하자 

3. 피드백의 효율 -> 코드 읽는 시간을 줄여서 빠르게 문제점을 해결하자 

 

 

그 "효율" 때문에 최근 많은 사람들로부터 선택받는 개발언어가 있다. 바로 Dart! Dart는 Flutter 프레임워크를 사용해서 하나의 코드로 안드로이드, IOS, 웹, 윈도우까지 프로그램을 만들 수 있는 매우"효율" 적인 언어이다. 회사 입장에서는 개발자를 안드로이드 1명, IOS 1명씩 둘 필요가 없어지니 말이다. 

 

Flutter 가 한 때는 가장 인기 없는 언어로 선정된적도 있지만 지금은  더 "효율"적인 모습들로 개선이 되고 있다. 

그렇기에 많은 사람들로부터 선택을 받고 있는 듯 하다. 

 

 오늘의 주인공은 Flutter 의 "효율" 적인 발전의 한 모습인  Get X이다.  지금 부터 나오는 내용은 위에 링크를 참고해서 만들었다.

 

Get X는 "Flutter made easy" 라는 목표를 두고 있다. 

 

 

기존에 플러터 새로운 프로젝트를 열면 실행되었던 카운트앱이 있다. 

 

 

아래는 그 카운트앱을 Get X로 개선한 모습이다. 기존에 100줄의코드양이 30줄로 줄어들었다. 

Get X는 불필요한 context를 줄이고 좀 더 직관적으로 코드를 제공한다. 

get. , .obs , obx() 등등 

 

void main() => runApp(GetMaterialApp(home: Home()));

 

class Controller extends GetxController{
  var count = 0.obs;
  increment() => count++;
}

 

class Home extends StatelessWidget {

  @override
  Widget build(context) {

    // Get.put()을 사용하여 클래스를 인스턴스화하여 모든 "child'에서 사용가능하게 합니다.
    final Controller c = Get.put(Controller());
    
    return Scaffold(
      // count가 변경 될 때마다 Obx(()=> 를 사용하여 Text()에 업데이트합니다.
      appBar: AppBar(title: Obx(() => Text("Clicks: ${c.count}"))),

      // 8줄의 Navigator.push를 간단한 Get.to()로 변경합니다. context는 필요없습니다.
      body: Center(child: ElevatedButton(
              child: Text("Go to Other"), onPressed: () => Get.to(Other()))),
      floatingActionButton:
          FloatingActionButton(child: Icon(Icons.add), onPressed: c.increment));
  }
}

class Other extends StatelessWidget {
  // 다른 페이지에서 사용되는 컨트롤러를 Get으로 찾아서 redirect 할 수 있습니다.
  final Controller c = Get.find();

  @override
  Widget build(context){
     // 업데이트된 count 변수에 연결
     return Scaffold(body: Center(child: Text("${c.count}")));
  }
}

 

 

 

이렇듯 좀더 짧은 구문, 효과적인 기능성으로 기존에  Bloc, Provider 로 만들었던 코드를 Get X로 변환하는 개발자가 늘고 있다. 

 

 

 

728x90
반응형