Coder Social home page Coder Social logo

holiday-road-grand-canyon-v2's Introduction

Holiday Road from Nashville

You and your teammates have been contracted by the National Parks Service to build an application that will allow people to build itineraries for their trips to the beautiful national parks that they maintain. The starting point of each trip will be Nashville, TN, but the destination will a national park selected by the user.

Getting Started

This is going to be your first full, professional Sprint. A Sprint is part of the Scrum Framework for agile development. You will be doing daily scrum stand-ups, where you provide a concise status update on your own work. You will be taking part in a sprint review where you demonstrate the work you have completed. You will be taking part in a retrospective, where the team reflects on the work done, the team dynamics, and discuss how to improve in the future.

Code Review

During this sprint, the focus will be on learning, much more than doing. We estimate that most teams could get this project done in 2-3 days. We are giving you 5.

To accomplish maximum learning, the following requirement is placed on the team, and will be monitored by your team lead. When a teammate submits a PR, and you are ready to review it, then you and the submitter must sit together and review all of the code that was written. Also, if any other teammates would like to review the code, then you must include them on the review.

Only when you feel you understand all of the code, you may then complete testing of the feature and provide approval for merging.

Feature List

Building the Itinerary

  • List all national parks in a dropdown. When user chooses one, display the name of the park in the Itinerary Preview section.

  • List all bizarraries in a dropdown. When user chooses one, display the name of the bizarre attraction in the Itinerary Preview section.

  • List all eateries in a dropdown. When user chooses one, display the name of the eatery in the Itinerary Preview section.

Itinerary Details

  • In the Itinerary Preview section, there should be a button labeled Save Itinerary. It should be disabled by default.

  • When the user has selected a park, and the name of the park has been added to the Itinerary Preview section, query the Open Weather API and display the 16 day forecast for that location. This will allow the user to see if they want to make the trip soon.

  • When the user adds any item to the Itinerary Preview, there should be a Details button next to the name of the item.

  • When the user clicks on any detail button for an itinerary item, a dialog box should be presented to the user with more information about that item (description, address, etc...).

  • Once the user has selected a park, a bizarre attraction, and an eatery, the Save Itinerary button should be enabled.

  • When the user clicks the Save Itinerary button, the chosen items should be saved as an object in your own, local API that is managed by json-server. Each saved itinerary should appear in an aside bar on the right side of the UI.

Stretch Goal: Directions

Only after the main fetures of the application listed above are complete, you can work on the stretch goal of providing directions. For this feature, you will be using the Graphhopper API.

Once the user has saved an itinerary, and it is listed on the aside bar, refactor your application to add a Get Directions button to each HTML representation of the itinerary. When the user clicks that button for an itinerary, the user should be presented with step-by-step instructions for the trip. It should include

  • All 4 locations (Nashville, bizarrerie, eatery, and national park) need to be sent to Geocoding API to the the latitude and longitude for each one.

  • Then all 4 lat/long pairs should be in the URL for the request to the Routing API.

  • The step-by-step instructions in the response from the Routing API should be displayed below the Itinerary Preview section.

Stretch Goal: Multiple Bizarreries and Eateries

For this stretch goal, the user can still only pick one national park as the destination, but multiple bizarreries, and multiple eateries can be chosen as waypoints along the way.

Stretch Goal: Park Events

Add a button to a saved itinerary labeled Events. When the user clicks the button, query the NPS API to get the first two events (use the limit query parameter) for that park. Then display the following data in a dialog box.

  • title
  • dateStart
  • timeStart
  • timeEnd
  • description
  • feeInfo

National Park Service API

List All Parks

https://developer.nps.gov/api/v1/parks?api_key=your_api_key

Weather API

https://openweathermap.org/api

Bizarre Destination

http://holidayroad.nss.team/bizarreries

Eateries Destination

http://holidayroad.nss.team/eateries

Graphhopper API

  1. Register at https://graphhopper.com/dashboard/#/register
  2. Once you are authenticated, visit your dashboard at https://graphhopper.com/dashboard/#/overview
  3. Request an API key at https://graphhopper.com/dashboard/#/api-keys

Get Coordinates of Place

Request

https://graphhopper.com/api/1/geocode?q=yosemite+national+park&locale=us&debug=true&key=your_api_key

Example Response

{
    "hits": [
        {
            "osm_id": 1643367,
            "osm_type": "R",
            "extent": [
                -119.8861004,
                38.1863499,
                -119.1995075,
                37.4946797
            ],
            "country": "United States of America",
            "osm_key": "leisure",
            "housenumber": "PO box 577",
            "street": "Mt. Hoffmann Trail",
            "osm_value": "nature_reserve",
            "postcode": "95389",
            "name": "Yosemite National Park",
            "state": "California",
            "point": {
                "lng": -119.51658779802511,
                "lat": 37.84054795
            }
        }
    ],
    "took": 24
}

Get Directions

Once you have the coordinate of a place, you can get directions to it. The first point query parameter below is the origin, and the last is the destination. If you have more than waypoint along the way, keep adding points, but always make sure origin is first and destination is last.

https://graphhopper.com/api/1/route?point=starting_latitude,starting_longitude&point=destination_latitude,destination_longitude&vehicle=car&locale=us&instructions=true&calc_points=true&key=your_api_key"

Personas

Anna

Betsy

Brittany

Caroline

Charles

Jake

Peter

holiday-road-grand-canyon-v2's People

Contributors

macgibbons avatar aborgra avatar garrettfreshwater-nss avatar etamez173 avatar leahhoefling avatar stevebrownlee avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.