This tutorial will cover how to build a minimalistic homepage Chrome extension, with JavaScript, designed to help users stay productive. A Chrome extension is a program that enhances and customizes the browsing experience for Chrome users. Among the various types of extensions available, homepage extensions are the most popular. These extensions allow...

How many words per minute can you type? In this tutorial you’ll learn how to create a typing test game with JavaScript. The app will feature a timer that runs for 1 minute, then displays the result. What We’re Building Take a look at the demo, feel free to fork it on CodePen, and (of course) see how many words you can type in a minute! HTML...

As WordPress developers, many times we want to grab different info (ID, title, URL) for standard WordPress/WooCommerce pages like the Blog and My Account pages. Surprisingly, all this useful stuff is stored in the *_options table, and we can access it using the get_option() function. There’s also the wp_load_alloptions() that we can use to print...

In this tutorial, we’ll cover the challenges when working with the classic 100vh unit for making full-screen sections and discuss some great alternative CSS units.Hero or full-screen sections are an integral part of UI design. They exist in different kinds of websites, from landing pages to portfolio websites, and aim to grab visitors’ attention in...

Today, I’ll cover Chart.js, a very popular JavaScript library, and teach you how to incorporate charts of this library into Bootstrap 5 tabs/pills. The idea is that each time we click on a Bootstrap tab, the target chart will be reconstructed and hence reanimated. Bear in mind that this technique can work for embedding such a chart into a tab component...

Let’s create a fully functional currency converter application using HTML, CSS, and vanilla JavaScript. By the end of this tutorial, we will have a responsive currency app that fetches real-time data with the Exchange Rate API and presents it in a user-friendly interface. Our Currency Converter Demo To create your own currency converter, you’ll need...