Milestone 3 - Dynamic Application Prototype

Instructions

Iterate on the work you did for Milestones 1 and 2 to finally complete the web application. In the earlier milestones, the focus was on the structure and presentation of the site. Now, the priority is the behavior of the site, but as the final deliverable, you should also make sure that the structure and presentation are complete.

Requirements

3.1

Your app must use at least one media query to implement its responsive design.

• this media query might not appear in your own source code (if it's something your chosen design framework is handling)

3.2

You may (and are strongly encouraged) to augment the default style with your own CSS to create more pleasing aesthetics. (Bootstrap's color schemes are not exactly the most beautiful...)

3.3

Your site must use localStorage to store and retrieve updated data values between sessions. I.e. what is displayed as content should reflect these changes. Often these actions are called "CRUD" Create, Read, Update, and Delete

3.4

However you implement the CRUD actions, your implementation should contain forms that

1. make appropriate use of labels, buttons, and input groups. The forms should use a combination of input, select, checks, radios, and possibly other input types based on the data being entered.
2. form submissions should include appropriate event handlers to refresh the displayed data

3.5

One possible implementation of CRUD actions in the frontend could be to use a widget such as Bootstrap's modal, but it is not required that you do so. Rather it's required that you use a flow that reflects best practices from around the web. If you choose to use a modal you might:

1. have one modal that allows users to add new data values.
2. have one modal that allows users to edit existing data values.
3. have one modal that allows users to delete existing data values.
4. have forms within the The add and edit modals
5. form submissions within a modal should include appropriate event handlers to refresh the displayed data likely should also dismiss the modal.

3.6

Your site must provide a Blob to export the current data values as a new JSON file.

3.7

Your site should provide the user a means to clear their data (to start from a fresh beginning)

3.8

Each page and stylesheet of your site must validate without any warnings or errors using the Nu Validator and WAVE Web Accessibility Evaluator.

3.9

Your app must make at least 2 network requests to 3rd party APIs via javascript (e.g. via `fetch`). You must demonstrate your understanding of javascript features to sequence these requests, such that only after you have the response from the first, you make the 2nd request (typically this is because the 2nd request needs to include some information that was directly in or computed form the response to the first request).