Weekly Digest 26/2022
Tags: webdev, javascript, react, css
Published: 2022-07-03 17:09:24

Welcome to my Weekly Digest #26 which is the first one in July.

This weekly digest contains a lot of interesting and inspiring articles, videos, tweets, podcasts, and designs I consumed during this week.

---

## Interesting articles to read

### Cleaning up deploys you no longer need

Learn how to manually delete old deploys on Netlify to clean up your account history and prevent teammates from rolling back to undesirable states. Netlify automatically deletes errored and failed deploys after 6 months.

[How to delete deploys on Netlify | Netlify Blog](https://www.netlify.com/blog/deploy-deletion/)

### My Wonderful HTML Email Workflow

A potent combination of MDX and MJML

[My Wonderful HTML Email Workflow](https://www.joshwcomeau.com/react/wonderful-emails-with-mjml-and-mdx/)

---

## Some great videos I watched this week

### ****Storybook in 100 Seconds****

Storybook is a tool used for testing UI components in isolation that works with JS frameworks like React, Angular, Vue, and Svelte. It is especially useful for web developers building design systems and shared libraries.

{% youtube gdlTFPebzAU %}

by [Fireship](https://twitter.com/fireship_dev)

### How to inspect CSS container queries

What are CSS container queries and why do we need them? Learn now on today’s episode of DevTools Tips with Jecelyn Yeen and Una Kravets.

{% youtube X4TYXlvbb2E %}

by [Google Chrome Developers](https://twitter.com/ChromiumDev)

### Thinking on ways to solve FABs

In today's GUI Challenge, [@Adam Argyle](https://www.youtube.com/channel/UCBGr3ZMcV5jke40_Wrv3fNA) builds a couple of floating action buttons (FABs) and talks about the UX and CSS considerations for fixed position buttons on the web.

{% youtube RXopH5t2Kww %}

by [Google Chrome Developers](https://twitter.com/ChromiumDev)

---

## Useful GitHub repositories

### m-cli

Swiss Army Knife for macOS

{% github rgcr/m-cli %}

### cheat.sh

the only cheat sheet you need

{% github chubin/cheat.sh %}

---

## dribbble shots

### Health App - Track daily steps

![by [Wahab](https://dribbble.com/shots/18641236-Health-App-Track-daily-steps)](https://cdn.dribbble.com/userupload/3020702/file/original-247a693d53b527db2af25d20de1ca47c.png)

by [Wahab](https://dribbble.com/shots/18641236-Health-App-Track-daily-steps)

### Plant Shop App

![by [Rakib Kowshar](https://dribbble.com/shots/18661272-Plant-Shop-App)](https://cdn.dribbble.com/userupload/3055309/file/original-cf987d505a0d9f25e61d085675ca2cdf.jpg)

by [Rakib Kowshar](https://dribbble.com/shots/18661272-Plant-Shop-App)

### Electricity Bill Pay App

![by [Md. Nazmul Hasan](https://dribbble.com/shots/18660664-Electricity-Bill-Pay-App)](https://cdn.dribbble.com/userupload/3055218/file/original-6001773b1bd92d6eff07b7d6afe0204b.png)

by [Md. Nazmul Hasan](https://dribbble.com/shots/18660664-Electricity-Bill-Pay-App)

---

## Tweets

{% twitter 1540794599630700545 %}

{% twitter 1541349182929248256 %}

{% twitter 1541636296224956416 %}

{% twitter 1542507873711755264 %}

{% twitter 1543148517878808576 %}

---

## Picked Pens

### CSS Rooster Animation

{% codepen https://codepen.io/mdusmanansari/pen/GRxKNKP %}

by [Md Usman Ansari](https://twitter.com/MdUsmanAnsari_)

### SVG play buttons

{% codepen https://codepen.io/Adir-SL/pen/zYRyaaN %}

by [Adir](https://twitter.com/adircode)

---

## Podcasts worth listening

### Syntax – **Browser CSS Page Transitions**

In this Hasty Treat, Scott and Wes talk about the new Browser CSS Page Transitions API proposal and what features it opens up for developers on the web.

{% spotify spotify:episode:69r4qSzqUGJ0j4Gkely2HY %}

---

Thank you for reading, talk to you next week, and stay safe! 👋