Turing School of Software & Design
2108 FEE, Mod 2 - Final Solo project
Travel Tracker is a web app that allows users to interact with a travel agent to view their trips both past and present, as well as book new trips. They have a single dashboard that they log into with their credentials which then allows them to browse through 50 destinations and decide if they want to request a new trip.
)
- JavaScript
- HTML
- CSS
- Webpack
- Glide.js
- GitHub
- Clone down the local API server and follow install instructions here
- Clone down this repository
cdinto the directory- Run
npm install - Run
npm startto open local server - Open
localhost:8080in your browser
- On load, users will see a username and password login section. They will need to enter correct credentials to take them to their personal dashboard.
- Once they have successfully logged in, they will see a menu to the right, that if clicked on, will show them their past, upcoming and pending trips. They can also see their expenses on travel for the current year.
- Users have the option to scroll through some photos of possible destinations towards the bottom. When they hover over an image, the location will appear underneath.
- Users can then select a destination from a dropdown menu, enter a date of travel as well as the duration and amount of travelers they will have.
- They will first see an estimate of their travel costs for that particular trip
- If they choose to book the trip, they can click the 'book-it' button which will send the travel request to the local api for the travel agent
- The page will immediately move to the user's pending trips section
- Destination photos will be added dynamically
- Users will be able to choose a photo to begin their booking
- An entire separate page for login
Background suitcase photo from Adobe Stock Photo