🌌 Trilogia Star Wars: Navegando entre Telas com React Native

Este projeto tem como objetivo ensinar e demonstrar o uso das principais navegações do React Native utilizando o tema do universo Star Wars para tornar a experiência mais divertida e prática.

🚀 Tecnologias Utilizadas

• React Native

• Expo

• React Navigation

  Stack Navigation Tab Navigation Drawer Navigation

📦 Bibliotecas Instaladas

npx expo install @react-navigation/native
npx expo install @react-navigation/stack
npx expo install @react-navigation/bottom-tabs
npx expo install @react-navigation/drawer
npx expo install react-native-screens react-native-safe-area-context react-native-gesture-handler react-native-reanimated react-native-vector-icons

🧱 Estrutura de Pastas

starwars-navigation/
├── App.js
├── navigation/
│   ├── StackNavigator.js
│   ├── TabNavigator.js
│   └── DrawerNavigator.js
├── screens/
│   ├── HomeScreen.js
│   ├── DetailsScreen.js
│   ├── CharactersScreen.js
│   └── SettingsScreen.js
└── assets/

🖥️ Telas do App

• HomeScreen: Tela inicial com uma introdução ao universo Star Wars.
• CharactersScreen: Lista de personagens famosos da saga.
• DetailsScreen: Detalhes sobre um personagem selecionado.
• SettingsScreen: Tela de configurações fictícias.
• Tab Navigation: Permite alternar entre “Início”, “Personagens” e “Configurações”.
• Drawer Navigation: Acesso lateral às principais telas do app.

💡 Aprendizados

Este projeto cobre:

• Conceitos de navegação entre telas
• Organização de código em múltiplos arquivos
• Uso prático de navegações combinadas (stack, tab e drawer)
• Estilização com ícones usando @expo/vector-icons

📚 Fontes

• Documentação do React Navigation
• Expo Docs

🧑‍💻 Autor

Renan Encaua Lopes