Aplicativo Flutter para gerenciamento financeiro pessoal com autenticação, dashboard financeiro e armazenamento de recibos utilizando Firebase.
- 📱 Sobre o projeto
- 🛠 Tecnologias
- ✨ Funcionalidades
- 🏗 Arquitetura
- 📂 Estrutura do projeto
- 🧠 Gerenciamento de estado
- 🎨 Design System
- 📚 Storybook
- 🚀 Executando o projeto
- 🔥 Configuração do Firebase
- 🎥 Demonstração
- 👥 Equipe
Este projeto foi desenvolvido como parte do Tech Challenge - Fase 03 da Pós Tech.
A aplicação tem como objetivo permitir que usuários gerenciem suas finanças pessoais, incluindo cadastro de transações, visualização de relatórios financeiros e armazenamento de recibos utilizando Firebase.
O projeto também explora conceitos de arquitetura escalável, Design System e documentação de componentes utilizando Storybook.
O projeto foi desenvolvido utilizando as seguintes tecnologias:
- Flutter — framework para desenvolvimento mobile multiplataforma
- Dart — linguagem utilizada pelo Flutter
- Firebase Authentication — autenticação de usuários
- Cloud Firestore — banco de dados NoSQL para armazenamento de transações
- Firebase Storage — armazenamento de recibos e anexos
- Provider — gerenciamento de estado da aplicação
- Custom Design System — tokens e componentes reutilizáveis
- Storybook Flutter — documentação visual de componentes
- Git / GitHub — versionamento de código
- Login de usuário
- Registro de novos usuários
- Persistência de sessão
- Visualização de gráficos financeiros
- Análise das transações cadastradas
- Listagem de transações
- Filtros por categoria e data
- Paginação / scroll infinito
- Adicionar novas transações
- Editar transações existentes
- Validação de campos
- Upload de comprovantes
- Armazenamento no Firebase Storage
O projeto utiliza uma arquitetura baseada em:
Separação clara entre:
- Domain
- Application / UseCases
- Presentation
- Infrastructure
Organização baseada em funcionalidades da aplicação.
Isso permite:
- melhor escalabilidade
- maior isolamento de features
- código mais fácil de manter
TC3-FLUTTER-APP\LIB
+---app
| +---controllers
| \---router
+---core
| \---error
+---features
| +---auth
| | +---data
| | | \---services
| | \---presentation
| | +---controllers
| | +---screens
| | \---widgets
| +---home
| | \---presentation
| | +---screens
| | \---widgets
| | \---charts
| +---navigation
| | +---domain
| | \---presentation
| | +---screens
| | \---widgets
| +---profile
| | \---presentation
| | +---screens
| | \---widgets
| +---register
| | \---presentation
| | +---screens
| | \---widgets
| +---splash
| | \---presentation
| | \---screens
| \---transactions
| +---data
| | +---models
| | \---services
| +---di
| +---domain
| | +---entities
| | +---enums
| | \---usecases
| \---presentation
| +---controllers
| +---filters
| +---formatters
| +---helpers
| +---mappers
| +---screens
| +---utils
| \---widgets
| \---filters
\---shared
+---design_system
| +---components
| +---storybook
| | +---previews
| | | +---features
| | | | +---auth
| | | | | \---widgets
| | | | +---home
| | | | | \---widgets
| | | | +---navigation
| | | | +---profile
| | | | | \---widgets
| | | | +---register
| | | | | \---widgets
| | | | +---splash
| | | | \---transactions
| | | | \---widgets
| | | \---widgets
| | +---stories
| | | +---components
| | | +---features
| | | | +---auth
| | | | | \---widgets
| | | | +---home
| | | | | \---widgets
| | | | +---navigation
| | | | | \---widgets
| | | | +---profile
| | | | | \---widgets
| | | | +---register
| | | | | \---widgets
| | | | +---splash
| | | | \---transactions
| | | | \---widgets
| | | +---tokens
| | | | +---models
| | | | \---widgets
| | | \---widgets
| | \---support
| | +---mocks
| | | \---features
| | | +---auth
| | | \---home
| | \---states
| | +---components
| | +---features
| | | +---auth
| | | +---home
| | | +---navigation
| | | \---transactions
| | \---widgets
| +---themes
| \---tokens
\---utils
O gerenciamento de estado é realizado utilizando:
Provider
Responsável por gerenciar:
- estado de autenticação
- estado das transações
- atualização da interface
O projeto possui um Design System próprio, responsável por centralizar:
- tokens visuais
- componentes reutilizáveis
- temas
Localizados em:
shared/design_system/tokens
AppColors.primary
AppColors.secondary
AppColors.accent
AppColors.background
AppColors.surface
AppSpacing.xs
AppSpacing.sm
AppSpacing.md
AppSpacing.lg
AppSpacing.xl
AppTypography.title
AppTypography.subtitle
AppTypography.body
AppTypography.caption
AppTypography.button
Localizados em:
shared/design_system/components
Componentes disponíveis:
- AppButton
- AppTextField
- AppEmailField
- AppPasswordField
- AppDropdownField
- AppCard
- AppPickerField
- AppSectionTitle
- AppTopBar
- AppSpeedDial
Exemplo:
AppButton(
label: 'Entrar',
onPressed: () {},
)O projeto utiliza Storybook Flutter para documentar visualmente os componentes.
Permite:
- visualizar componentes isoladamente
- testar diferentes estados
- documentar tokens
- validar consistência visual
flutter run -t lib/main_storybook.dartflutter pub get
flutter run
O projeto utiliza:
- Firebase Authentication
- Cloud Firestore
- Firebase Storage
https://console.firebase.google.com
flutter pub add firebase_core
flutter pub add firebase_auth
flutter pub add cloud_firestore
flutter pub add firebase_storage
await Firebase.initializeApp();Vídeo demonstrando:
- login
- cadastro de transações
- edição
- filtros
- upload de recibos
- integração com Firebase
https://youtube.com/shorts/Z-QvAC9wJ-8?feature=share
| RM | Nome | GitHub | |
|---|---|---|---|
| RM367409 | Isabelle Dias Ribeiro Silva | ||
| RM367047 | Mariana Ayumi Tamay |