“Querer vencer significa já ter percorrido metade do caminho.”
Este projeto é o cliente mobile de um projeto parte da Semana Omnistack de 2020 ofertada pela RocketSeat. Na semana Omnistack desenvolvemos um projeto desde seu back-end em NodeJs com integração ao database SQlite, seu cliente web com ReactJs e seu cliente mobile com React Native
O Intuito da aplicação mobile, ou seja, deste projeto, é listar entidades "Casos", que foram cadastradas no banco anteriormente através do cliente web por entidades "ONGs" (usuários propriamente ditos). Esses "Casos" possuem detalhes sobre algo que tenha ocorrido e que a "ONG" precise de financiamento, constando informações como o valor solicitado pela ONG e contato para que o usuário do APP possa ajudar/doar para o no "Caso" selecionado.
-
Cliente web para gerenciar "Casos": https://github.com/RianTavares/be-the-hero-front
-
Servidor com endpoints e gerenciamento de dados: https://github.com/RianTavares/be-the-hero-server
- Faça o download ou clone o projeto
- Tenha Node.js e npm instalado em sua máquina
- Rode
npm install
na pastamobile
- instale Expo-CLI globalmente em sua máquinha
- Inicie o app através do comando
expo start
- O projeto agora está rodando. Uma aba se abrirá em seu navegador padrão com um QR caso você queira simular o projeto em seu dispositivo e com a opções de simular em um SDK previamente configurado (iphone com x-code ou android com Android studio)
Este projeto foi criado utiliziando Expo que é uma estrutura e uma plataforma para aplicações universais do React. É um conjunto de ferramentas e serviços criados em torno do React Native e plataformas nativas que ajudam a desenvolver, criar, implantar e iterar rapidamente em iOS, Android e aplicativos da web a partir da mesma base de código JavaScript / TypeScript.
Um fator importante para a escolha deste framework no desenvolvimento do projeto foi a não necessidade de SDK's como x-code e/ou android studio instalados para simular o projeto. Este framework traz uma solução capaz de testar seu app em seu dispositivo. Isso facilita demais visto que a proposta deste projeto foi compartilhada com outras centenas de desenvolvedores.
Para configurar as rotas neste projeto foram utilizados os seguintes pacotes:
import { NavigationContainer } from "@react-navigation/native";
import { createStackNavigator } from "@react-navigation/stack";
O navegador de pilha do React Navigation fornece uma maneira para o seu aplicativo fazer a transição entre telas e gerenciar o histórico de navegação. Se o seu aplicativo usar apenas um navegador de pilha, será conceitualmente semelhante ao modo como um navegador da Web lida com o estado de navegação - o aplicativo envia e exibe itens da pilha de navegação à medida que os usuários interagem com ele, e isso faz com que o usuário veja telas diferentes. A principal diferença entre como isso funciona em um navegador da Web e no React Navigation é que o navegador de pilha do React Navigation fornece os gestos e animações que você esperaria no Android e iOS ao navegar entre rotas na pilha.
- Se você curtiu o projeto não esquece de dar uma ⭐
- Me segue lá no Instagram também @riantavareson ❤️
- E claro, me segue aqui no github né :)
GNU GENERAL PUBLIC LICENSE
Copyright (c) 2020 Rian Tavares