FakeStore, Brincando com Flutter

Flutter é uma ferramenta muito interessante, tenho gostado bastante de estudar e testar as possibilidades que ele proporciona, hoje vou contar um pouco da minha experiência com ele, neste projeto que seria meu Hello world kkk

O que a aplicação deveria fazer?

Minha ideia foi criar um projeto, Android e iOS que simule o fluxo de compras em aplicativos, para criar a mesma sensação boa de comprar um produto e pagar tendo tudo confirmado no fluxo, claro que os produtos listados não são reais, não peço qualquer informação de endereço, forma de pagamento etc. são apenas exibidos dados demonstrativos para dar uma impressão de um fluxo completo. até com uma vibração do celular ao confirmar a compra rsrs. (Quem tem ansiedade pode baixar o app e brincar, fiquei sabendo que ajuda rsrs).

Por que Flutter?

Meu último projeto, Scrumcard foi criado em Unity, explico melhor os motivos no link da postagem, mas como já havia tido experiência com desenvolvimento Nativo de APPs e desenvolvimento híbrido em jogos, resolvi procurar alguma ferramenta para desenvolvimento híbrido mais focados em apps.

Das opções que conheço não estava disposto a me arriscar com soluções que gerassem código HTML, JS etc. prefiro algo mais próximo do nativo, então fiquei entre React, Flutter e Xamarim. optei pelo Flutter primeiramente por ser uma novidade que gerou um BOOM bem grande na comunidade, é bem fácil achar conteúdo todo atualizado e não faltam exemplos. (Pelo menos hoje em dia, quando tentei usar logo no lançamento desisti rapidamente, por alguns erros que tive e não tínhamos fóruns ainda para auxiliar.).

Como foi a experiência.

Levei mais ou menos um mês para finalizar, só codificando nos tempos livres, então foram poucas horas dedicadas, tentei copiar o que vejo em outros apps de e-commerce e nos fluxos básicos de apps. usei recursos como:

Navegação Push e Pop das views,
Listagem de elementos,
Listagem collections,
Conexão com API externa,
Carregar imagens por URL, com placeholder enquanto aguarda o download,
Cache das imagens,
Vibração do celular,
Shimmer,
Carrossel de imagens,
Persistência de dados (Para os favoritos e o carrinho),
Adicionar imagens SVG.

Todos itens eu consegui realizar sem problemas, algumas libs ajudaram muito nas etapas, outras coisas já são nativas no Dart (Linguagem para desenvolvimento no Flutter).

Libs que usei:

flutter:
    sdk: flutter
flutter_svg: ^0.22.0
intl: ^0.17.0
cached_network_image: ^3.0.0
mobx: ^2.0.1
page_transition: ^2.0.2
carousel_slider: ^3.0.0
flutter_vibrate: ^1.1.0
flutter_spinkit: ^4.1.2
shimmer: ^2.0.0
http: ^0.13.3
cupertino_icons: ^1.0.2

Conclusão

Projeto finalizado, rodando no Android perfeitamente assim que fiz o Build, porém no iOS existem algumas divergências de padding que ainda não parei para ver, mas aparentemente preciso fazer ajustes para versão do iOS. Posto isso, todas dúvidas que tive, todas ideias e recursos legais que quis colocar, encontrei exemplos na internet. o caso que me deu um trabalho no inicio, que era um problema com stacks, me ajudaram no fórum do Facebook.

A criação das telas segue uma linha bem parecida com o SwiftUI, usando somente código, o que depois que você se acostuma vê as infinitas possibilidades e as vantagens desse tipo de desenvolvimento da UI. Acaba sendo mais prático e simples a reutilização de elementos do layout.

Por fim vejo como a comunidade é bem unida e acredito que, salvo pontos mais específicos, não temos limites para o que o Flutter pode realizar, como ele usa por baixo uma tecnologia que desenha os elementos na tela, inclusive é a mesma que é usada para jogos, isso abre um leque maior ainda de possibilidades.