Um App para você consultar os melhores modelos das melhores marcas
Vídeo Demo •
Demo Interativa •
Showcase •
Diferenciais •
Tecnologias
Bellagio Cars é uma aplicação mobile sofisticada. O objetivo era criar uma experiência fluida e elegante para a exploração de marcas e modelos de carros, e este projeto não apenas atende, mas transcende os requisitos, implementando funcionalidades de ponta para uma experiência de usuário premium.
Abaixo, uma demonstração animada que mostra o fluxo de navegação, as animações fluidas e os principais recursos do aplicativo em ação. Clique na imagem para assistir ao vídeo.
Experimente o aplicativo diretamente no seu navegador, sem precisar instalar nada!
Escaneie o QR Code ou clique aqui para acessar a demo
A interface foi projetada para ser intuitiva e visualmente impactante, adaptando-se perfeitamente às preferências do usuário com os modos Light e Dark.
| Login (Preview) | Login (Formulário) | Autenticação Biométrica |
|---|---|---|
 |
 |
 |
| Home (Dark Mode) | Home (Light Mode) | Página de Modelos |
 |
 |
 |
Para entregar uma solução verdadeiramente profissional, fui além dos requisitos básicos do desafio, focando em duas áreas chave que elevam a experiência do usuário a um novo patamar.
- Fluxo Inteligente: Após o primeiro login bem-sucedido, o app oferece ao usuário a opção de habilitar o login rápido.
- Conveniência e Segurança: Nas próximas vezes que abrir o app, o usuário será autenticado automaticamente via Face ID ou impressão digital, proporcionando um acesso instantâneo e seguro, sem a necessidade de digitar a senha novamente.
- Adaptação Automática: O aplicativo respeita as preferências do sistema. Se o celular do usuário estiver no modo escuro, a interface do Bellagio Cars se adaptará instantaneamente, e vice-versa.
- Experiência Visual Coesa: Todos os componentes foram estilizados com NativeWind, permitindo a aplicação de temas de forma eficiente e garantindo uma identidade visual consistente e agradável em ambos os modos.
Este projeto foi construído com as tecnologias mais modernas e eficientes do ecossistema React Native:
- Framework: React Native com Expo
- Linguagem: TypeScript
- Estilização: NativeWind (Tailwind CSS para React Native)
- Navegação: Expo Router (Navegação baseada em arquivos)
- Gerenciamento de Formulários: React Hook Form
- Gerenciamento de Estado: React Context API
- Armazenamento Local: AsyncStorage
- Autenticação Biométrica: Expo Local Authentication
- Animações: React Native Reanimated & Gesture Handler
- Componentes Visuais: Expo Blur (para efeito de vidro fosco)
- Plataforma: Expo
- Linguagem: TypeScript
- Gerenciamento de Estado: Context API
- Armazenamento: Async Storage
- Estilização: NativeWind
- Navegação: React Navigation (via Expo Router)
- Consumo de API: Fetch API
- Formulários: React Hook Form
- Tela de Login (
SignIn): Implementada - Tela Home (Marcas): Implementada
- Tela de Modelos (
Model): Implementada - Exibição do Nome do Usuário: Implementada
- Função de Logout: Implementada
Siga os passos abaixo para rodar o projeto na sua máquina.
-
Clone o repositório:
git clone [https://github.com/EderJrDev/bellagio-app.git](https://github.com/EderJrDev/bellagio-app.git) cd bellagio-app -
Instale as dependências:
npm install
-
Inicie o servidor de desenvolvimento: Para rodar com um cache limpo (recomendado na primeira vez):
npx expo start -c
Depois, escaneie o QR Code com o app Expo Go no seu celular.