freecoding.school100% FREE · NO SIGNUP
Input HarborISSUE #27 of 46

web apis · the platform surface

FormaVSCaptain Invalid Input
Forma saysThe browser ships dozens of JavaScript APIs — geolocation, storage, workers, and more — that turn a page into an app.

"HTML5" is shorthand for the modern web platform: not just tags, but a huge set of browser Web APIs reachable from JavaScript. Geolocation, local storage, drag-and-drop, notifications, the clipboard, background workers, real-time channels — all built in.

These are what let a web page rival a native app. Each is its own object on window or navigator; you feature-detect (if ('geolocation' in navigator)) before using one, since support and permissions vary.

Power-ups you unlock

Captain Invalid Input attacks — common mistakes

Boss battleFeature-detect three APIs (geolocation, localStorage, clipboard) and print which are available in this sandbox.

Example code

<!doctype html>
<html><head><meta charset="utf-8"></head>
<body style="background:#06040d;color:#e6e0ff;font-family:monospace;padding:20px">
  <pre id="out"></pre>
  <script>
    const apis = ['geolocation','clipboard'].map(k => k + ': ' + (k in navigator));
    apis.push('localStorage: ' + ('localStorage' in window));
    apis.push('serviceWorker: ' + ('serviceWorker' in navigator));
    document.getElementById('out').textContent = apis.join('\n');
  </script>
</body></html>
▶ Open the interactive comic issue
‹ Youtube · Iframe EmbedsGeolocation · Lat · Lon · Permission ›