Skip to content
HHans Martens Dev
Tag

#tutorial

7 posts tagged "tutorial".

Going Multilingual: Native i18n in Astro Rocket

How Astro Rocket's opt-in i18n works end to end — locale routing, the t() helper, an auto-localized blog, projects, and navigation — and the exact steps to ship a multilingual site.

HHans Martens
2 min read
#astro-rocket#i18n#internationalization#tutorial

System, Light, Dark — How Astro Rocket's Colour-Mode System Works

A 3-state colour-mode system with no flash, live OS-preference tracking, and a pill dropdown that respects what the user actually picked. Here is how it is built.

HHans Martens
2 min read
#astro-rocket#dark-mode#design-system#ux#tutorial

Add a LetterGlitch Effect to Your Astro 7 Site

A step-by-step guide to dropping a brand-tinted LetterGlitch canvas effect into an Astro 7 project — with the full component, an Astro wrapper, and the small details that make it production-ready.

HHans Martens
2 min read
#astro#react#canvas#tailwind#tutorial

Contact Form Setup: Resend, Vercel, and GoDaddy Step by Step

Astro Rocket's contact form is wired up but needs three things to actually deliver email: a Resend account, a verified domain, and one environment variable on Vercel.

HHans Martens
2 min read
#astro-rocket#tutorial#email#vercel#deployment

SEO in Astro Rocket: What's Built In and How to Configure It

Astro Rocket handles structured data, Open Graph, canonical URLs, sitemaps, and more out of the box. Here's exactly what ships and where to configure it.

HHans Martens
2 min read
#astro-rocket#seo#structured-data#tutorial#configuration

How Astro Rocket's Design System Works — Tokens, Colors, and Dark Mode

Astro Rocket uses a three-tier token architecture with OKLCH colors. Change one value and the entire site updates. Here's how it works and how to make it yours.

HHans Martens
2 min read
#astro-rocket#design-system#tailwind#customization#tutorial

The Hero Typing Effect in Astro Rocket — How It Works and How to Tune It

Astro Rocket's hero headline cycles through words with a typing animation. Learn how it works, how to tune every speed and pause, and how to disable it entirely.

HHans Martens
2 min read
#astro-rocket#components#customization#tutorial#javascript