In this guide, my goal is to help you showcase the popularity of blog posts by adding real-time likes as a polymorphic feature to your Rails app using [hotwired.dev](htt...
•
337 reads
Category
Web Design
Web design is about solving problems for users in mind inside the ecosystem known famously as the world wide web. Today designs can no longer static but scaleable. More attention is paid to function over form though when successfully combined many designs stand apart from the rest as well-executed pieces of art. Tools, trends, techniques and more are all part of the discussion.
If you are an avid Tailwind CSS user like myself, you probably landed here to learn how to make better use of Tailwind CSS for a more complex ...
•
6417 reads
It's that time again. My annual coding setup for 2022 is here. In previous years I've outlined a similar set of tools, software, and extensions since I get asked about t...
•
1364 reads
If you have followed me for some time you might remember a series I did on Ruby on Rails titled “Let’s Build”. These guides were a “learn in public” exercise I tasked ...
•
5872 reads
In this guide, we take a look at creating button components using Tailwind CSS. Combined with PostCSS we can craft custom component-based classes that group Tailwind CSS...
•
8778 reads
In this guide, I create a series of Tailwind CSS card components inspired by the Bootstrap framework. The amount of variants you can create f...
•
3281 reads
In part 16 I continue integrating Stripe by tackling the backend side of the equation.
This part covers adding Stripe's new [Payment Intent API...
•
692 reads
Order is a neat way to define more exact ordering of how child elements of a flex container display.
To assign order you use the order: CSS property on a given fle...
•
1058 reads
CSS align-items sets the default behavior for how flex items are positioned along the cross axis on the current line. Think of this as the justify-content equivalent of ...
•
704 reads
A flex container flexes its items with no overflow effects. The flex items within the parent flex container will always try to fit all items on one line by default.
...
•
1200 reads
The justify-content property automatically assigns space between and around flex items along the main...
•
3033 reads
Flex direction establishes the axis all content within the parent flex container displays itself on.
...
•
1388 reads