Skip to content

Latest commit

 

History

History
114 lines (75 loc) · 3.78 KB

README.md

File metadata and controls

114 lines (75 loc) · 3.78 KB

screenshot

GitHub top language GitHub language count

PlantManager is a project to help you take care of your plants and remind you with notifications the exact time to water your plants!

The project was developed during the fifth edition of Next Level Week, held by Rocketseat between April 19th and 23th, 2021.

screenshot

Features

  • Welcome Splash Screen
  • Loading screen using Lottie animation by JSON file
  • Input name to identify the user
  • List of Plants and filters categories of which place of your home is recommended to put your favorite plant
  • Pagination feature to limit 8 plants per view
  • Schedule the best time to water your plants
  • Remove an appointment by Swipe gesture
  • Expo Notifications to remember you when to water your plants
  • AsyncStorage to save all your appointments locally
  • Menu using React Navigation Tabs

Summary

🚀 Technology

react expo typescript node

📱 Application

The application was developed with Typescript using the framework ReactJS and Expo.

The main libs use in this application was React Native AsyncStorage to save the appointments locally, React Navigation to control routes and tabs feature, Expo Notifications to make sure all the notifications will appear properly. Also, Lottie React Native was used for loading effects with JSON file animation.


💥 How to run

  • Prerequisites

    • It's necessary to have the last version of Node.js installed on the computer
    • It's necessary to have Git installed and configured on the computer
    • Also, It's necessary to have a package manager either NPM or Yarn.
    • Finally, it is essential to have Expo installed globally on the machine.

Clone the repository:

  $ git clone https://github.com/paulo-carvalho93/plantmanager.git

📱 Mobile

You need JSON-SERVER installed globally on your machine to get all the information from a fake backend. Follow the instructions below:

  # Install JSON-SERVER
  # Use one of the commands below depending which package manager you have.
  # YARN
  $ yarn global add json-server
  
  # NPM
  $ npm install -g json-server
  

After that, you just need to put the IP Address of your machine at api.ts:

 $ baseURL: 'http://YOUR_API_ADDRESS:3333'

Here, I'm assuming that you have Android/Iphone Emulator and Expo app is installed. You can also use your smartphone, just download the EXPO app and read the QR code that is shown on Expo Dashboard.

  # Start JSON-SERVER
  $ json-server ./src/services/server.json --host YOUR_API_ADDRESS --port 3333 --delay 700
  
  # Start project
  $ expo start