Maple

A travel planning application that helps you organize your trips, discover new places, and create detailed itineraries. Maple is your personal travel assistant, designed to make your journeys seamless and memorable.

As seen on https://ai.google.dev/competition/projects/maple

Features

• Trip Planning: Create and manage your trips, including dates, destinations, and activities.
• Interactive Map: Visualize your travel plans on an interactive map with custom pins for places of interest.
• Place Discovery: Search for and save interesting places, such as restaurants, hotels, and attractions.
• Itinerary Management: Organize your daily schedules with a detailed itinerary for each trip.
• Checklists: Keep track of your travel preparations with customizable checklists.
• Personalization: Customize your experience with preferences for currency, language, and more.

Screen Recording

compressed-video.mp4

Screenshots

Getting Started

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites

• Node.js and npm
• Expo CLI
• An iOS or Android simulator, or a physical device

Environment Variables

This project requires Google Maps API keys for iOS and Android. You will need to create a .env file in the root of the project and add the following variables:

GOOGLE_MAPS_IOS_KEY=your_ios_key
GOOGLE_MAPS_ANDROID_KEY=your_android_key

Installation

1. Clone the repo

   git clone https://github.com/oscarmuya/maple.git

2. Install NPM packages

   npm install

Running the Application

• To run the app on iOS:

  npm run ios

• To run the app on Android:

  npm run android

• To run the app on the web:

  npm run web

Infrastructure

• Backend: Firebase is used for backend services, including:
  • Authentication: User sign-up and login.
  • Firestore: A NoSQL database for storing user data, trips, and places.
  • Storage: For user-uploaded content like photos.
• APIs:
  • Google Maps Platform: For maps, location services, and place information.

Built With

• React Native - The web framework used
• Expo - The framework for making universal native apps
• Redux - For state management
• React Navigation - For routing and navigation
• NativeWind - For styling

Permissions

The application requires the following permissions on Android:

• ACCESS_COARSE_LOCATION
• ACCESS_FINE_LOCATION
• ACCESS_BACKGROUND_LOCATION
• FOREGROUND_SERVICE
• FOREGROUND_SERVICE_LOCATION
• READ_CALENDAR
• WRITE_CALENDAR

Scripts

• start: Starts the Expo development server.
• reset-project: Resets the project.
• android: Runs the app on a connected Android device or emulator.
• ios: Runs the app on the iOS simulator.
• web: Runs the app in a web browser.
• test: Runs the test suite.
• lint: Lints the code.

Folder Structure

├───app/                # Main folder for the application's routes and screens.
├───assets/             # Static assets like images, fonts, and lottie files.
├───components/         # Reusable components used throughout the application.
├───constants/          # Global constants like colors, dimensions, and utility functions.
├───firebase/           # Firebase configuration and initialization.
├───hooks/              # Custom hooks for reusing logic across components.
├───lib/                # Core application logic, including server-side code and state management.
├───scripts/            # Utility scripts for project management.