css

3 Ways to Center in CSS

Centering HTML elements using CSS can be a surprisingly difficult task. Getting the horizontal alignment right is relatively straightforward, but getting the vertical alignment down can prove to be challenging. And getting an element to sit smack dab in the middle of its container? Forget about it! 🙂 I’m kidding, but how to center elements using […]

javascript-300x120

Functions as First-Class Objects in JavaScript: Why Does This Matter?

Functions in JavaScript are first-class objects (or “first-class citizens”). Fascinating, but… what does that mean? Why does it matter? Read on and we’ll have a look! We’ll start with the basics: What does first-class citizenship mean in general? First-class citizenship, within the world of programming, means that a given entity (such as a function) supports […]

javascript-300x120

Finding the Most Frequent String in a JavaScript Array

In the following tutorial, I’ll show you how to write a function that takes an array of strings and returns the most frequent string(s) in that array. First I’ll go through the basic concepts and setup, we’ll test it to make sure it works, then I’ll explore a few ways in which you can handle […]

javascript-300x120

How to Make Circular/Curved Text with JavaScript

Creating circular text, or text on an curved path, in webpages may seem like somewhat of a intimidating task. There isn’t really a straightforward way to achieve it with standard HTML and CSS. There is a JavaScript plugin or two out there with some pretty decent results, but using plugins means extra dependency and load time associated tacked on to your project. […]

css

CSS: Making the Switch from Static to Relative Units

CSS gives web developers plenty of options when it comes to defining lengths for HTML elements. In a broad sense, defining lengths in CSS can be broken down in to two categories: using absolute versus relative units. Absolute units are probably most commonly done with pixel lengths with the familiar px unit. Other absolute length units exist (e.g., mm, […]

css

CSS: Simple Sticky Footer

The sticky footer… The oh-so-sought-after expanse at the bottom of the page that contains contact information, site navigation, a call to action, or whatever else you might want to chuck in there. It’s the element that knows its place in the world (wide web) and embraces it by staying in it’s place. A well executed sticky footer encourages your site visitors to further engage; it […]

javascript-300x120

What are ES6 generators useful for?

Easily one of the weirder new constructs within the new ES6 spec, the ES6 generator answers a perplexing question: What would happen if you stopped a loop in the middle of its execution, went off and did something else for a while, then came back? It turns out that you can actually do quite a bit. […]

1024px-Flatirons_Winter_Sunrise_edit_2

Using JavaScript forEach to do Array Looping and Iterations

This tutorial demonstrates using the Array.forEach() method with some examples. forEach() is designed to run a function on each indexed element in an array. Starting at index[0] a function will get called on index[0], index[1], index[2], etc… forEach() will let you loop through an array in much the same way as a for loop. Let’s […]

javascript logo

Using the JavaScript ParseInt Method

JavaScript’s parseInt function is all about converting a string to an integer. The function takes a string value as an argument and converts it to a numerical value with no decimal places, or alternatively the value NaN. ParseInt has a total of two parameters and thus takes two arguments. The second parameter specifies a radix […]

javascript logo

How to Reload a Page in JavaScript?

Refreshing or reloading a web page in JavaScript isn’t all that difficult. There is the straightforward window.location.reload (or just location.reload) method, and then there are a few less intuitive approaches that achieve the same effect. In the this lesson, I’ll show two examples of how to reload a web page using JavaScript. Get ready to get […]