Collective #485
Publikováno: 21.1.2019
Lucid * Web Performance Mini Series * TypeScript ESLint * Beyond the interface * Animating URLs * Animating CSS Grid
Collective #485 was written by Pedro Botelho and published on Codrops.

UX in the Age of Personalization
Colin Eagan’s article on personalization strategies that can be employed for creating better user experiences.

Swift and straightforward bug fixes for your JavaScript apps
Automatically detect JS errors impacting your users. Get comprehensive diagnostic reports, know instantly which errors are worth fixing, & debug in minutes.

Animating CSS Grid
Michelle Barker shares her CSS Grid animation experiment (Firefox Nightly only).

Building a Progressively-Enhanced Site
Jim Nielsen shares how he implemented an accessible search.

Lucid
A Chrome Developer Tool designed to help engineers debug React-GraphQL applications.

Web Performance Mini Series: Responses
The first video in a mini series on web performance by Paul Lewis.

How to Stop Using Browser Dev Tools and Start Using Your Editor’s Debugger
A great article on utilizing the debugger of your code editor.

Animating URLs with Javascript and Emojis
Matthew Rayfield explores the fun possibilities of animating Emojis in an URL.

How Improving Website Performance Can Help Save The Planet
Jack Lenox writes about how our work as web developers has an impact on our carbon footprint.

Microsoft by the Numbers
An interactive infographic-like site by Microsoft with nice animations.

Beyond the interface
Thomas Byttebier shares his thoughts on the intriguing question of why all apps and websites look the same nowadays.

TypeScript ESLint
Monorepo for all the tooling which enables ESLint to support TypeScript.

Double exposure depth experiment
A web experiment combining modern CSS properties and JavaScript with photography. By Cody Lindsay Gordon.

font-variant-numeric: tabular-nums
A super-useful discovery by Tyler van der Hoeven.

Handling Time Zone in JavaScript
An article that discusses the JavaScript time zone APIs and their issues.

Typewrite Something
An interesting minimalistic typewriter simulator.

Browser Rendering Optimizations for Frontend Development
Some useful tips for enhancing performance by Jordan Irabor.

2019 Slack logo with 2019 code
Ana Tudor’s take on the new Slack logo. With magical CSS.

Free Font: Chappa
A unique looking display font designed by Lucas Mercado. Licensed under a Creative Commons license.

The YouTube Redesign That Got Me Hired
Pramiti R Khan shares an interesting case study on a YouTube redesign that landed him a job.

Snippet generator
In case you didn’t stumble upon it yet: Snippet generator is a tiny React app to help you create Visual Studio Code, Sublime Text and Atom snippets.

Interactive Particles with Three.js
A tutorial on how to draw a large number of particles with Three.js and make them interactive.
Collective #485 was written by Pedro Botelho and published on Codrops.