Create a class that would expand on the concepts of Mobile Friendly First (Responsive Content, Accessibility) and Intro to Javascript (Promises, Objects, Handling Data). Additionally, this class would serve as an introduction to databases and making requests to create, read, update, or delete data.
- Vanilla JavaScript - No Front-End Frameworks (i.e. Angular, React, etc.)
- Service Workers - Cache assets like project files and images for offline access
- Fetch API - Use the Fetch API to create, read, update, or delete data from a database
- Indexed DB - Store data retrieved from a DB to to be accessible for offline use
Students would be provided with a local server that contains some mock JSON data. That website they build should:
- Utilize a service worker to cache assets like project files and images for offline use.
- Use the Fetch API to retrieve and modify data.
- Store any retrieved data in an Indexed DB database.
- If there is no network connection, pull data from Indexed DB.
- If there is no network connection, store network requests until a connection is established, then send the request.
- Adapt to any screen size.
- Be built with accessibility in mind by maintaining proper tab order, aria attributes, color contrast, etc.
- Use optimized for web photos. Optionally, lazily load these images with the Intersection Observer API.
- Maintain basic functionality with no online connection.