Frontend Rewind 2023 – Day 20

Discover additional frontend links from 2023 as we swing open the door to Day 20 of our Advent calendar!

Welcome to Day 20 of “Frontend Rewind 2023”!

Join us for another day in our special calendar filled with frontend delights! Today brings a special treat—a discount for Daniel’s Three.js course!


Fun fact: In Sweden, the tradition of “Fika” warms up the winter months. Fika is more than just a coffee break; it’s a social institution. Swedes take time to enjoy coffee and pastries with friends or colleagues, creating a cozy atmosphere amid the winter chill. The simplicity of sharing a warm cup and conversation fosters connections and provides a delightful respite during the darker days of winter in Sweden.

Community Discount: Mastering ThreeJS Instancing

Explore amazing Three.js projects with Daniel Velasquez‘s easy-to-follow course. Learn at your own pace as Daniel guides you through hands-on projects, revealing the secrets to creating stunning effects using millions of particles. Whether it’s flocks of birds or intricate simulations, this course covers everything in a practical and stress-free way.

What makes this course special is its focus on practical advice and real examples, perfect for those who learn visually. Daniel, an award-winning expert in ThreeJS/WebGL, shares his knowledge, teaching you how to effortlessly master ThreeJS instancing and animate millions of objects.

Daniel has written great tutorials here at Codrops and we’re super stoked to highlight his course and offer you an exclusive discount using adventofcodrops for 20% off!

Article

Astro View Transitions

In this Chrome team article, they discuss Astro’s journey and the View Transitions API. They talk about the challenges of achieving smooth page transitions, how the API helps, and how Astro 3.0 uses it for improved user experiences and web animations. Amazing that recently version 4 was released!

Tutorial

Style your RSS feed

Learn how to make your RSS feed look nice using XSL and provide useful information at the same time in this article by Darek Kay.

Website Design: Quai Network

UI Interaction & Animation: Swif

Tool

Linkwarden

Linkwarden is a fully self-hostable, open-source collaborative bookmark manager to collect, organize and archive webpages.

Freebie

Next.js Commerce

Next.js Commerce is an ecommerce template built with Next.js 13 and App Router, featuring optimized SEO, React Server Components, server actions, styling with Tailwind CSS, Shopify integration, dynamic themes, and other features, along with guidance on setup, customization, and usage using Shopify as a CMS.

Web Experiment

L.K. Effect

Nemutas is using Astro, Three.js and GSAP for this demo and got inspired by an effect from Lenoid Kostetskyi’s website for the hover interaction.

Video: Baking Tutorial for Three.js, R3F or Babylon.js – Optimize Loading Times and Performance

Thanks for joining us today—hope to see you again tomorrow! 👋🎄

Manoela Ilic

Manoela is the main tinkerer at Codrops. With a background in coding and passion for all things design, she creates web experiments and keeps frontend professionals informed about the latest trends.

Stay in the loop: Get your dose of frontend twice a week

Fresh news, inspo, code demos, and UI animations—zero fluff, all quality. Make your Mondays and Thursdays creative!