davidcastillog / travelfy-client

Travel planner. Find attractions, hotels, restaurants and save places on your trip list. Check a 7-day weather forecast. Google Maps. React App. MERN stack.

Travel planner

MERN stack app
View Demo

Table of Contents

1. About The Project
   • Built With
2. Getting Started
   • Prerequisites
   • Installation
3. API required
4. Scripts
5. Usage
6. License
7. Contact

About The Project

This is a travel planner MERN stack app.

You will find:

• Attractions, hotels and restaurants from anywhere in the world. Map and Place list. 🌎
• Save the places you love in a trip list. (MongoDB = Reduce API calls) 🗺️
• Around me section. (This will get the user's IP, find the lat&lng with it and show the map and places around)
• 7-day weather forecast for any city. ☔
• User Profile (Profile image, username, name, change password)
• Google Maps and Google Autocomplete.

back to top ^

Built With

• React.js
• Material-UI
• Node.js
• Express.js
• MongoDB

back to top ^

Getting Started

To get a local copy up and running follow these example steps:

Prerequisites

Verify if you already have Node.js and npm installed:

node -v
npm -v

To download the latest version of npm, on the command line, run the following command:

npm install -g npm

Installation

Follow this simple steps:

1. Clone the repo

   git clone https://github.com/davidcastillog/travelfy-client.git

2. Install NPM packages

   npm install

3. Enter all your API keys in .env file

   REACT_APP_NAME_API = 'ENTER YOUR API';

Note:

• This is the Front-end (client) repository.
• You need to clone the Back-end (server) repository.

back to top ^

API

Client:

• Google Maps
• Open Weather
• Rapid API Travel
• FreeGeoIp

Server:

• Cloudinary

back to top ^

Scripts

In the project directory:

 npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

 npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

back to top ^

Usage

Place list

Includes Google Autocomplete & place filters

My Trips

Save places for each trip

Map with trip markers

Weather

7-day forecast for any city in the world

back to top ^

License

Distributed under the MIT License. See License.txt for more information.

back to top ^

Contact

David Castillo

Linkedin: https://linkedin.com/in/davidcastillog

back to top ^