Like 2 Hike

An interactive JavaScript Application that uses the Google Maps API and the Hiking Project Data API to help users find available hiking trails based on a given location.

Live Demo

Try the application live at: https://like2hike.johnnyungcodes.com/

Technologies Used

JavaScript
jQuery (AJAX)
Node.js
Express
Bootstrap 4
Font Awesome 5.12.1
HTML5
CSS3

Features

Location input field that automatically adjusts input values to geocode information.
Interactive map that displays markers of 10 available hiking trails in a set radius
Information section of each trail retreived from query
Mobile Responsive: compatible in portrait and landscape mode for iPhone 6/7/8 and iPad

Preview

Getting Started

Clone the repository and change into directory

git clone https://github.com/johnnyung91/like-2-hike.git

cd like-2-hike

Install dependencies using NPM.
```
npm install
```
Register for personal API keys at: Google Maps API and Hiking Project Data API
Create a .env file using provided .env.example as a template. Insert new value for hiking_APIKey with personal API key from Hiking Project API.
```
PORT=3001
DEV_SERVER_PORT=3000
hiking_APIKey=YOUR_API_KEY
```

Open index.html and substitute Google Maps API key with your own personal API.

<script async defer
  src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY">
</script>

Start the application by initializing Node server using the following command line. Once started, the application can be viewed by visiting https://localhost:3001 in your browser.
```
npm run dev
```