Weekly Digest 23/2021

Marco Biedermann
4 min readJun 13, 2021

Welcome to my Weekly Digest #23.

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

How to create NFTs with JavaScript

Learn to code an NFT (non-fungible token) using the Ethereum blockchain, the Ropsten Testnet, and a series of JavaScript libraries.

Serving sharp images to high density screens

Why compressing images for dense screens is different, and how to serve them.

How to update nested state in React

State is a cornerstone of React components. In this post, we learn how to update nested state properties.

Media Queries in Times of @container

With container queries now on the horizon — will we need media queries at all?

Some great videos I watched this week

Automating Tests with Jest

When I think about Continuous Integration, one of the first things that comes to my mind is testing. It’s amazing how much more confident you can be about changes to your codebase when you have a good suite of tests, and you know they run before every merge.

How to use TypeScript on big projects

We met with Nikita Kabardin, who works as a front-end developer at Spotify. He also worked on several Battlefield projects.

Thinking on ways to solve color schemes

In today’s GUI challenge, we’re building dark, light and dim color schemes with HSL. The CSS works across modern browsers, establishes foundational architecture for more themes, and is accessible.

Hasura in 100 Seconds

Learn how Hasura can instantly turn your SQL database into a GraphQL API.

Self-Avoiding Walk

It’s finally time to attempt a Self-Avoiding Walk! In this video, I quickly visualize a simple JavaScript p5.js implementation of a self-avoiding walk. I then tackle the more complex problem of backtracking to find a solution to a space-filling self-avoiding walk.

Useful GitHub repositories

React 18 Working Group

This is the working group for React 18 release. It was formed to provide support to the community through the release.

React Hook Form

Performant, flexible and extensible forms with easy-to-use validation.

Prisma

Next-generation ORM for Node.js & TypeScript | PostgreSQL, MySQL, MariaDB, SQL Server & SQLite

cuid

Collision-resistant ids optimized for horizontal scaling and binary search lookup performance.

dribbble shots

Fleet — Travel Shopping UI Kit

Podcast Dashboard

Fashion Store Mobile App

Music Mobile App

Instax — Mobile App Design

Cargo Transportation Application Design

Tweets

Picked Pens

Bringing text to life

Podcasts worth listening

The CSS Podcast — Scroll timelin

In this episode we deep dive the experimental Scroll Animations spec to bring you the breakdown on @scroll-timeline powered CSS animation. Learn about scroll-linked animations vs scroll-triggered animations and how to orchestrate scroll interactions with elements of the page.

3 Minutes with Kent — Prisma is amazing

The Changelog — Exploring Deno Land

Syntax — Making a Vaccine Bot with JavaScript

In this Hasty Treat, Scott and Wes talk about Wes’ experiment building a vaccine bot!

CodePen Radio — Pattern Library

Stephen and Chris talk about cplibrary the Pattern Library that the CodePen Monorepo can use to share components. What goes in there and what doesn't? What are common and not-so-common components? Can components be combinations of other components?

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

--

--

Marco Biedermann

Full-Stack JavaScript Engineer with focus on React, Redux & Node.js and passioned about Open Source working @Mobime based in Berlin, Germany marcobiedermann.com