Flutter - CRUD Rest

De Aulas

Afluentes: Usabilidade, Desenvolvimento Web, Mobile e Jogos, Desenvolvimento Front-end II

Serviço web

Para que nosso CRUD possa ser funcional, precisamos de um serviço web com as operações de CRUD (CREATE, READ, UPDATE e DELETE). Para o nosso exemplo aqui, usarei um serviço web desenvolvido em linguagem de programação GO:

Caso você queira reimplementar o serviço em Node.js ou outra linguagem/framework, basta entender o manual de acesso ao serviço web:

Criação do Projeto

Primeiro criamos nosso projeto. Nesse exemplo dei o nome de appcrud, mas vocês podem usar qualquer outro nome.

$ flutter create appcrud

Na sequência, entramos dentro da pasta do projeto criado e lá dentro adicionamos a biblioteca http para podermos fazer as chamadas aos serviços web.

$ cd appcrud
$ flutter pub add http

A partir desse momento, nosso projeto básico já está funcionando. Para executá-lo, basta digitar o comando abaixo dentro da pasta do projeto:

$ flutter run

Nosso Projeto

Vamos primeiro alterar o arquivo main.dart, ajustando ele apenas para chamar a nossa janela de CRUD.

main.dart

Veja que temos a classe App e nela configuramos o título e no home chamamos a classe UsersCrud que está no arquivo userscrud.dart que deve ser adicionado nos imports·

import 'package:flutter/material.dart';
import 'userscrud.dart';

void main() => runApp(const App());

class App extends StatelessWidget {
  const App({super.key});

  @override
  build(context) {
    return const MaterialApp(
      title: 'Usuários',
      home: UsersCrud(),
    );
  }
}

user.dart

class User {
  final int id;
  final String name;
  final String email;

  User({
    required this.id,
    required this.name,
    required this.email,
  });

  // Serializando para MAP
  Map<String, dynamic> toMap() {
    return {
      'id': id,
      'name': name,
      'email': email,
    };
  }

  // Deserializando do JSON
  User.fromJson(Map json)
      : id = json['id'],
        name = json['name'],
        email = json['email'];
}