JavaScript - Web APIs Overview

Overview

Estimated time: 15–20 minutes

Web APIs extend JavaScript's capabilities in the browser, providing access to features like networking, storage, and device hardware.

Learning Objectives

• Understand the role of Web APIs in JavaScript.
• Use common APIs such as fetch, localStorage, and geolocation.

Prerequisites

• JavaScript - Custom Events

Common Web APIs

• fetch: Network requests
• localStorage: Persistent storage
• geolocation: Device location

Examples

fetch('https://api.example.com/data')
  .then(response => response.json())
  .then(data => console.log(data));

localStorage.setItem('key', 'value');
console.log(localStorage.getItem('key'));

navigator.geolocation.getCurrentPosition(pos => {
  console.log(pos.coords.latitude, pos.coords.longitude);
});

Common Pitfalls

• Some APIs require user permission (e.g., geolocation).

Summary

Web APIs are essential for building modern, interactive web applications.