GetX: o canivete suíço do Flutter

GetX: o canivete suíço do Flutter

Imagine-se na seguinte situação: você está começando com Flutter e iniciou um novo projeto que, agora, está crescendo.

Logo, algumas implementações de features ficam complicadas. Embora não sejam features complexas, o Flutter apenas já não basta.

Logo, você busca uma solução para os seus problemas e percebe que existem várias bibliotecas para solucionar diversas coisas. Qual utilizar?

A boa notícia é: O GetX pode ajudar!

O que é o GetX?

O GetX é uma das bibliotecas mais completas dentro do pub.dev (repositório oficial de pacotes Dart e Flutter). A ideia dela é ser uma solução única para problemas inevitáveis do Flutter e Dart.

A situação que foi descrita acima é muito comum, e as pessoas desenvolvedoras encontram soluções em pacotes como o GetX.

Os problemas mais comuns de uma aplicação Flutter podem ser resumidos em três principais:

  • Gerenciamento de estados: Uma aplicação que atualiza informações dinamicamente precisa de uma biblioteca para lidar com estados. Um pacote famoso, por exemplo, seria o MobX;
  • Injeção de dependências: Trabalhar com a árvore de widgets do Flutter pode se tornar muito complexo quando a aplicação cresce, portanto, utilizamos pacotes como o Provider para ajudar na injeção de dependências;
  • Gerenciamento de rotas: O Flutter Navigator também tem suas limitações, por mais que já resolva muitos problemas; mas, se você precisa de uma solução mais customizada e completa, pode optar por bibliotecas como go_router.

Você deve ter percebido que deixamos exemplos de bibliotecas mais utilizadas para cada situação (MobX, Provider). Logo, qual a justificativa para utilizar o GetX?

Acontece que cada biblioteca tem uma maneira diferente de ser implementada e, às vezes, não funciona muito bem com outras bibliotecas, por questões de incompatibilidade.

Além de ter que aprender uma nova ferramenta, você ainda corre o risco de que ela quebre o projeto ou seja necessário mudar o planejamento inicial da aplicação.

É aí que ferramentas completas como o GetX entram em ação!

Você aprende apenas uma ferramenta, que resolve grande parte dos problemas mais comuns em projetos Flutter.

Banner promocional da Alura, com um design futurista em tons de azul, apresentando dois blocos de texto, no qual o bloco esquerdo tem os dizeres:

O que mais o GetX é capaz de fazer?

O GetX é como um canivete suíço e consegue fazer diversas coisas ao mesmo tempo. Vamos dividi-las em:

  1. Recursos essenciais: que resolvem os principais problemas de um app Flutter;
  2. Recursos úteis: são bastante interessantes, mas não são os principais motivos pelos quais utilizamos o GetX;
  3. Recursos extras: são recursos adicionais e até acessórios, que poderiam ser feitos de outras formas (por exemplo, animações).

Recursos essenciais

Esses são os problemas principais que o GetX veio resolver:

  1. Gerenciamento de estados;
  2. Injeção de dependências;
  3. Gerenciamento de rotas.

Gerenciamento de estados

O GetX simplifica na hora de lidar com dados mutáveis, mas ainda assim de uma maneira poderosa. Veja o código abaixo que demonstra lógica de um carrinho de compras:

import 'package:get/get.dart';
import 'package:panucci_delivery/models/item.dart';

class CarrinhoController extends GetxController {
  var carrinho = <Item>[].obs;
  var total = 0.0.obs;

  void addToCart(Item item) {
    carrinho.add(item);
    updateTotal();
  }

  void removeFromCart(Item item) {
    carrinho.remove(item);
    updateTotal();
  }

  void updateTotal() {
    total.value = 0.0;
    carrinho.forEach((element) {
      total.value += element.preco;
    });
  }
}

Vamos entender esse código? Com ele, você tem um controlador de carrinho de compras que pode adicionar e remover itens, além de recalcular o total automaticamente. Veja como o GetX facilita o gerenciamento de estados.

Através de variáveis observáveis (.obs), qualquer função que altere seus valores terá seu estado atualizado pelo Flutter.

Veja como foi fácil declarar uma variável do tipo observável. O detalhe principal é que para as observáveis existirem, elas precisam estar dentro de uma classe separada que estende de GetxController.

Injeção de dependências

Propagação de dados é uma questão delicada no Flutter, mas o GetX tem uma forma bem organizada e eficiente. Vejamos o exemplo do carrinho de compras, novamente:

final CarrinhoController carrinhoController = Get.put(CarrinhoController());

Para este caso específico, queremos injetar as observáveis que foram criadas no exemplo anterior dentro de outro componente/widget.

Para fazer uma injeção, primeiro precisamos adicionar o que queremos injetar numa parte bem específica do GetX que lida com dependências através da função Get.put().

Put vem do inglês "colocar", então estamos colocando o CarrinhoController na lista de dependências que o GetX precisa gerenciar. Com isso, temos acesso a todas as observáveis e funções que a classe CarrinhoController oferece!

Gerenciamento de rotas

O ponto principal é que o GetX abandona o uso de context para lidar com a stack (pilha) de navegação, o que ocasiona mais liberdade para você trabalhar com rotas.

onTap: () {
  Get.to(() => Checkout());
},

Este é um exemplo simples, mas dá para ter uma ideia de como o GetX facilita ainda mais a navegação entre telas.

Chamando apenas a função Get.to(), nós passamos outra tela e pronto! Temos uma navegação sem context e sem MaterialPageRoute.

Recursos úteis

As ferramentas úteis do GetX são:

  • Internacionalização: O pacote ajuda com traduções e regionalizações, permitindo que sua aplicação se adapte a diversas linguagens;
  • Temas: Você pode criar temas customizados e alterá-los chamando apenas uma função, sem precisar criar sistemas complexos. Acabaram os seus problemas para alternar entre dark e light mode!;
  • Requisições: o GetX facilita o processo de lidar com requisições HTTP;
  • Middleware: Você pode trabalhar com rotas de maneira diferente através de redirecionamento, por exemplo, mostrando uma dashboard de admin quando a pessoa logada for um usuário administrador.

Recursos extras

Como tempero final, também temos funções visuais:

  • Animações: O GetX possui animações pré-definidas que vão deixar sua aplicação diferenciada;
  • Dialogs e Toasts: O pacote permite criar Dialogs e Toasts customizados de uma maneira muito mais simples.

Pontos importantes do Getx

O GetX incentiva o uso de arquitetura de camadas, em que cada funcionalidade ou feature fica isolada em um lugar diferente.

Pense em uma situação na qual você precisa lidar com requisições para uma API: com GetX, você produz uma classe que apenas faz essas requisições e depois estende uma classe do GetX para ter acesso às funcionalidades adicionais.

Veja o exemplo de código de uma requisição para uma API:

import 'package:get/get.dart';
import 'package:vidflow/model/video.dart';
import 'package:vidflow/utils/api_endpoints.dart';

class VideosApi extends GetConnect {
  @override
  void onInit() {
    super.onInit();
    httpClient.baseUrl = ApiEndpoints.baseUrl;
  }

  Future<Response<void>> create(Video video, String token) => post(ApiEndpoints.addVideoByUser, video.toMap(), headers: {"Content-Type": "application/json", "Authorization": "Bearer $token"});

  Future<Response<List<Video>>> getAllFromUser(userId) => get(ApiEndpoints.videos, decoder: Video.listFromJson, query: {"userId": userId.toString()});

Você pode fazer uma conexão com a outra classe de observáveis que vimos no primeiro exemplo de código.

Repare que, neste exemplo, para pode utilizar as funções de post() e get(), precisamos primeiro estender a classe com um GetConnect.

Isso foi bem semelhante ao GetxController para as observáveis. Isso quer dizer que cada classe que utiliza alguma funcionalidade do GetX só pode ter uma única função exclusiva.

O GetX reage de forma a evitar que o seu código vire um macarrão cheio de nós e você escreva um código mais legível e de fácil manutenção.

Vantagens e desvantagens

Como todo pacote/ferramenta/linguagem, o GetX apresenta vantagens e desvantagens. Vamos descobrir quais são!

Quais são as vantagens do GetX?

  • Simplicidade e facilidade de uso: É muito fácil começar a utilizar GetX no seu projeto. Esse é um dos grandes motivos que atraem pessoas para a ferramenta;
  • Produtividade: Quase todas as ferramentas que você precisa utilizar estão no GetX, e como todas fazem parte do mesmo ecossistema, é possível seguir um caminho único sem grandes surpresas;
  • Organização: Já foi falado antes, mas o GetX incentiva você a fazer um código mais bem escrito e com responsabilidades isoladas, tendo em vista um projeto escalável e de fácil manutenção.

Quais são as desvantagens do GetX?

  • Domínio desafiador: GetX é uma ferramenta fácil de começar, mas difícil de dominar. Ele consegue fazer tantas coisas diferentes que pode ser complicado de aprender tudo;
  • Arquitetura presa: O GetX incentiva uma arquitetura muito específica para funcionar e às vezes não é disso que você precisa, e adaptar o GetX para outra arquitetura pode ser um grande desafio;
  • Acoplamento: Depender unicamente de uma ferramenta para fazer tudo na sua aplicação pode ser arriscado. Caso a biblioteca perca suporte, você não perde apenas uma funcionalidade, mas grande parte do seu projeto.

Conclusão

GetX é uma ferramenta excepcional que resolve muitos problemas comuns no Flutter. Ela também é simples de começar a usar e incentiva boas práticas.

Entretanto, pode não ser a melhor ferramenta para o seu projeto. Você precisa considerar se a solução oferecida pelo GetX é muito mais do que você precisa.

Quanto menos acoplamento a sua aplicação tiver, melhor, mas vão existir situações em que você precisa desenvolver algum projeto de forma rápida e eficiente. Nesses casos, o GetX é o caminho a se seguir.

Matheus Alberto
Matheus Alberto

Formado em Sistemas de Informação na FIAP e em Design Gráfico na Escola Panamericana de Artes e Design. Trabalho como desenvolvedor e instrutor na Alura. Nas horas vagas sou artista/ilustrador.

Veja outros artigos sobre Mobile