DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Cover image for Weekly Digest 31/2022
Marco Biedermann
Marco Biedermann

Posted on

Weekly Digest 31/2022

Welcome to my Weekly Digest #31 of this year.

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

Exploring CSS Grid’s Implicit Grid and Auto-Placement Powers

When working with CSS Grid there is an approach for creating grids without any explicit definition. We call this the implicit grid.

Exploring CSS Grid's Implicit Grid and Auto-Placement Powers | CSS-Tricks

CSS border animations

Looking at several ways to animate a border in CSS

CSS border animations


Some great videos I watched this week

New in Chrome 104: Region Capture, Media Queries, Shared Element Transitions, and more!

Chrome 104 is rolling out now! With region capture, you can now specify a crop area when using getDisplayMedia to capture the current tab. Media query syntax can be written using mathematical comparison operators. Shared Element Transitions start a new origin trial. And there's plenty more.

by Google Chrome Developers

TensorFlow in 100 Seconds

TensorFlow is a tool for machine learning capable of building deep neural networks with high-level Python code. It provides developer-friendly APIs that help software engineers train, analyze, and deploy ML models.

by Fireship

*What are Chrome release channels?*

Chrome has four release channels: Canary, Dev, Beta, and Stable. This video explains why, and shows how you can make the most of each channel.

by Google Chrome Developers

Oh, Snap! | CSS Day 2022

CSS scroll-snap is a classic CSS property; a small, innocent-looking API with huge potential. Learn the basics and value essentials of CSS scroll-snap, the ancillary properties scroll-padding, and scroll-margin, debugging with DevTools, plus a bag of snap tricks and a glimpse into supporting future properties.

by Adam Argyle


Useful GitHub repositories

GitHub City

Create a 3D city from your GitHub contributions

GitHub logo honzaap / GithubCity

Create a 3D city from your GitHub contributions πŸ™

GitHub City

GitHub Repo stars GitHub last commit GitHub

What would Your city look like?

Create a 3D city from your GitHub contributions πŸ™

About

GitHub City uses ThreeJS to generate a 3D city from your GitHub contribution graph.

Using hardware acceleration is highly recommended!

Installation

  1. Clone repository to your local machine
  2. Open terminal and cd into repository folder
  3. run npm install
  4. run npm run dev

dribbble shots

*Finance App*

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

by Rakib Kowshar

Food City Dashboard

by [Ella Moodi](https://dribbble.com/shots/19019037-Food-City-Dashboard)

by Ella Moodi

Joki - Job Finder App

by [Rizal](https://dribbble.com/shots/19016131-Joki-Job-Finder-App)

by Rizal


Tweets


Picked Pens

Glowing Marbles

by KrautGTI

Footer sorrow

by Steve Gardner

Hover Glide Image Gallery

by Hyperplexed


Podcasts worth listening

The Call Kent Podcast – Using userEvent vs fireEvent


Thank you for reading, talk to you next week, and stay safe! πŸ‘‹

Top comments (0)

🌱 DEV runs on 100% open source code known as Forem.

Β 
Contribute to the codebase or learn how to host your own.