Como Usar Completers do Flutter com um Backend no Back4app

introdução futures e streams são o caminho a seguir em qualquer tipo de operação assíncrona no entanto, às vezes ambos não são suficientes se você deseja um controle mais avançado sobre futures , então use um completer é uma ferramenta através da qual você pode completar um future programaticamente de certa forma, isso proporciona um melhor controle sobre operações assíncronas este tutorial irá ajudá lo a trabalhar com flutter completers em uma aplicação que interage com um backend no back4app ao final deste tutorial, você terá aprendido como usar completers em uma aplicação flutter para gerenciar tarefas assíncronas e integrar essas tarefas com um serviço de backend fornecido pelo back4app vamos criar um aplicativo muito simples que obtém dados de um back4app backend usando um completer para controlar o fluxo da aplicação pré requisitos para completar este tutorial, você precisará uma conta back4app inscreva se para uma conta gratuita em back4app com https //www back4app com ambiente de desenvolvimento flutter configurado em sua máquina local siga o guia de instalação do flutter https //flutter dev/docs/get started/install se você ainda não o configurou conhecimento básico de dart e programação assíncrona em flutter se você precisar de uma atualização, confira o guia de programação assíncrona do flutter https //dart dev/codelabs/async await passo 1 – configurando seu backend back4app primeiro, vamos configurar um backend simples no back4app com o qual nosso aplicativo flutter irá interagir faça login na sua conta back4app e crie um novo projeto configure uma nova classe parse chamada task , que armazenará tarefas que nosso aplicativo flutter irá buscar adicione as seguintes colunas à task classe nome (string) o nome da tarefa status (boolean) o status da tarefa (concluída ou não) adicione algumas tarefas de exemplo no banco de dados back4app para testar por exemplo tarefa 1 nome = "completar tutorial flutter", status = true tarefa 2 nome = "iniciar novo projeto", status = false seu backend back4app agora está pronto para ser acessado pelo aplicativo flutter passo 2 – criando um projeto flutter em seguida, criaremos um novo projeto flutter abra seu terminal ou prompt de comando execute o seguinte comando para criar um novo projeto flutter flutter create completer demo navegue até o diretório do projeto cd completer demo 2\ abra o projeto no seu editor de código preferido (por exemplo, vs code, android studio) passo 3 – adicionando o sdk do parse e configurando o app agora, vamos adicionar as dependências necessárias para interagir com o back4app abra pubspec yaml e adicione as seguintes dependências dependencies flutter sdk flutter parse server sdk flutter ^3 0 0 2\ execute flutter pub get para instalar as dependências 3\ em lib/main dart , importe o sdk do parse import 'package\ flutter/material dart'; import 'package\ parse server sdk flutter/parse server sdk flutter dart'; import 'dart\ async'; 4\ inicialize o parse na função void main() async { widgetsflutterbinding ensureinitialized(); const keyapplicationid = 'your app id'; const keyclientkey = 'your client key'; const keyparseserverurl = 'https //parseapi back4app com'; await parse() initialize(keyapplicationid, keyparseserverurl, clientkey keyclientkey, autosendsessionid true); runapp(myapp()); } substitua 'your app id' e 'your client key' pelas suas credenciais reais do back4app passo 4 – usando completers para buscar dados assincronamente agora, vamos usar um completer para buscar dados do backend do back4app e controlar quando os dados estão disponíveis para uso na interface do usuário em lib/main dart , crie uma nova classe que buscará tarefas do back4app usando um completer class taskmanager { final completer\<list\<parseobject>> completer = completer(); future\<list\<parseobject>> get tasks => completer future; taskmanager() { fetchtasks(); } void fetchtasks() async { querybuilder\<parseobject> query = querybuilder\<parseobject>(parseobject('task')); final parseresponse response = await query query(); if (response success && response results != null) { completer complete(response results); } else { completer completeerror('failed to load tasks'); } } } esta classe inicializa um completer , começa a buscar dados e completa o completer quando os dados estão disponíveis 2\ no widget myapp , use o taskmanager para buscar e exibir tarefas class myapp extends statelesswidget { @override widget build(buildcontext context) { return materialapp( home scaffold( appbar appbar(title text('flutter completer demo')), body futurebuilder\<list\<parseobject>>( future taskmanager() tasks, builder (context, snapshot) { if (snapshot connectionstate == connectionstate waiting) { return center(child circularprogressindicator()); } else if (snapshot haserror) { return center(child text('error ${snapshot error}')); } else if (!snapshot hasdata || snapshot data! isempty) { return center(child text('no tasks found ')); } else { return listview\ builder( itemcount snapshot data! length, itembuilder (context, index) { final task = snapshot data!\[index]; return listtile( title text(task get\<string>('name') ?? 'no name'), subtitle text('completed ${task get\<bool>('status') ? 'yes' 'no'}'), ); }, ); } }, ), ), ); } } 3\ execute seu aplicativo flutter você deve ver uma lista de tarefas buscadas do seu backend back4app, com seus nomes e status de conclusão conclusão neste tutorial, você aprendeu como usar completers do flutter para gerenciar operações assíncronas e controlar o fluxo de busca de dados em seu aplicativo ao integrar se com o back4app, você criou um backend simples, mas poderoso, para seu aplicativo flutter, permitindo que você buscasse e exibisse dados dinamicamente essa abordagem pode ser estendida para lidar com cenários mais complexos, como autenticação de usuários, manipulação de dados e mais para mais informações sobre como usar o flutter com o back4app, confira a documentação do back4app flutter https //www back4app com/docs/flutter/overview boa codificação!