Web API (original) (raw)

Skip to content

This section introduces you to the Web APIs specified in the HTML5 specification. These Web APIs allow you to use the modern functions provided by the web browsers in your web applications.

Section 1. Client Storage

• Cookies – learn about HTTP cookies and how to use JavaScript to manage cookies more effectively.
• localStorage – introduce you to the Storage type and show you how to use localStorage to store the client-side data.
• sessionStorage – show how to use the sessionStorage to store data for a session.
• IndexedDB – learn about IndexedDB and how to use it to create web applications that work online and offline.

Section 2. Drag-and-Drop API

• Drag and Drop API – enable web applications to use the drag-and-drop feature in the web browsers.
• FileReader API – introduce the FileReader API and show you how to combine it with the Drag&Drop API to build an image upload application.

Section 3. Geolocation API

• Geolocation API – Learn how to retrieve the users’ current locations.

Section 4. Notification API

• Notification API – Learn how to display desktop notifications to users.

Section 5. History API

• pushState – Learn how to use the history.pushState() method.

Section 6. Network Requests

• Fetch API – Learn how to make asynchronous requests to a remote resource from the web browsers.
• Fetch & CORS – Understand CORS (Cross-Origin Resource Sharing), a security measure that prevents an origin from making HTTP requests to a different origin.
• Fetch & Tracking Download Progress – Learn how to download a file using the Fetch API and track the download progress using the ReadableStream object.
• AbortController – Explore how to cancel a web request using AbortController API.

Section 7. Dialog & Popover API

• Dialog API – Show you how to use the HTML native element to create a dialog and use the Dialog API to control the dialog visibility.
• Popover API – Learn how to create popovers using Popover API.

Section 8. Canvas API

• Basic Canvas – Learn about the HTML5 element and how to use the Canvas API to draw shapes.
• Draw a filled rectangle – Show you how to draw a filled rectangle using the fillRect() method.
• Draw an outlined rectangle – Learn how to draw an outlined rectangle by using the strokeRect() method.
• Erase a rectangular area on a canvas – Show you how to use the clearRect() method to set pixels in a rectangular area to transparent black.
• Draw lines – Draw a line from one point to another.
• Draw text – Show how to draw a text string onto a canvas.
• Translate – Learn how to move the origin of the canvas to the new position.
• Rotate – Add a rotation transformation to rotate a drawing object.
• Scale – Add a scaling transformation to the canvas units horizontally and/or vertically.

Was this tutorial helpful ?