Articles

Building an Audio Player With React Hooks

Building an Audio Player With React Hooks

Jan 14, 2021

Discover how to build an audio player using React and the HTMLAudioElement interface.

Reducing Motion in Animations

Reducing Motion in Animations

Dec 20, 2020

Learn a few ways to implement alternate animations in CSS and Javascript.

Animated Tabs With Framer Motion

Animated Tabs With Framer Motion

Dec 5, 2020

Get acquainted with Framer Motion by building an animated tab component.

Building a Dark Mode Theme Toggle

Building a Dark Mode Theme Toggle

Nov 15, 2020

Learn how to build an interesting dark mode animation.

How to Build an Expandable Comment Box

How to Build an Expandable Comment Box

Nov 1, 2020

Recreating the Medium comment box from scratch using React Hooks.

CSS Text Effects - Five Minimal Examples

CSS Text Effects - Five Minimal Examples

Oct 4, 2020

Exploring lightweight CSS text clipping and masking effects.

Getting Started With Framer Motion

Getting Started With Framer Motion

Sep 21, 2020

An intro to the animation library from Framer.

Building a Vertical Carousel Component in React

Building a Vertical Carousel Component in React

Sep 2, 2020

We'll learn how to build an infinite carousel using sentences as slides.

The Importance of Having a Side Project

The Importance of Having a Side Project

Aug 16, 2020

And the benefits of learning by building things.

Recreating the Medium Applause Button

Recreating the Medium Applause Button

Aug 3, 2020

Learn how to create the Medium applause button in React.

Automating Your Workflow With Code Snippets

Automating Your Workflow With Code Snippets

Jul 18, 2020

Find out how using code snippets can help you speed up common tasks.

Flexbox Bottom Aligned Elements

Flexbox Bottom Aligned Elements

Jul 5, 2020

We'll cover two ways of bottom aligning an anchor within a flexbox item.

How to Lazy Load React Components

How to Lazy Load React Components

Jun 25, 2020

We'll discover how to use React Lazy, React Suspense, and the Intersection Observer API to load content only when needed.

Building a React Card Carousel Component

Building a React Card Carousel Component

Jun 10, 2020

In this post we will explore creating a card carousel like the one seen on Stripe.com.

Making Progress With Progress Indicators: Part 2

Making Progress With Progress Indicators: Part 2

May 20, 2020

Part two on building progress indicators. This time, using SVG animation.

Making Progress With Progress Indicators: Part 1

Making Progress With Progress Indicators: Part 1

May 15, 2020

The first of a two part series exploring stepped progress indicators.

Building a Dropdown Menu Component With React Hooks

Building a Dropdown Menu Component With React Hooks

May 13, 2020

We'll create a dropdown menu using React Hooks.

How to Build a Skeleton Loading Placeholder

How to Build a Skeleton Loading Placeholder

May 12, 2020

Explore some basic strategies for creating skeleton loading placeholders.

Recreating the iOS Control Center With CSS Grid

Recreating the iOS Control Center With CSS Grid

May 9, 2020

We'll create a clone of the iOS 13 control center layout using the power of CSS grid!