Project-1-getHAPI

This is the first group project for the Georgia Tech Full-Stack Flex Web Development bootcamp.

Group Name: getH.API

Group Members:

• Corey Parker
• Damian Grace
• Meredith Wall
• Shelley McHardy
• Terrell Morris

Description

This project was completed after learning Git, HTML, CSS, JavaScript, Web APIs, Third Party APIs, and Server Side APIs.

The project objective was to work with a group to create a real-world front-end application that we will be able to showcase to potential future employers.

The following acceptance criteria were used in the development of this project and web application:

• Application uses at least two server-side APIs

• Use a CSS framework other than Bootstrap.

• Be deployed to GitHub Pages.

• Be interactive (i.e., accept and respond to user input).

• Does not use alerts, confirms, or prompts (use modals).

• Use client-side storage to store persistent data.

• Be responsive.

• Have a polished UI.

• Have a clean repository that meets quality coding standards (file structure, naming conventions, follows best practices for class/id naming conventions, indentation, quality comments, etc).

• Have a quality README (with unique name, description, technologies used, screenshot, and link to deployed application).

User Story

• WHEN a user needs a quick pick-me-up,
• THEN the application provides a pick-me-up in the form of a random fact, dad joke, or inspiring quote for the user.
• WHEN a user opens the application,
• THEN they are presented with the option to either get a random pick-me-up OR select options for some knowledge (a random fact), some laughter (a dad joke), or some inspiration (an inspirational quote).
• WHEN a user chooses the 'Surprise Me' option,
• THEN they are presented with a randomly generated fact, dad joke, or inspirational quote.
• WHEN a user chooses the 'I need...' option,
• THEN they are presented with options for 'some knowledge', 'some laughter', or 'some inspiration'.
• WHEN a user chooses that they need 'some knowledge',
• THEN they are presented with a randomly generated fun fact.
• WHEN a user chooses that they need 'some laughter',
• THEN they are presented with a randomly generated dad joke.
• WHEN a user chooses that they need 'some inspiration',
• THEN they are presented with a randomly generated inspirational quote.
• WHEN a user is presented with their pick-me-up,
• THEN they are presented with an input field to rate the pick-me-up from 1 to 5.
• WHEN a user submits their rating for their pick-me-up,
• THEN their pick-me-up and rating is saved to local storage.
• WHEN a user loads the application or submits a rating for their pick-me-up,
• THEN they are presented with a sorted list of their top 5 rated previous pick-me-ups with associated ratings in the 'Your Favorites' section of the UI.
• WHEN a user has less than 5 previous pick-me-ups,
• THEN they are presented with as many previous pick-me-ups with associated ratings as are stored on their local storage.

Technologies Used and Resources

During the development of our application, the following resources and techonologies were used:

• Bulma (https://bulma.io/)

• JQuery library (https://code.jquery.com/)

• Random fact API (https://uselessfacts.jsph.pl/random.json?language=en)

• Dad joke API (https://icanhazdadjoke.com/)

• Inspiring quote API (https://type.fit/api/quotes)

• Consulted example code for compare and sort method (https://www.sitepoint.com/sort-an-array-of-objects-in-javascript/)

Mock-Up

The following shows the web application's appearance and functionality:

Deployed Application Link

The deployed GitHub page for this web application can be found: https://coreyparker12.github.io/Project-1-getHAPI/

The GitHub repository for this web application can be found: https://github.com/CoreyParker12/Project-1-getHAPI