Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/sws-5007/travel-advisor_react.js

A React JS Travel Companion App using Rapid API.
https://github.com/sws-5007/travel-advisor_react.js

mui5 react

Last synced: 5 days ago
JSON representation

A React JS Travel Companion App using Rapid API.

Host: GitHub
URL: https://github.com/sws-5007/travel-advisor_react.js
Owner: SWS-5007
License: mit
Created: 2024-02-01T23:57:38.000Z (11 months ago)
Default Branch: main
Last Pushed: 2024-02-01T23:58:22.000Z (11 months ago)
Last Synced: 2024-11-08T13:08:00.483Z (about 2 months ago)
Topics: mui5, react
Language: JavaScript
Homepage: https://travel-advisor-reactjs.netlify.app/
Size: 180 KB
Stars: 1
Watchers: 1
Forks: 3
Open Issues: 0
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE.md
- Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        # Travel Advisor - React JS Travel Companion App

![Travel Companion App with React JS](https://user-images.githubusercontent.com/71302066/174569416-9e8250a9-87ef-49f4-be4a-f077196fe12f.png)

[![Ask Me Anything !](https://img.shields.io/badge/Ask%20me-anything-1abc9c.svg)](https://github.com/Technical-Shubham-tech)

[![GitHub license](https://img.shields.io/github/license/Technical-Shubham-tech/travel-advisor?)](https://github.com/Technical-Shubham-tech/travel-advisor/blob/main/LICENSE.md)

[![Maintenance](https://img.shields.io/badge/Maintained%3F-yes-green.svg)](https://github.com/Technical-Shubham-tech/travel-advisor/commits/main)

[![GitHub branches](https://badgen.net/github/branches/Technical-Shubham-tech/travel-advisor/)](https://github.com/Technical-Shubham-tech/travel-advisor/branches)

[![Github commits](https://badgen.net/github/commits/Technical-Shubham-tech/travel-advisor/main)](https://github.com/Technical-Shubham-tech/travel-advisor/commits)

[![Website](https://api.netlify.com/api/v1/badges/29710a1c-50d3-471a-a525-b37e473da25d/deploy-status)](https://travel-advisor-reactjs.netlify.app/)

[![GitHub issues](https://img.shields.io/github/issues/Technical-Shubham-tech/travel-advisor)](https://github.com/Technical-Shubham-tech/travel-advisor/issues)

## ⚠️ Before you start

1. Make sure **Git** and **NodeJS** is installed

2. **Yarn** is faster than Npm. So use [Yarn](https://classic.yarnpkg.com/lang/en/docs/install/).

3. Create .env.local file in root folder.

4. Contents of **.env.local**

```

REACT_APP_GOOGLE_MAP_API_KEY="XXXXXXXXXXXXXXXXXX"

REACT_APP_RAPID_API_KEY="XXXXXXXXXXXXXXXXXXXXX"

```

5. Go, to [Google Cloud Developers Console](https://console.cloud.google.com/projectcreate) and create a project.

![create a project](https://user-images.githubusercontent.com/71302066/174559275-458bbcec-6997-41f0-b359-1139e00fc759.png)

6. Once you created the project, make sure to select it from Header section.

![select your project](https://user-images.githubusercontent.com/71302066/174560599-92b3395c-9f43-4b42-a618-4151776b192d.png)

7. From Sidebar, Go to APIs & Services > Credentials > Create Credentials > **API Key**

![create api key](https://user-images.githubusercontent.com/71302066/174561372-6907aaf6-c538-46df-bd9e-6dfa08b9dd35.png)

8. Now click on **SHOW KEY** to get your `REACT_APP_GOOGLE_MAP_API_KEY`.

9. Now, to setup Travel Advisor and Weather API, go to [Rapid API Website](https://rapidapi.com/) and create an account.

10. Enable these two APIs for travel and weather data: [API 1: Travel Advisor](https://rapidapi.com/apidojo/api/travel-advisor/) and [API 2: Open Weather Map](https://rapidapi.com/community/api/open-weather-map/).

![Copy API Key](https://user-images.githubusercontent.com/71302066/174563987-a29b9be5-390b-4dbd-9d3f-f7a19e42172b.png)

11. After enabling you can get your API Keys and paste them in `.env.local` file in `REACT_APP_RAPID_API_KEY`.

**NOTE:** Make sure you don't share these keys publicaly.

## 📌 How to use this App?

1. Clone this **repository** to your local computer.

2. Open **terminal** in root directory.

3. Type and Run `yarn install`.

4. Once packages are installed, type and run `yarn start`

5. Now app is fully configured and you can start using this app :+1:

## 📃 Built with

[](https://www.javascript.com/)

[](https://reactjs.org/)

[](https://developers.google.com/maps)

[](https://rapidapi.com/)

[](https://github.com/Technical-Shubham-tech)

## 🔧 Stats

![Stats for this App](https://user-images.githubusercontent.com/71302066/174568045-5964dfac-6e6f-4c90-b161-c9181ef6623d.svg)

## 🙌🏼 Contribute

You might encounter some bugs while using this app. You are more than welcome to contribute. Just submit changes via pull request and I will review them before merging. Make sure you follow community guidelines.

## Buy Me a Coffee 🍺

[](https://www.buymeacoffee.com/sanidhy "Buy me a Coffee")

## 🚀 Follow Me

[![GitHub followers](https://img.shields.io/github/followers/Technical-Shubham-tech?style=social&label=Follow&maxAge=2592000)](https://github.com/Technical-Shubham-tech)

[![Twitter](https://img.shields.io/twitter/url?style=social&url=https%3A%2F%2Ftwitter.com%2FTechnicalShubam)](https://twitter.com/intent/tweet?text=Wow:&url=https%3A%2F%2Fgithub.com%2FTechnical-Shubham-tech%2Fmedical-chat-app)

[![YouTube](https://img.shields.io/badge/YouTube-FF0000?style=for-the-badge&logo=youtube&logoColor=white)](https://www.youtube.com/channel/UCNAz_hUVBG2ZUN8TVm0bmYw)

## ⭐ Give A Star

You can also give this repository a star to show more people and they can use this repository.