/on-the-move

Primary LanguageJavaScript

On The Move

Epicodus Capstone Project 05/07/2021

By Levi Kohler

This project is not in a complete or portfolio ready state, and should not be considered as representation of professional work.

Description

Utilize Google Maps API to create a web application where users can input the name of a US city, indicate whether they plan to move to said city or just visit, and then receive relevant information. Ex; vacationing to a city would give you points of interest, popular tourist destinations, and possibly upcoming events. Moving to the city would give statistics like job growth, crime rate, median house cost etc.

Resources

Setup/Installation instructions

API Installation

  • Go to console.cloud.google.com
  • Make an account and go to 'Library' on the left side of the screen. You should see a 'Welcome to the API Library' message
  • Click on 'Maps Javascript API'
  • Enable 'Maps Javascript API'
  • Click on 'APIs' on the left of the scree to pull up a list of additional APIs
  • Enable both 'Geocoding API' and 'Places API'
  • Go to console.cloud.google.com/project/_billing/enable
  • Enable billing on the Google Cloud project, you get $200 free per month so for educational purposes you won't be charged

From the web

  • Copy this repositories URL to your clipboard

From the terminal

  • Navigate to your desktop using the terminal or your preferred equivalent
  • Clone my repository from GitHub using git clone https://github.com/levi-kohler/on-the-move in your terminal or equivalent
  • Navigate to the downloaded folder using cd command
  • Execute the code . command in your terminal and it will open all source code in your code editor

View website

A GitHub page is not available for this project. To view functionality in your browser:

  • Take the API generated for you above and paste it over both places where 'API_KEY' is listed
  • Navigate to the 'on-the-move' folder in your terminal
  • Enter npm install
  • enter npm run start
  • Open your browser and visit http://localhost:3000

Technologies used

  • React
  • JSX
  • JavaScript
  • npm
  • webpack
  • ESLint
  • Babel
  • Google Maps API
  • Google Maps Geocoding API
  • Google Maps Places API
  • Ant Design Library
  • Git & GitHub

Known bugs

  • When Google Maps is loaded onto the DOM there is no information listed in the table, it only shows up once the user inputs the name of a city or moves the pin

Contact Information

Ask Me Anything !

License and copyright

© Levi Kohler, 2021

License: MIT