back button Back to blog

Dev Roundup, Feb 2023 Part 1

My collection of new, interesting, useful, and trending content for software developers. The Feb 2023 Part 1 edition includes AI, scrolling animations, Lighthouse updates, Typescript tips, and more!

Noah Matsell โ€ข February 15, 2023
Copy URL

This edition includes AI, scrolling animations, Lighthouse updates, Typescript tips, and more!

Around the Web ๐Ÿ•ท

Building a GPT-3 app with Next.js and Vercel Edge Functions

If you're looking to build your first AI driven app, Next.js/Vercel provides a really quick and straightforward solution.

Simple React Scroll Animations With Zero Dependencies

A guide for building scroll animations with nothing more than React and the Intersection Observer API.

What's new in Lighthouse 10

The latest version of Lighthouse brings scoring changes and new audits (including penalizing paste-preventing inputs!!). Worth a look if you are into page performance.

Scroll driven gallery ๐Ÿ‘€

Some Fave Tweets ๐Ÿฆ

Cron jobs are coming to vercel next week. I'm excited to give them a whirl.

Animate card borders with Wes' cool little CSS border gradient solution.

A tiny little quality of life improvement. Pasting entire .env files was always available for existing projects. Now you can do it at project creation time.

Vercel Changelog avatar
Vercel Changelog @vercel_changes
You can now โŒ˜+V to add Environment Variables when deploying a new project.
Tweet media

Not sure about as const? This thread goes deep.

Matt Pocock avatar
Matt Pocock @mattpocockuk
A brief thread.

'as const' has more uses than you might think.

Tweet media

A nice little TS helper to make your intersection types much more readable.

Matt Pocock avatar
Matt Pocock @mattpocockuk
Here's a quick thread on a super useful type helper you've probably never heard of (nope, not even advanced folks).
Tweet media

I love a good animation tool. Tweak parameters and get visual feedback.

Morse avatar
Morse @__morse
I made a website to visualize @framer motion animations

You can change animation parameters and see how they affect values over time

Tweet media

A beautiful CSS demo that leverages :has() and :hovered.

jhey ๐Ÿ”จ๐Ÿปโœจ avatar
jhey ๐Ÿ”จ๐Ÿปโœจ @jh3yy
Lil CSS Tip for this one ๐Ÿค

You could use :has() to detect when a galaxy is being :hovered and set the custom cursor coordinates ๐Ÿค”

:root:has(.galaxy:hover) .cursor { --x: var(--gravity-x); --y: var(--gravity-y); }

@CodePen link below! ๐Ÿ‘‡

Tweet media

Like this post?

Sign up and get notified when new posts are published!