The CSS border-radius property defines the radius of an element's corners. We can use this property to add rounded corners to our elements! It’s often used for buttons, images, and more advanced CSS shapes. Let’s dive a little further into this useful property… 🤓 Want to stay up to date…

Whenever you load JavaScript from an HTML page, it’s important to be mindful of the loading performance of the page. The page-load time largely depends on where and how you add scripts to your HTML page. In this article, we’re going to look at how we can use async and…

Promises are used in JavaScript to handle asynchronous operations. They essentially represent an operation that hasn’t completed yet — hence the name of ‘promise’. They simplify the process of dealing with multiple asynchronous operations, and reduce the likelihood of “callback hell” which often leads to messy and unmanageable code. Why…

JavaScript is the most popular programming language in the world, so it’s no wonder that it’s one of the most sought-after skills in the web development industry. In fact, the Devskiller IT Skills and Hiring Report (2020) reports that 72% of companies are looking to hire JavaScript experts. Additionally, of…

CSS Vendor prefixes (or browser prefixes) are a way for browsers to give access to new CSS features not yet considered stable. By using prefixes, we can use these newer CSS features with the browsers that support them — instead of waiting for all browsers to catch up. 🤓 Want…

CSS Animations are a great way to animate CSS properties from one to another. While we can use transitions to perform single movements, animations give us much finer control. Some common properties we might animate include colors (color& background-color), and numbers such as height & width. Check out the full…

In this tutorial, we’re taking a look at how to animate components using CSS transitions! A transition occurs when we tell a CSS property value to change, over a specified period of time. We do this with the transition property, which is a shorthand of the following properties: transition-property transition-duration …

As developers, we want our HTML elements to look the same way regardless of which browser is being used to view our pages. Unfortunately, this isn’t the case due to the way browsers run. Each browser has its own default stylesheet, which specifies some minimal rules that apply to elements. …

The transform property allows us to visually manipulate elements by scaling, skewing, rotating, or translating them. For example: .element { width: 30px; height: 30px; transform: scale(10); } Despite our height and width declarations, the transform scales our element to ten times its original size! Transforms are especially fun when combined…