Daily Shaarli

All links of one day in a single page.
Managing Product Design Teams / Design Systems International
thumbnail

In many product design teams today, work is divided neatly into fields. The result is a familiar waterfall process, where strategy leads to UX, UX leads to UI, UI leads to “finished” designs, and only then does engineering begin.

One cost is that the work is slow. Product teams struggle under the weight of these processes and, at worst, end up filling their time completing checklists instead of doing impactful work.

Plan like a farmer by being deliberate about planning. A farmer has a clear goal (grow the best apple), but knows it is impossible to predict the weather. Instead of laying out a rigid plan ahead of time, they stay agile and respond as things happen.

Data::Random::Contact - Generate random contact data
use Data::Random::Contact;
my $randomizer = Data::Random::Contact->new();
my $person       = $rand->person();
my $household    = $rand->household();
my $organization = $rand->organization();

DESCRIPTION

This module generates random data for contacts. This is useful if you're working an application that manages this sort of data.

It generates three types of contacts, people, households, and organizations.

Use v5.20 subroutine signatures – The Effective Perler

If you declare use v5.36; (or a later version, like v5.38 or v5.40) at the top of your script, subroutine signatures are enabled automatically, and you no longer need to suppress any warnings.

The magic of auto-fit and auto-fill (and the difference between them)
thumbnail

Grid's auto-fit and auto-fill are super useful, and while the declaration is pretty long, and can seem complicated, it's not so bad once you break it down.

✅ Auto-fill vs. auto-fit demo: https://codepen.io/kevinpowell/pen/yyLYoZO
✅ More on getting started with Grid: https://youtu.be/rg7Fvvl3taU

.grid {
display: grid;
gap: var(--gap, 1rem);
grid-template-columns: repeat(
var(--grid-type, auto-fit),
minmax(min(180px, 100%), 1fr)
);
grid-auto-rows: 120px auto auto;
container-type: inline-size;
}

⌚ Timestamps
00:00 - Introduction
00:25 - The basics of grid columns
02:30 - Using the repeat syntax
03:15 - Breaking down repeat auto-fit
05:45 - Preventing overflow
08:00 - Use a variable for the minimum value
08:45 - How to remember this declaration
11:25 - The difference between auto-fit and auto-fill