Skip to content
/ Rentx Public

O 3º projeto do bootcamp Ignite na trilha react-native, é o 2º projeto com o auxílio e configurações do Expo(Bare workflow), além disso é explicado mais sobre design(UI/UX), requisições de API RestFull em conjunto com axios e json-server, animações no React-Native, formatação de texto, manipulações com imagens, ícones, uso de diversas biblioteca…

Notifications You must be signed in to change notification settings

Aszurar/Rentx

Repository files navigation

Rentx | Ignite - React-Native

O projeto Rentx é um aplicativo mobile de a locação de veículos. Podemos listar os veículos disponíveis, agendar, e verificar os carros atualmente alugados pelo usuário. O projeto é desenvolvido com o framework com React-Native, e várias biliotecas como: React-Navigation para navegação em pilhas, JSON-Server como API para o back-end e toda teoria de como se chama as requisições de uma API RESTFULL, React Native Calendars para a seleção das datas, React-Native-Reanimated para animação dentre outras...

Rentx




ℹ️ Sobre

O 3º projeto do bootcamp Ignite na trilha react-native, é o 2º projeto com o auxílio e configurações do Expo(Bare workflow), além disso é explicado mais sobre design(UI/UX), Requisições de API RestFull em conjunto co Axios e JSON-Server, Animações no React-Native, além de formatação de datas com o date-fns.

  • Página Inicial:
__________________
  • Carros alugados:
___________________________
___ ## ⁉️ Motivo

Esse projeto tem por objetivo por em praticar os conceitos básicos de React Native no desenvolvimento mobile no 3º capítulo do curso Ignite de React Native.

Assim, nesse projeto criamos:

  1. Listagem geral de veículos que podem ser alugados.
  2. Cadastro de agendamentos dos veículos com suas datas formatadas e o preço total a ser pago.
  3. Listagem dos carros alugados pelo usuário.
  4. Formatação de datas com o date-fns.
  5. Componentes criados com Style Components, Flatlist e suas tipagens, hooks, navegação em pilha, calendário com o React-Native Calendars
  6. Animação e criação de componentes animados como Carrossel manual, efeito fade em componentes, uso de Splash Screen com o React Native Reanimated, Loads personalizados com Lottie econceitos básicos de Heurísticas Nielsen e UX, além de design, API REST, animação dentre outras.
  • Detalhes sobre o veículo:
______ _______
  • Agendamento/Cadastro:
______ _______

🎨 Design

Rentx - Figma


🌱 Requisitos Mínimos

  • Node.js
  • Yarn(ou NPM)
  • React
  • React-Native
  • JSON-Server
  • Android Studio
  • Celular(Opcional)
  • Expo(desktop)
    • Expo Go(Mobile) opcional.

🚀 Principais Tecnologias Utilizadas

O projeto foi desenvolvido utilizando as seguintes tecnologias


📦 Como baixar e executar o projeto

  • Clonar o projeto:

     git clone https://github.com/Aszurar/Rentx.git
  • É necessário a instalação do yarn de acordo com seu sistema operacional, para isso veja como no site do Yarn

  • Instalação das dependências:

    • Execute o comando abaixo dentro da pasta do projeto
      yarn
  • É necessário a instalação do emulador Android Studios e das tecnologias requesitadas acima no:seedling: Requisitos

  • Também é necessário a instalação/configuração de outras tecnologias, para isso siga os passos indicados nessa página de acordo com seu sistema operacional: Executando uma Aplicação React-Native emulando Windows/Linux/MacOS ou direto no dispositivo mobile Android/IOS

  • É necessário a instalação do Expo

  • Execução - Abra a pasta do projeto com alguma IDE(Vscode) ou simplesmente abra o terminal na pasta do projeto e execute o comando abaixo:

       expo start
  • Abra o emulador ou conecte o celular(É necessário a instalação do Expo Go) e execute:

        a
  • Lembrando que, caso seja executado pelo emulador, o ideal é sempre deixa-lo aberto antes de aplicar os comandos acima.

  • Além disso, como temos o json-server, será necessário executá-lo para carregar os dados da aplicação, basta abrir um novo terminal e executar:

        yarn api

Desenvolvido por 🌟 Lucas de Lima Martins de Souza.

About

O 3º projeto do bootcamp Ignite na trilha react-native, é o 2º projeto com o auxílio e configurações do Expo(Bare workflow), além disso é explicado mais sobre design(UI/UX), requisições de API RestFull em conjunto com axios e json-server, animações no React-Native, formatação de texto, manipulações com imagens, ícones, uso de diversas biblioteca…

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published