Why & How I rebuilt my site

• astro

  213 37,290 9.9 TypeScript

  The web framework that scales with you — Build fast content sites, powerful web applications, dynamic server APIs, and everything in-between ⭐️ Star to support our work!

  

  What really kicked of the new hype-train was my introduction to Astro from Theo. The concept of partial hydration instantly blew my away and its blazingly fast performance left me in awe. tl;dr on Astro: it's component syntax is super intuitive and its rich integration ecosystem makes it super easy to pick up. A more in-depth article on Astro is in the works. There's just so much to unpack here 🤯!

• Tailwind CSS

  286 73,888 9.4 HTML

  A utility-first CSS framework for rapid UI development.

  

  For styling, I went all out with Tailwind CSS. This has been the most convenient experience I've had with styling and it comes built-in with an official Astro plugin. Tailwind also provides an elegantly styled of classes for markdown content, which is why the typography for this article 10x better than the previous iteration.

• Appwrite

  appwrite.io

  sponsored

  Appwrite - The open-source backend cloud platform. Add Auth, Databases, Functions, and Storage to your product and build any application at any scale while using your preferred coding languages and tools.

  

• Svelte

  152 74,014 9.6 JavaScript

  Cybernetically enhanced web apps

  

  What makes this combo truly incredible is the dark mode toggle, powered by Astro and Tailwind. This was where I tried out Astro's stellar feature of partial hydration. The only JS on this site comes from a tiny Svelte component which dynamically appends a 'dark' class to the entire site instantly. From here, tailwind handles the rest and voila we have dark mode!

Suggest a related project