Skip to content

Developing Work Skills · Career & Development

Interactive Browser Apps

Build a small study planner with useful feedback, saved practice data and a resource lookup.

Level
Intermediate
Estimated study
About 14 hours
Lessons
12 lessons in 4 modules
Format
Online, self-paced
Start your free 7-day trialAlready a student? Open course

Monthly: $0 today with a card, then $34 on day 8 unless you cancel before then. After the trial, 30 days' notice applies. Active on-campus students have academy access included. Check your existing student account before buying another subscription.

About this course

For learners who finished Programming Foundations with JavaScript. In about 14 hours you will connect JavaScript to a page and build a study planner with validated forms, editable lists, saved browser data and a resource lookup that handles loading and errors.

What you will be able to do

  • Build accessible forms and update the DOM in response to events.
  • Use browser storage for non-sensitive data.
  • Handle loading, empty, success and error states when requesting data.

Course outline

Module 1: Events and the page

3 lessons · 3 h

Find elements, respond to input and update content without losing keyboard access.

  1. Find elements and update their text1 h
  2. Respond to native control events1 h
  3. Render a task collection safely1 h

Module 2: Forms and local storage

3 lessons · 3 h 30 min

Validate inputs, manage a collection and restore saved non-sensitive data.

  1. Validate titles and whole-minute durations1 h
  2. Edit and remove tasks by stable identity1 h 30 min
  3. Save and restore non-sensitive practice data1 h

Module 3: Fetch and asynchronous work

3 lessons · 3 h

Use promises and async functions with local fixtures and a documented public API.

  1. Represent waiting with promises and async functions1 h
  2. Fetch and validate a local JSON resource file1 h
  3. Define resource contracts and cancel outdated requests1 h

Module 4: Build a complete interaction

3 lessons · 4 h 30 min

Review feedback, errors and edge cases in a small application.

  1. Prepare the final planner shell and state helpers1 h
  2. Connect editing, filters, saving and lookup1 h 30 min
  3. Review and hand over the complete planner2 h
Get helpStart 7-day trial