How to build a data table with sorting and pagination using Alpine.js
Create a fully functional data table with column sorting, pagination controls, and responsive design using Alpine.js and Tailwind CSS
Create a fully functional data table with column sorting, pagination controls, and responsive design using Alpine.js and Tailwind CSS
Create a fully accessible image gallery with lightbox modal, keyboard navigation, and smooth transitions using Alpine.js and Tailwind CSS.
Create an interactive feature grid with Alpine.js tabs, Tailwind CSS styling, and accessible state management.
Build a three-step automation command bar with Alpine.js, including filtering, keyboard control, and dynamic forms
Learn how to create a notification with Tailwind CSS and Alpinejs, including how to use Alpine.js directives to add and remove notifications dynamically
A practical guide to using the aspect-ratio utility in Tailwind CSS for responsive images, videos, and containers. Learn best practices and real-world examples.
Learn how to install and configure the `astro-seo` component in your Astro site—streamline titles, meta tags, Open Graph and Twitter cards
From Cursor to Gemini, here are the top AI coding tools in 2025 and what makes each one stand out.
Learn how to integrate PagesCMS with Astro for a complete headless CMS solution. Step-by-step guide with code examples.
Think Tailwind CSS is just bloated markup? These 15+ utility classes will change your mind. See how single classes replace entire CSS blocks.
The path of a developer is rarely a straight line. Here are a few reflections on the messy, frustrating, and ultimately rewarding parts of the craft.
Learn how to use Tailwind CSS v4 for simple, direct styling. This guide covers the basics, making websites look good on any device, dark mode, and clever styling tricks. Perfect for building modern websites easily.
A tutorial on background attachments, image control, gradient text, clipping effects, and professional design patterns
Learn how to use Obsidian to write your Astro markdown projects using symbolic links for a powerful dual workflow that keeps your writing space clean and content perfectly synced.
A concise guide to implementing stunning linear, radial, and conic gradients in Tailwind CSS v4 with practical code examples.
A hands-on walkthrough of creating a custom VS Code theme using Yo Code, customizing it, and publishing it on the Marketplace.
A practical guide to 23 essential Git and GitHub commands for everyday development. Learn how to clone, commit, push, merge, and more.
Learn how to use GitHub's callout boxes like [!NOTE], [!WARNING], and [!TIP] to improve clarity in issues, PRs, and wikis. Copy-paste friendly guide included.
Learn how Tailwind CSS v4 supports container queries (`@container`) for component-level responsiveness using utility classes.
A complete cheat sheet for Tailwind CSS v4.1, including layout, spacing, typography, flexbox, grid, and all core utility classes. Perfect for fast lookup and reference.
Unlock powerful dynamic styling in Tailwind CSS using the `nth-child` selector. Learn how to target specific elements, create patterns, and build flexible UIs with practical examples.
Unlock responsive web design with CSS calc() in Astro and Tailwind CSS. Learn to create dynamic layouts, adaptive components, and fluid UIs with practical examples and advanced techniques.
Master Git tags for better version control. Learn to create, manage, and use Git tags for releases, deployments, and project milestones. Includes commands, best practices, and real examples.
Create a sleek theme switcher with default, dark, and accent modes using CSS custom properties and localStorage
Learn how to create a comprehensive theme toggle that respects user preferences with three states: light, dark, and system detection.
Learn how to add a smart Claude button that opens Claude.ai with your page info already filled in. Simple JavaScript code for better user support.
Learn how to add a smart Ask ChatGPT button that automatically opens ChatGPT with context about your current page.
Learn how to build a JavaScript HTML-to-Markdown converter perfect for Astro websites and Tailwind CSS projects. Copy webpage content as clean Markdown for AI workflows, documentation, and content migration.
A quick guide on how to upgrade an your Astro JS project from Tailwind CSS v3 to Tailwind CSS v4 ( Alpha ).
Explore Tailwind CSS utility classes for responsive design. Learn how svh, lvh, and dvh can ensure your site looks great on any device.
Perfect for the so called bento grids
Discover how to ensure your website's footer stays exactly where it should be, at the bottom, with Tailwind CSS techniques and additional strategies for impeccable web design.
Explore how Astro.js and Tailwind CSS revolutionize web development with unmatched performance optimizations. This guide dives into practical strategies for leveraging these powerful tools to build faster, more responsive, and SEO-friendly websites. Perfect for developers seeking to elevate their projects with cutting-edge technology.
Dive into the world of modern web development with our step-by-step guide on Astro.js and Tailwind CSS. From setting up your environment to deploying advanced, performance-optimized websites, this tutorial covers everything you need to create stunning, responsive web designs. Perfect for beginners and seasoned developers alike, learn how to harness the full potential of Astro.js and Tailwind CSS to elevate your web projects.
Dive into the world of HTML with our guide to some of the most uncommon semantic tags. From <details> to <mark>, learn how these hidden gems can improve accessibility, enhance document structure, and bring clarity to your web content.
Center a div with CSS using flexbox, grid, margin auto, and absolute positioning—horizontal, vertical, and responsive patterns with clear examples.
Learn how to center a div in Tailwind CSS using flex, grid, and margin utilities, with responsive patterns and tips to avoid common pitfalls.
Discover how semantic HTML boosts structure, accessibility, and SEO—use meaningful tags, headings, and landmarks to create cleaner, maintainable markup.
Master Shiki syntax highlighting in Astro.js with CSS variables. Customize and elevate your code's appearance effortlessly.
A closer look at Astro.js—how islands, partial hydration, and file-based routing help you ship faster with less JS.
This blog post shows how to add custom typography to your Tailwind CSS project, with example code.