A web application that allows users to pick their style, setting, location and date of their preferred camping getaway. The application also displays addresses of campsites that fit their personal preferences onto a digital map, as well as includes pictures of the picked campsite.
| Behavior Our program should handle: |
Input example When it receives: |
Output example It should return: |
|---|---|---|
| User selects a camping style. | tent / RV / cabin. | return what is selected and a corresponding image. |
| User selects a setting. | mountains / coast / river. | return what is selected and a corresponding image. |
| User submits state. | Oregon / Washington / California. | return campsites in that State. |
| Program displays content matching the user style, setting and State. | push "Submit" button | Returns matching campsite with cost for one person staying one night, and amenities. |
| User submits a date for beginning of reservation. | 04/06/2017 | return selected date. |
| User is asked how many nights they will be staying. | 3 | return "3 nights" with corresponding image. |
| User is asked how many people will be staying. | 2 | return "2 people" with corresponding image. |
| Program will display cost per night per person. | push Submit button | Returns total cost of location, and google map of campsite location. |
| User is asked to enter their name and email address. | "Joe Doe", "[email protected]" | Returns "Thank you, Joe Doe! We have sent a confirmation email to [email protected]". |
| User can reset form | Press "Reset Form" | Refreshes page starting the process over. |
- Clone from GitHub Repository
- Open index.html using any modern browser
{Leave nothing to chance! You want it to be easy for potential users, employers and collaborators to run your app. Do I need to run a server? How should I set up my databases? Is there other code this app depends on?}
No known bugs.
If you need help, have any concerns or comments please send them to [email protected]
HTML/CSS/Bootstrap JavaScript/jQuery
Determine the license under which this application can be used. See below for more details on licensing.
Copyright (c) 2017
Michel Jasper:
We used Michel's code to display a dynamic google map.
http://stackoverflow.com/questions/1300838/how-to-convert-an-address-into-a-google-maps-link-not-map/7898520#7898520
http://www.mikedoesweb.com/2012/convert-tag-to-google-maps-embed-automatically-with-jquery/
MadeByOliver: Calendar Icon.
Freepik: Night Icon.
Freepik: Hiker Icon.
MadeByOliver: Dollar Icon.
Freepik: Coast Icon.
Freepik: River Icon.
MadeByOliver: Cabin Icon.
Freepik: Trailer Icon:
Freepik: Mountains Icon.
Freepik: Tent Icon.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent