Recreating the Stripe menu with React, Tailwind, and AI, Choosing the best Jamstack CMS, and Next.js conf highlights.
Hey devs,
How are things?
Once again, we have had somewhat of an eventful two weeks, and we have a lot to get through. I’ve also made this one a bit longer, as there were some links from the past issue that I’ve felt are worth sharing as well.
One thing that made my week was when the Node.js team thought it was a good idea to ask the internet for a new mascot. The comments are priceless 😂:
BTW, do you have a preferred newsletter length in terms of the number of links? Let us know!
And now, for the dad joke of the day…
Why couldn't the bicycle stand up by itself?
.
.
Because it was two-tired!
We’ve added another knowledge page to our resources. This time we made a complete guide to choosing the best Jamstack CMS.
Steve made a tutorial on making an animated menu like Stripe with React, Tailwind, and AI.
Post (and pre) NextConf content is abundant, here are some of the highlights:
- Sebastian Markbåge wrote about how to think about security considerations in Next.js.
- Next 14 release blog post.
- Here’s a playlist with all the sessions of Next.js Conf ▶️. I really enjoyed Sam Seilkoff’s session. Maybe it's just because Guillermo Rauch released a meme generator from that talk 😆.
- Kent C. Dodds wrote why he won’t be using Next.js.
- As a rebuttal, Lee Robinson, VP of Developer Experience at Vercel, wrote “Why I'm Using Next.js”.
- Adam Wathan, Tailwind CSS creator, gave a talk at Rails World 2023 titled: “Tailwind CSS: It looks awful, and it works” ▶️.
- Here are the results of the state of WebAssembly 2023.
- Many in the industry take a mobile-first approach when developing for the web. The folks at Neilsen have a counterargument and discuss the negative impact of mobile-first on desktop.
- Roman Komarov wrote a very detailed article on scroll-driven state transfers, which are part of scroll-driven animations in CSS. They are still not widely supported on all browsers, but this is another game changer in CSS, IMO.
- TS wizard, Matt Pocock, is back again with some more TypeScript clarifications. This time: the difference between React.ReactNode / JSX.Element / React.ReactElement.
- Another post from Matt was about TypeScript event types for React.
- Jake Lazaroff wrote a post about how web components will outlive your JavaScript framework. I don’t know if I agree with him, as we’ve been waiting for WC to be our web savior for years, but it’s an interesting take nonetheless.
- The team at StackBlitz put out a post about 5 lessons design systems teams can learn from open-source maintainers. After all, inner source is not that different than Open source 🤷🏽.
- Here’s an article that compares Framer Motion and GSAP for animating your React apps.
- TanStack Query V5 is out. Along with it, some very cool new features for its devtools.
- Astro 3.3 is out. In this release, a new <Picture/> component, syntax highlights improvements, package provenance, and some more quality-of-life improvements.
- React announced that Server Actions are now available in Canary release. It would be great if you could use them without a framework (cough cough — Next.js).
- Docusaurus 3.0 is out.
- Yarn 4.0 is out as well.
- Netlify announced their new Cache Key Variations, which is part of more planned features for handling your cache like a boss.
- Nx 17.0 Has Landed. In it: Vue support, enhancements to Module Federation support, Nx AI chatbot, and more.
- Apparently, you need to say goodbye to Node.js Buffer, and hello to Unit8Array.
- Speaking of Node.js, here are the top 6 ORMs for modern Node.js app development.
- VOV.css is a collection of small and useful CSS animations.
- ApexCharts is a library for creating interactive SVG-based charts with Vanilla JavaScript (there are also, Vue, React, Angular, and Stencil implementations, as well as more unofficial wrappers for Svelte, Ruby, Laravel, and more!).
- react-magic-motion stays true to its name, and magically animates your React components.
- wireit is a relatively new project by Google that upgrades your npm/pnpm/yarn scripts to make them smarter and more efficient.
- WinterJS is a Rust/SpiderMonkey based Service Worker, it is WinterCG compliant, which means it’ll run on multiple JS environments such as Cloudflare workers, Deno Deploy, and Vercel.
- Aircode allows you to build serverless functions straight in your browser.
There you have it!
Another round-up of two very eventful weeks in the dev world (regular world news was much more eventful, but we’ll stick to the subject matter).
Hope you found this useful, and once again, if you have any feedback, or just want to say you like the newsletter, we’d love to hear from you!
Praying for more peaceful times,
Yoav.
