travel-tracker
Travel Tracker
This is an application to manage and track different trips for users and a travel agency.
It can be accessed here through GitHub Pages.
Motivation and rubric
This project was completed as a project at Turing School of Software & Design during Module 2.
The goals and objectives are to use OOP to drive the design of the application and the code, work with an API to send and receive data, solidify the code review process, & create a robust test suite that thoroughly tests all functionality of a client-side application.
Reflections
A challenge was getting the new cards displaying on the DOM. This took a large amount of time.
Big successes were the Sass, fetches, and posts. These will be very useful to know moving forward.
Languages and technology
Written in JavaScript, Mocha, Chai, HTML, & SCSS
Utilizes Webpack, NPM, & Node
Built with Visual Studio Code
Repository install and setup
Clone project repository
Enter the following command in the Terminal:
git clone https://github.com/hayleyw7/travel-tracker.git
Navigate to folder
Enter the following command in the Terminal:
cd travel-tracker
Install dependencies
Enter the following command in the Terminal:
npm install
Run local host
Enter the following command in the Terminal:
npm start
API install and setup
Clone API repository
Enter the following command in the Terminal:
git clone https://github.com/turingschool-examples/travel-tracker-api.git
Navigate to folder
Enter the following command in the Terminal:
cd travel-tracker
Install dependencies
Enter the following command in the Terminal:
npm install
Run API
Enter the following command in the Terminal:
npm start
Access and use website
Enter the following URL in your internet browser:
http://localhost:8080/
A user logs into the site with the username traveler + their ID.
You will be presented a dashboard of current, past, pending, and future trips. You will also see your yearly payments so far.
If you click “Trip Planner”, you will be able to schedule a trip.
Once you fill out and submit that form, you will see an estimated price, and then you can confirm it. Note that you will not be charged until it’s approved by an agent.
Once you confirm it, you’ll be send back to your dashboard, where it will be under “pending”.
To end the session, click “Log Out”.
GIFs
Future addition
-
I will allow an agent to login to the website to approve pending trips.
-
I will let the user decide the order their dashboard categories.
Contributors
Project completed by Hayley Witherell
Project designed by instructors at Turing School of Art & Design
API designed by Travis Rollins & Hannah Hudson