Weekly Digest 25/2022
Tags: webdev, javascript, react, css
Published: 2022-06-26 16:57:27

Welcome to my Weekly Digest #25.

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

### Different Ways to Write CSS in React

We’re all familiar with the standard way of linking up a stylesheet to the head of an HTML doc, right? That’s just one of several ways we’re able to write CSS. But what does it look like to style things in a single-page application?

[Different Ways to Write CSS in React | CSS-Tricks](https://css-tricks.com/different-ways-to-write-css-in-react/)

### How to add a theme switcher to Storybook

Learn to control how a story renders by wiring it to a decorator and toolbar items

[How to add a theme switcher to Storybook](https://storybook.js.org/blog/how-to-add-a-theme-switcher-to-storybook/)

---

## Some great videos I watched this week

### ReactJS `useId` Hook

React 18 brings a lot of exciting features but one of the less celebrated but still extremely useful addition is the new `useId` hook and that’s exactly what we will cover in this complete tutorial

{% youtube pPYwPJNonMc %}

by [Basarat](https://twitter.com/basarat)

### New in Chrome 103: HTTP 103 early hints, Local Font Access, AbortSignal.timeout, and more!

Chrome 103 is rolling out now! There’s a new HTTP status code that helps the browser decide what content to preload before the page has even started to arrive. The Local Font Access API gives web applications the ability to enumerate and use fonts installed on the user’s computer. There’s an easier way to implement timeouts on asynchronous APIs.

{% youtube e8LUoJClVo4 %}

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

### The Power of JS Generators

Generators have been around in JavaScript since ES2015, yet remain largely ignored by many JS devs, who don’t see why or how they’d use them in their day-to-day work.

{% youtube gu3FfmgkwUc %}

by [Anjana Vakil](https://twitter.com/AnjanaVakil)

### Every Beginner React Developer Makes This Mistake With State

By far one of the biggest beginner React mistakes I see is developers storing derived state. This is a huge problem that is incredibly hard to detect unless you know what you are looking for.

{% youtube tz0fDABt67g %}

by [Web Dev Simplified](https://twitter.com/DevSimplified)

---

## Useful GitHub repositories

### Data Structure & Algorithms 101 with doodles

I am trying to describe complex matters in simple doodles!

{% github girliemac/a-picture-is-worth-a-1000-words%}

### Dolt

Dolt – It's Git for Data

{% github dolthub/dolt %}

### React Native Elements

Cross-Platform React Native UI Toolkit

{% github react-native-elements/react-native-elements %}

---

## dribbble shots

### Finance Dashboard

![by [Rakib Kowshar](https://dribbble.com/shots/18581445-Finance-Dashboard)](https://cdn.dribbble.com/userupload/2991783/file/original-7eeb5091765486f44a8468c8387ba9a0.jpg)

by [Rakib Kowshar](https://dribbble.com/shots/18581445-Finance-Dashboard)

### Improving health app

![by [Taras Migulko](https://dribbble.com/shots/18578096-Improving-health-app)](https://cdn.dribbble.com/userupload/2986943/file/original-4e90179aa6faf76bd679cf5151c21f9a.jpg)

by [Taras Migulko](https://dribbble.com/shots/18578096-Improving-health-app)

### Fusen-System

![by [Jabel Ahmed](https://dribbble.com/shots/18582097-Fusen-System)](https://cdn.dribbble.com/userupload/2991974/file/original-58df72da830e2dd020347161f30ef82d.jpg)

by [Jabel Ahmed](https://dribbble.com/shots/18582097-Fusen-System)

---

## Tweets

{% twitter 1539308791153405956 %}

{% twitter 1539679606596321281 %}

{% twitter 1539966946384429056 %}

{% twitter 1540794599630700545 %}

---

## Picked Pens

### Generative Kong Summit Patterns

{% codepen https://codepen.io/cobra_winfrey/pen/poaYpGV %}

by [Adam Kuhn](https://twitter.com/cobra_winfrey)

### Squiggly Pencils

{% codepen https://codepen.io/jh3y/pen/NWymKYz %}

by [Jhey](https://twitter.com/jh3yy)

### CSS House from "Up"

{% codepen https://codepen.io/jh3y/pen/OJNeGoO %}

by [Jhey](https://twitter.com/jh3yy)

---

## Podcasts worth listening

### Syntax – **New Viewport Units**

In this episode of Syntax, Wes and Scott talk about the new viewport units coming to the web - what are they and when can we use them?

{% spotify spotify:episode:7JRLnrxCA92COXHs4dXZAY %}

---

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