Travel Tracker (Turing Touring) Application

This is a web-application for the ficttional travel agency 'Turing Touring'

When logged in a user may:

1. View their current or pending trips
2. View and manage their travel expenses.
3. Book a new trip and submit to the agency for approval

About

For the avid traveler, whether for business or pleasure access to travel records and visbiility of expenses are critical. This application keeps all of the information one might want to see in an easy-to-read format

Technology Stack

The following were used for this project

1. Travel Tracker API
2. HTML
3. Javascript
4. SCSS
5. Mocha Testning Framework
6. Chai Assertion Library
7. Webpack
8. Date-fns library

App preview

Challenges / Successes

Challenges

• One of my main challenges with regards to this project was getting all of the moving pieces to work nicely together. One of my goals was to present this appl as one belonging to a luxury travel agency. That meant stretching my design skills to include crossfades, multiple images, and strateigc placement of elements on the screen

• The way the raw data was presented was also a challenge. As I went through the process of creating the application, I noticed quite often that what I felt an applicatioj like this needed to show, and what the data was limiting me to were two differnet things. For example splitting the user's first and last name, or correcting US states that were original input as countries.

Successes

• Utilizing multiple different iterator methods including reduce, forEach, filter and find. Many of these had been a bit difficult to grasp at first, but using them in this project has been a tremendous help in the regard
• Figuring out how to crossfade transitions between different menus etc.
• Becoming much more comfortable with FETCH methods including POST, DELETE and GET

Application Set Up

Front End

Fork this repository Clone your own local version of the repository CD into the directory and run npm install to install project dependencies Run npm start to start the server

Back End

In order for the data to be available to the application. You also need to install the local backend server. To do so clone the respository here CD into the directory and install dependencies with npm install To start the server, run NPM start in a separate terminal in your project Open the local server http://localhost:8080/ in your web browser

In order to login, you may select a client number from 1 to 50 The passowrd to login is 'travel'