Capstone Project of Front End Web Developer Nanodegree Program from Udacity, aiming to create a web tool, with which user can enter the trip destination, the departing and returning date and personal notes, to create a travel plan with weather forecast, an image of the destination, information of the country and notes.
- Add end date and display length of trip.
- Pull in an alternative image.
- Integrate the REST Countries API to pull in data for the country being visited.
- Allow the user to remove the trip.
- Incorporate icons into forecast.
- A memo function which allows user to enter information relating to the trip.
- A print button on the left which allows user to print their trip.
- Use Local Storage to save trips.
- Allow the user to add additional trips.
- cors
- body-parser
- webpack plugins and loaders
-
Clone the project to local device
-
Make sure Node(v14.21.3) and npm(v6.14.4) are installed from the terminal, and run
npm install -
By package compatibility issues, please install plugins and loaders with the proposed version set from package.json, and run
npm i --legacy-peer-deps
- Sign up for the first three API ID/keys from the link above and make sure dotenv package is installed
- Create a .env file in the root of this project and fill the file with the API keys
geoUsername = *********
weatherAPIKey = *************************
pixAPIKey = *************************
| Command | Action |
|---|---|
npm run build-prod |
build |
npm start |
run |
npm run build-dev |
develope |
- "Promise chaining is dead. Long live async/await - LogRocket Blog"
- "Axios vs. fetch(): Which is best for making HTTP requests? - LogRocket Blog"
- How to store objects in HTML5 localStorage
- How to use Local Storage with JavaScript
- Sort an Array of Objects by Date property in JavaScript
- String.prototype.replace()
- How to test Express.js with Jest and Supertest
- Scroll Back To Top Button
- Clickable Dropdown
- Background image
- Markdown badges
Adding new features, fixing bugs or any other questions, Please feel free to contact me: Yanqin Q (yq.qualmann@gmail.com)