Ever wonder how to generate browser notifications that appear in the top-right of the browser, like this one?
You can accomplish this using the Javascript Notification API, a few simple methods that together allow you to control permissions and other options for your notification. The browser transfers your notification to…
One of the most integral APIs provided by browsers is the Event API. This API defines how events are created and consumed in programs run in the browser. …
The HTML Canvas element creates an area in which you can draw and manipulate pixels individually to create custom shapes and complex animations. You interact with the canvas using a number of JavaScript methods. Source.
Creating a canvas-based drawing is really quite simple, you create the canvas element in an…
The header with an overlay. This element has been a staple of websites going back to the early 2000s. It’s a header image, with or without header text, with some sort of colored overlay that matches the sites branding. See the above image for an example.
Most sites that I’ve…
The latest specification for CSS introduced a number of new features that are starting to allow us to ditch preprocessors like SASS and others, and go back to pure CSS.
Variables are one such feature. allowing you to create variables just like you would in SASS.
Lazy loading images is the practice of deferring their loading until the user actually needs them, generally when the user scrolls towards them in the viewport. …
Markdown is a ubiquitous and incredibly useful tool. If it was to be considered a programming language it would be among the worlds most popular, but it is beneficial to developers and business folks alike. So, what is it really, and what can you use it for?
I recently wrote a script that generates a text-based ASCII folder structure based on a bullet list. This was something that I had looked for before while I was writing documentation, but I couldn’t find it so I thought that I’d write it myself. …
Have you written this line of code recently?
const url = 'http://example.com/movies';
fetch(url)
.then(response => response.json())
.then(data => console.log(data));Chances are if you are a professional web developer at any stage of your career then yes, you write API calls like this all the time. For a simple example like…
The datalist element allows you to provide simple autocomplete functionality to your text inputs for a form. The element can also be used with Javascript to dynamically load content for the dropdown from a remote API endpoint. …
