Intermediate JavaScript

Intermediate JavaScript picks up where JavaScript Foundations left off. You know the fundamentals — variables, functions, DOM manipulation, events, and localStorage. Now you will work with the patterns and APIs that define modern JavaScript development.

Every concept in this course is applied directly to BudgetBuddy — a personal expense tracker you build from scratch and ship as a complete, working app by the final module.

What you will learn

• Array methods — forEach, map, filter, find, reduce, some, and every for working with collections of data
• ES6 classes — constructors, methods, inheritance, and private fields for organizing logic into reusable objects
• ES modules — import and export for splitting code into focused files and managing dependencies
• Destructuring and spread — concise syntax for extracting values from objects and arrays and composing new ones
• The Fetch API and Promises — requesting data from external APIs and handling asynchronous results with .then() and .catch()
• async/await — the modern syntax for writing asynchronous code that reads like synchronous code

Prerequisites

This course assumes you have completed JavaScript Foundations or have equivalent knowledge. You should be comfortable with variables and data types, functions, DOM manipulation, event listeners, and localStorage. No prior experience with any of the above topics is assumed.

The BudgetBuddy project

All seven modules build the same real application — BudgetBuddy, a personal expense tracker that runs in the browser.

The finished app:

• Lets you add, view, and delete expenses with an amount, description, category, and date
• Uses array methods to filter expenses by category, sort by date, and calculate totals
• Models each expense as a class instance with consistent structure
• Is organized into ES modules — separate files for data, UI, and API logic
• Fetches live currency exchange rates from the ExchangeRate-API to display amounts in any currency
• Persists all data to localStorage so expenses survive page reloads

By Module 07 you will wire all of these pieces together into a working, deployable app.

View the live app | View on GitHub

Modules

01 — Array Methods

• Arrays: A Review
• forEach and map
• filter and find
• reduce
• Chaining Array Methods
• Module Recap

02 — ES6 Classes

• What Is a Class?
• The constructor and Properties
• Methods
• Inheritance with extends
• Private Fields and Static Members
• Module Recap

03 — ES Modules

• What Are Modules and Why They Matter
• Named Exports and Imports
• Default Exports
• Organizing a Project with Modules
• Module Scope and the Module Graph
• Module Recap

04 — Destructuring and Spread

• Object Destructuring
• Array Destructuring
• Default Values and Renaming
• The Spread Operator
• The Rest Parameter
• Module Recap

05 — Fetch API and Promises

• What Is a Promise?
• then, catch, and finally
• The Fetch API
• Handling JSON Responses
• Error Handling and Network Failures
• Module Recap

06 — Async/Await

• async Functions and await
• Error Handling with try/catch
• Fetching Data with async/await
• Sequential vs Parallel Async Operations
• Refactoring Promise Chains to async/await
• Module Recap

07 — BudgetBuddy Project Build

• Project Setup and File Structure
• Expense Data and Array Methods
• The UI Module and Rendering Layer
• Fetching Exchange Rates
• Building the UI
• Course Recap and What’s Next