Weekly Digest 02/2021
Welcome to my second weekly digest of this year.
This weekly digest contains a lot of interesting and inspiring articles, videos, tweets, and designs I consumed during this week.
📖 Interesting articles to read
Get Ready For ESM
JavaScript Modules will soon be a reality for Node.js package maintainers.
The New Array Method You’ll Enjoy: array.at(index)
Array.at(index) method in JavaScript accesses array items at positive and (finally!) at negative indexes.
https://dmitripavlutin.com/javascript-array-at/
Front-End Performance Checklist 2021
An annual front-end performance checklist (available as PDF, Apple Pages, MS Word), with everything you need to know to create fast experiences on the web today, from metrics to tooling and front-end techniques.
Front-End Performance Checklist 2021 — Smashing Magazine
CSS Scroll Snap
In this article, Ahmad will walk you through CSS scroll snap basics. What’s make him excited is that he just learned CSS scroll snap, so all the details I will explain will be freshly written. Are you ready? Let’s dive in!
https://ishadeed.com/article/css-scroll-snap/
🎬 Videos
Some great videos and courses I watched this week
Centering List Markers
Like so many things CSS, there is all sorts of little stuff to know, even about something as minuscule as centering a list marker.
by Chris Coyier
Chrome 88 — What’s New in DevTools
New CSS angle visualization tools, emulate unsupported image types and storage quota, new Web Vitals lane and more.
💻 Useful GitHub repositories
passport-magic-login
Passwordless authentication with magic links for Passport.js 🔑
- User signup and login without passwords
- Supports magic links sent via email, SMS or any other method you prefer
- User interface agnostic: all you need is an input and a confirmation screen
- Handles secure token generation, expiration and confirmation
https://github.com/mxstbr/passport-magic-login
Naming cheatsheet
Naming things is hard. This sheet attempts to make it easier.
Although these suggestions can be applied to any programming language, I will use JavaScript to illustrate them in practice.
https://github.com/kettanaito/naming-cheatsheet
🖼️ dribbble shots
The Sweet Sew application interaction
Book Store App
by Sergey Bulanov https://dribbble.com/shots/14930553-Book-Store-App
Mount fire logo concept
by Md Arif Hossain https://dribbble.com/shots/14947718-Mount-fire-logo-concept
Molly + ❤
by Joby https://dribbble.com/shots/14947202-Molly
Newspaper Apps
by Respogrid https://dribbble.com/shots/14948165-Newspaper-Apps
🐦 Tweets
https://twitter.com/addyosmani/status/1348902534363152385
Infinite Scroll
https://twitter.com/metafizzyco/status/1348994763522011137
CSS Scroll-linked Animations
https://twitter.com/argyleink/status/1349051923912036355
Nested elements with rounded edges
https://twitter.com/joshwcomeau/status/1349782080021028865?s=21
Death by Deprecation
🎨 Picked Pens
Tilting Maze Game
https://codepen.io/HunorMarton/pen/VwKwgxX
Background patterns
https://codepen.io/yuanchuan/pen/xxEXwZw
Neumorphism Animation
https://codepen.io/ma_suwa/pen/eYdZVML
Tabbar
https://codepen.io/aaroniker/pen/rNMmZvq
by Aaron Iker
Talk to you next week and stay safe! 👋
