DEV Community

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

Posted on

Weekly Digest 04/2022

Welcome to my Weekly Digest #4 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

Fancy CSS Borders Using Masks

In this article, we look at modern CSS mask techniques to create three fancy CSS borders without having to use a background image.

Fancy CSS Borders Using Masks | CSS-Tricks

Make Free Stuff

On web3, Wordle and the radical concept of building things for free.

Make Free Stuff

Frontend Predictions for 2022

Thoughts on what we might see in the coming year, including the return of micro-frontends, functional JavaScript & the demise of the Jamstack as we know it.

Frontend Predictions for 2022 | Jay Freestone


Some great videos I watched this week

Prisma in 100 Seconds

Prisma is an open-source ORM that makes it fun and safe to work with a database like MySQL, Postgres, SQL Server, or MongoDB. It generates a type-safe client library to provide an awesome DX in any Node.js or JavaScript project.

by Fireship

Remix Single: Optimistic UI

Instead of adding pending states and busy indicators while we wait for the server to process a mutation, we already know what the UI will look like when it's done. Skip the spinners with Optimistic UI!

by Remix

VSCode Log Points

A great feature of VScode is its log points. You can use these to essentially stop polluting your code with console.log statement.

by Basarat

Chrome 98 - What’s New in DevTools

Full-page Accessibility tree, more precise changes in the Changes tab, and more.

by Google Chrome Developers

An HTML Select element that is... actually styleable.

Select menus, like literally the select native HTML elements, are notoriously unstyleable. In the last few years, it's become tenable to style the outside of the menus, even with just CSS alone, making them sit nicely in design systems without too much trouble.

by Chris Coyier


Useful GitHub repositories

docs.page

Instant Open Source docs with zero configuration.

GitHub logo invertase / docs.page

Instant Open Source docs with zero configuration.

docs.page

Instant Open Source docs with zero configuration.

docs.page

HomepageDocumentation

About

docs.page is a free Open Source project, allowing you to create instant, fast, beautiful documentation with zero configuration.

Documentation is an important aspect for many projects, however creating a custom documentation website for each project is time consuming. Many common solutions to problems have to be duplicated, along with dealing with overheads such as website maintenance & hosting.

Solutions such as Jekyll, Docusaurus docsify and many others are great projects, however still require custom setup for each project.

docs.page is designed to deliver instant documentation websites, with the content sourced directly from any public GitHub repository. Features include:

  • Configurable: Add your own logo, theme, analytics, navigation and more with a simple config file.
  • Previewing: View the documentation of any branch, pull request or specific commit,.
  • GitHub Bot: Install our GitHub bot to automatically get…

tldraw

A tiny little drawing app.

GitHub logo tldraw / tldraw

A tiny little drawing app.

A screenshot of the tldraw web app

Welcome to the tldraw monorepo.

🙌 Questions? Join the Discord channel or start a discussion.

💕 Love this project? Consider becoming a sponsor.

Thanks to our corporate sponsors:

...and to our individual sponsors!

Contents

This repository is a monorepo containing two packages:

  • packages/tldraw contains the source for the @tldraw/tldraw package. This is an editor as a React component named <Tldraw>. You can use this package to embed the tldraw editor in any React application.
  • packages/core contains the source for the @tldraw/core package. This is a renderer for React components in a canvas-style UI. It is used by @tldraw/tldraw as well as several other projects.

...and three apps:

...and three examples:


dribbble shots

Vimon application

by [Abo](https://dribbble.com/shots/17387848-Vimon-application)

by Abo

Rideshare Mobile App

by [Samon Ahmed](https://dribbble.com/shots/17388305-Rideshare-Mobile-App)

by Samon Ahmed

E-commerce mobile app onboarding

by [ashiouzzaman.ux](https://dribbble.com/shots/17383897-E-commerce-mobile-app-onboarding)

by ashiouzzaman.ux

Music Player App

by [Achmad Qomarudin](https://dribbble.com/shots/17387992-Music-Player-App)

by Achmad Qomarudin


Tweets

Picked Pens

3D Futuristic Room

by Ricardo Oliva Alonso

Generative growing plants

by Louis Hoebregts

Hawaii Mountains

by Amit Sheen


Podcasts worth listening

CodePen Radio – With Aysenur Turk

Aysenur Turk had a number of appearances on this year’s Top Hearted of 2021, including #1! In this podcast, I get to catch up with her, find out where she gets ideas and inspiration, how much time it takes to build something like her amazing layouts, and what her favorites are.

Syntax – Monorepos! Workspaces, pnpm, turborepo + more!

In this episode of Syntax, Scott and Wes talk all about monorepos - the why's and the how's of using them on your projects.


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

Discussion (0)