Initial commit: DNS Test - DNS health checking tool

Go backend (miekg/dns) + Nuxt 3 frontend (Tailwind CSS v4).

8 check categories, 52 checks total:
- Overview: @ record, WWW, MX with ASN/provider lookup
- Domain Registration: expiry, registrar (RDAP + whois fallback)
- Parent Delegation: NS records, glue, consistency
- Nameservers: 17 checks (reachability, auth, recursion, TCP/UDP, AXFR, etc.)
- SOA: serial consistency, timing values
- Mail (MX): 11 checks (CNAME, PTR, public IPs, consistency)
- Mail Auth: SPF, DKIM, DMARC
- WWW: A record, CNAME

Features:
- SSE streaming (results appear as each category completes)
- SQLite history (modernc.org/sqlite)
- Rate limiting, CORS, request logging
- Dark mode, responsive design

frontend/app/pages/[...domain].vue

@@ -0,0 +1,140 @@
+<template>
+  <div class="mx-auto max-w-5xl px-4 py-8 sm:px-6">
+    <div class="mb-8">
+      <DomainInput :initial-value="domain" @submit="onNewDomain" />
+    </div>
+
+    <!-- Loading state with progress -->
+    <div v-if="loading && !report" class="flex flex-col items-center justify-center py-20">
+      <div class="relative h-16 w-16">
+        <div class="absolute inset-0 rounded-full border-4 border-gray-200 dark:border-gray-700"></div>
+        <div class="absolute inset-0 animate-spin rounded-full border-4 border-transparent border-t-indigo-600 dark:border-t-indigo-400"></div>
+      </div>
+      <p class="mt-6 text-lg font-medium text-gray-600 dark:text-gray-400">
+        Checking DNS configuration...
+      </p>
+      <div class="mt-4 w-64">
+        <div class="flex h-2 overflow-hidden rounded-full bg-gray-200 dark:bg-gray-700">
+          <div
+            class="bg-indigo-600 transition-all duration-500 dark:bg-indigo-400"
+            :style="{ width: `${(progress / totalCategories) * 100}%` }"
+          ></div>
+        </div>
+        <p class="mt-2 text-center text-xs text-gray-400 dark:text-gray-500">
+          {{ progress }} / {{ totalCategories }} categories
+        </p>
+      </div>
+    </div>
+
+    <!-- Error state -->
+    <div v-else-if="error && !report" class="rounded-xl border border-red-200 bg-red-50 p-6 text-center dark:border-red-800 dark:bg-red-950/30">
+      <svg xmlns="http://www.w3.org/2000/svg" class="mx-auto h-12 w-12 text-red-400" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+        <path stroke-linecap="round" stroke-linejoin="round" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L4.082 16.5c-.77.833.192 2.5 1.732 2.5z" />
+      </svg>
+      <h2 class="mt-4 text-lg font-semibold text-red-800 dark:text-red-300">DNS Check Failed</h2>
+      <p class="mt-2 text-red-600 dark:text-red-400">{{ error }}</p>
+      <button
+        @click="checkDomain(domain)"
+        class="mt-4 inline-flex items-center gap-2 rounded-lg bg-red-600 px-4 py-2 text-sm font-medium text-white hover:bg-red-700"
+      >
+        Try Again
+      </button>
+    </div>
+
+    <!-- Results (shown progressively as categories arrive) -->
+    <template v-if="report">
+      <div class="mb-6 flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between">
+        <div>
+          <h1 class="text-2xl font-bold text-gray-900 dark:text-white">
+            Report for <span class="text-indigo-600 dark:text-indigo-400">{{ report.domain }}</span>
+          </h1>
+          <p class="mt-1 text-sm text-gray-500 dark:text-gray-400">
+            <template v-if="loading">Checking...</template>
+            <template v-else>Completed in {{ report.duration_ms }}ms</template>
+            &middot; {{ formatTimestamp(report.timestamp) }}
+          </p>
+        </div>
+      </div>
+
+      <!-- Progress bar while still loading -->
+      <div v-if="loading" class="mb-4">
+        <div class="flex h-1.5 overflow-hidden rounded-full bg-gray-200 dark:bg-gray-700">
+          <div
+            class="bg-indigo-600 transition-all duration-500 dark:bg-indigo-400"
+            :style="{ width: `${(progress / totalCategories) * 100}%` }"
+          ></div>
+        </div>
+      </div>
+
+      <SummaryBar :summary="report.summary" :active-filter="statusFilter" @filter="onFilter" />
+
+      <div class="mt-8 space-y-6">
+        <ReportSection
+          v-for="category in filteredCategories"
+          :key="category.name"
+          :category="category"
+          :status-filter="statusFilter"
+        />
+      </div>
+    </template>
+  </div>
+</template>
+
+<script setup lang="ts">
+const route = useRoute()
+const router = useRouter()
+import type { CheckStatus } from '~/types/dns'
+const { report, loading, error, progress, totalCategories, checkDomain } = useDnsCheck()
+const statusFilter = ref<CheckStatus | null>(null)
+
+const domain = computed(() => {
+  const params = route.params.domain
+  if (Array.isArray(params)) {
+    return params.join('/')
+  }
+  return params || ''
+})
+
+// Sort categories in consistent order as they arrive
+const categoryOrder = ['overview', 'registration', 'parent', 'nameservers', 'soa', 'mx', 'mail-auth', 'www']
+const sortedCategories = computed(() => {
+  if (!report.value) return []
+  return [...report.value.categories].sort((a, b) => {
+    return categoryOrder.indexOf(a.name) - categoryOrder.indexOf(b.name)
+  })
+})
+
+// Filter categories to only those with matching checks
+const filteredCategories = computed(() => {
+  if (!statusFilter.value) return sortedCategories.value
+  return sortedCategories.value.filter(cat =>
+    cat.checks.some(c => c.status === statusFilter.value)
+  )
+})
+
+function onFilter(status: CheckStatus | null) {
+  statusFilter.value = status
+}
+
+function onNewDomain(newDomain: string) {
+  router.push(`/${newDomain}`)
+}
+
+function formatTimestamp(ts: string) {
+  try {
+    return new Date(ts).toLocaleString()
+  } catch {
+    return ts
+  }
+}
+
+watch(domain, (val) => {
+  if (val) {
+    checkDomain(val)
+  }
+}, { immediate: true })
+
+useHead({
+  title: () => domain.value ? `DNS Test - ${domain.value}` : 'DNS Test',
+})
+</script>

frontend/app/pages/index.vue

@@ -0,0 +1,53 @@
+<template>
+  <div class="mx-auto max-w-5xl px-4 sm:px-6">
+    <section class="py-16 text-center sm:py-24">
+      <h1 class="text-4xl font-extrabold tracking-tight text-gray-900 dark:text-white sm:text-5xl">
+        DNS Test
+      </h1>
+      <p class="mx-auto mt-4 max-w-xl text-lg text-gray-600 dark:text-gray-400">
+        Check your domain's DNS health. Get a comprehensive report on your nameservers, mail servers, and DNS configuration.
+      </p>
+      <div class="mx-auto mt-10 max-w-xl">
+        <DomainInput @submit="onSubmit" />
+      </div>
+    </section>
+
+    <section class="grid gap-6 pb-16 sm:grid-cols-3">
+      <div class="rounded-xl border border-gray-200 bg-white p-6 dark:border-gray-800 dark:bg-gray-900">
+        <div class="mb-3 inline-flex rounded-lg bg-indigo-100 p-2 text-indigo-600 dark:bg-indigo-900/30 dark:text-indigo-400">
+          <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+            <path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14M5 12a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v4a2 2 0 01-2 2M5 12a2 2 0 00-2 2v4a2 2 0 002 2h14a2 2 0 002-2v-4a2 2 0 00-2-2" />
+          </svg>
+        </div>
+        <h3 class="font-semibold text-gray-900 dark:text-white">Nameserver Checks</h3>
+        <p class="mt-1 text-sm text-gray-500 dark:text-gray-400">Verify NS records, delegation, and nameserver responsiveness.</p>
+      </div>
+      <div class="rounded-xl border border-gray-200 bg-white p-6 dark:border-gray-800 dark:bg-gray-900">
+        <div class="mb-3 inline-flex rounded-lg bg-green-100 p-2 text-green-600 dark:bg-green-900/30 dark:text-green-400">
+          <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+            <path stroke-linecap="round" stroke-linejoin="round" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
+          </svg>
+        </div>
+        <h3 class="font-semibold text-gray-900 dark:text-white">Mail Configuration</h3>
+        <p class="mt-1 text-sm text-gray-500 dark:text-gray-400">Check MX records, SPF, DKIM, and DMARC policies.</p>
+      </div>
+      <div class="rounded-xl border border-gray-200 bg-white p-6 dark:border-gray-800 dark:bg-gray-900">
+        <div class="mb-3 inline-flex rounded-lg bg-amber-100 p-2 text-amber-600 dark:bg-amber-900/30 dark:text-amber-400">
+          <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+            <path stroke-linecap="round" stroke-linejoin="round" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
+          </svg>
+        </div>
+        <h3 class="font-semibold text-gray-900 dark:text-white">Security & DNSSEC</h3>
+        <p class="mt-1 text-sm text-gray-500 dark:text-gray-400">Validate DNSSEC configuration and security best practices.</p>
+      </div>
+    </section>
+  </div>
+</template>
+
+<script setup lang="ts">
+const router = useRouter()
+
+function onSubmit(domain: string) {
+  router.push(`/${domain}`)
+}
+</script>