https://github.com/vs0uz4/tripplanner
Planejador de Viagens - Projeto Hands On React-Native [DevPleno]
https://github.com/vs0uz4/tripplanner
devpleno hands-on-react-native planner react-native trip
Last synced: 8 months ago
JSON representation
Planejador de Viagens - Projeto Hands On React-Native [DevPleno]
- Host: GitHub
- URL: https://github.com/vs0uz4/tripplanner
- Owner: vs0uz4
- Created: 2018-12-06T14:44:28.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2018-12-18T20:28:18.000Z (almost 7 years ago)
- Last Synced: 2025-01-07T21:39:47.149Z (9 months ago)
- Topics: devpleno, hands-on-react-native, planner, react-native, trip
- Language: JavaScript
- Size: 3.34 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## DevPleno - HandsOn React Native 2018 (Tripplaner)
O Tripplanner é um aplicativo mobile, para você planejar suas viagens, podendo adicionar os locais por onde passou e os custos envolvidos. Alimentação, hospedagem, transporte, passeios tudo pode ser adicionado como um **ponto** da viagem. O aplicativo multiplataforma foi desenvolvido em Javascript, usando o framework React Native. Podendo ser disponibilizado para as plataformas *IOS* e *ANDROID*.
## Tecnologias Envolvidas
- NodeJS;
- Npm ou Yarn;
- Android SDK;
- Xcode;
- React Native;
- Google Maps API.
> Para realizar o *Build* e gerarmos os *.APK*, aplicativos para a plataforma [ANDROID](https://www.android.com/) se faz necessário a instalação e configuração do [Android Studio](https://developer.android.com/studio/?hl=pt-br)
> Para aplicativos *.IPA*, destinados a plataforma [IOS](https://www.apple.com/br/ios/ios-12/) temos a necessidade de um sistema operacional [OSX](https://www.apple.com/br/macos/mojave/) além de instalar e configurar o [XCode](https://developer.apple.com/xcode/)
## Funcionalidades
- Criação de Viagens;
- Griação de Pontos de Viagem;
- Persistência dos Dados no AsyncStorage;
- **Posicionamento GPS em Realtime**;
- Adição de Imagem à Viagem - (18/12/2018);
- ~~Validação dos Dados ao Serem Persistidos~~;
- ~~Adição de Preços em Outras Moedas~~.
> O posicionamento georeferencial em tempo real foi implementado na seção de adição de pontos de viagens, afim de que o *MAPA* utilize como parâmetro a sua localização atual. Esta funcionalidade foi adicionada por conta própria e com a finalidade de melhorar a usabilidade do aplicativo.
> Para poder utilizar a localização em tempo real, foi necessário adicionar ao *Android Manifest* a permissão de geo localização.
## Construção do Aplicativo
O HandsOn foi todo baseado na criação do aplicativo para a plataforma *IOS*, porém por falta de um computador com sistema operacional *OSX*, focamos o desenvolvimento do projeto para a plataforma *Android*.
> Para criar efetivamente o *.Apk* para distribuição e/ou efetuar testes nos dispositivos *Android* se fez necessário a crialçai de uma *Key* (Chave) para assinatura do aquivo final *.APK*, além de algumas configurações extas. As Configurações podem ser encontradas nos seguintes links abaixo:
- https://facebook.github.io/react-native/docs/signed-apk-android
- https://github.com/react-native-community/react-native-maps/blob/master/docs/installation.md
### Comandos
Após instalar, configurar o Android Studio e posteriormente a ter criado e configurado a *imagem* a ser utilizada para testes durante o desenvolvimento do aplicativo através do *AVD Manager*, passei a utilizar o seguinte comando abaixo para iniciar o emulador:
```emulator -avd nome_da_imagem_avd```
Para iniciar a criação do *bundle* utilizei o seguinte comando abaixo:
```react-native start```
Para gerar a versão do aplicativo, automaticamente instala-la no emulador e já iniciar a mesma, basta usar o comando abaixo:
```react-native run-android```
> O comando acima irá criar uma versão do aplicativo menos performática do que versão final de distribuição devido estar disponível junto a ela todas as funcionalidades de suporte a debug.
E por fim para efetivamente gerar o *.apk*, após as devidas configurações sejam efetivamente realizadas, basta executar o seguinte comando em seu shell
```react-native run-android --variant=release```
## Todo
Algumas funcionalidades extras que não encontravam-se no escopo do treinamento estão na pendência de serem desenvolvidas afim de praticar e fixar os conhecimentos. Estas funcionalidades foram sugeridas como melhoria para o projeto de forma a constarem no portifólio de aplicações/projetos desenvolvidos. As funcionalidades a serem desenvolvidas são:
- [x] [Android/IOS] Adição de Imagem à Viagem;
- [ ] [Android/IOS] Validação dos Dados ao Serem Persistidos.
- [ ] [Android/IOS] Adição de Preços em Outras Moedas.
> Ultima atualização : 18/12/2018
## Informações importantes:
Este projeto foi entregue como parte do Workshop, **Hands On React Native** (edição Tripplaner) promovido pelo **DevPleno** (www.devpleno.com).
**Participante:** Vitor de Souza Rodrigues
**Chave do Certificado:** ...
O certificado pode ser consultado em: https://certificados.devpleno.com