Rove

Meet Rove, your passport to endless travel inspiration – discover, bookmark, and explore your dream destinations effortlessly.

IMPORTANT NOTE!

We have removed the API Key from the database seed file, it was initially setup for the demo purpose. Currently all the API keys existed in the seed file will no longer be valid anymore. This will result all the images for each location will be blank, however, we got good news. You are required to get your own API key from Google Maps and all the new schedules that you will be adding; will contain images.

Also, the more the user add different part of the world destinations, the more place will show up for suggestions.

Tech Stack

• React
• PostgresSQL
• ExpressJS
• SASS
• Leaflet
• GoogleMaps API
• BootStrap
• MaterialUI

Team Members GitHub Links

• Kevin
• EunSoo
• Raymond
• Ahmed

Screenshot

Colour Palette

App Logo

Setup

Node ^20

Make sure you're on Node ^20

nvm install ^20
nvm alias default ^20

Clone Project

Do git clone this project to your directory:

git clone [email protected]:TinyMito/rove-app.git

Install Project

Run this commands at the base project directory. Please ignore the severity vulnerabilities warnings and errors. Keep in mind please this repo contains both client client-react and server side server-express. You will need to install npm in both.

cd rove-app

cd server-express && npm install && cd ../client-react && npm install && cd ../

PostgresSQL Setup

1. Please rename .env.example file to .env under server-express.
2. Login into your superuser psql and run \i server-express/src/db/create_database.sql.
3. Logout \q and switch user to psql -U development -d rove.
4. Run \i server-express/src/db/reset_database.sql to initialize the database.

Google API Key is Required

See here on how to get your personal Google Maps API key

CORS issues will be fixed in the future update!

1. Copy the .env.example and rename it to .env.
2. Copy and Paste your API Key into REACT_APP_API_KEY=.
3. Start the server-express cd server-express && npm run local.
4. Start the client-react cd client-react && npm start.
5. Please install CORS Extension FireFox / Chrome / Edge
6. Navigate to localhost:3000.

Sources

• React & Express Templates
• Avatar & Illutration

Notes

A Lighthouse Labs's Student Final Project.

App is entirely base on user data. We setup the initial database seed to kick start with data (Who's first chicken or egg?).

Stretched

• Mobile Optimization.
• Rework backend for Mobile compliance.
• Rework Style Strutures.
• Rework Google API integration to avoid CORS issues.