fix: header nav links work from any page, add RESEND_API_KEY to CI

Nav links now use absolute paths (/#about, /#skills, etc.) so they
correctly navigate to homepage sections from /blog and other pages.
Also adds RESEND_API_KEY env var to production CI workflow and updates
hello-world blog post content.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: Arckie Jadulco

.github/workflows/production.yml

@@ -4,6 +4,7 @@
 # Prerequisites — add these as GitHub repository secrets:
 #   CLOUDFLARE_API_TOKEN  → API token with "Cloudflare Pages: Edit" permission
 #   CLOUDFLARE_ACCOUNT_ID → Your Cloudflare account ID (visible in dashboard sidebar)
+#   RESEND_API_KEY        → Resend API key for the contact form email service
 #
 # Also update the `projectName` value below to match your Cloudflare Pages project name.
 #
@@ -58,6 +59,8 @@ jobs:
         run: ${{ steps.detect-package-manager.outputs.manager }} ${{ steps.detect-package-manager.outputs.command }}
       - name: Static HTML export with Nuxt
         run: ${{ steps.detect-package-manager.outputs.manager }} run generate
+        env:
+          RESEND_API_KEY: ${{ secrets.RESEND_API_KEY }}
         # No NUXT_APP_BASE_URL needed here — production runs at the root
         # of arckiejadulco.dev, so the default "/" applies.
       - name: Deploy to Cloudflare Pages

app/components/TheHeader.vue

@@ -6,12 +6,12 @@ const emit = defineEmits<{
 const isScrolled = ref(false)
 
 const navLinks = [
-  { label: 'About', href: '#about' },
-  { label: 'Skills', href: '#skills' },
-  { label: 'Projects', href: '#projects' },
-  { label: 'Experience', href: '#experience' },
+  { label: 'About', href: '/#about' },
+  { label: 'Skills', href: '/#skills' },
+  { label: 'Projects', href: '/#projects' },
+  { label: 'Experience', href: '/#experience' },
+  { label: 'Contact', href: '/#contact' },
   { label: 'Blog', href: '/blog' },
-  { label: 'Contact', href: '#contact' },
 ]
 
 onMounted(() => {
@@ -48,22 +48,14 @@ onMounted(() => {
 
         <!-- Desktop Navigation -->
         <div class="hidden items-center gap-4 md:flex lg:gap-8">
-          <template v-for="link in navLinks" :key="link.label">
-            <NuxtLink
-              v-if="link.href.startsWith('/')"
-              :to="link.href"
-              class="link-underline text-sm font-medium tracking-wide text-[var(--color-text-secondary)] transition-colors hover:text-[var(--color-text-primary)]"
-            >
-              {{ link.label }}
-            </NuxtLink>
-            <a
-              v-else
-              :href="link.href"
-              class="link-underline text-sm font-medium tracking-wide text-[var(--color-text-secondary)] transition-colors hover:text-[var(--color-text-primary)]"
-            >
-              {{ link.label }}
-            </a>
-          </template>
+          <NuxtLink
+            v-for="link in navLinks"
+            :key="link.label"
+            :to="link.href"
+            class="link-underline text-sm font-medium tracking-wide text-[var(--color-text-secondary)] transition-colors hover:text-[var(--color-text-primary)]"
+          >
+            {{ link.label }}
+          </NuxtLink>
         </div>
 
         <!-- Mobile Menu Toggle -->

app/components/TheMobileMenu.vue

@@ -8,12 +8,12 @@ const emit = defineEmits<{
 }>()
 
 const navLinks = [
-  { label: 'About', href: '#about' },
-  { label: 'Skills', href: '#skills' },
-  { label: 'Projects', href: '#projects' },
-  { label: 'Experience', href: '#experience' },
+  { label: 'About', href: '/#about' },
+  { label: 'Skills', href: '/#skills' },
+  { label: 'Projects', href: '/#projects' },
+  { label: 'Experience', href: '/#experience' },
   { label: 'Blog', href: '/blog' },
-  { label: 'Contact', href: '#contact' },
+  { label: 'Contact', href: '/#contact' },
 ]
 
 // Handle escape key
@@ -70,26 +70,16 @@ watch(() => props.isOpen, (isOpen) => {
 
           <!-- Navigation Links -->
           <nav class="mt-8 flex flex-1 flex-col items-center justify-center gap-5 sm:mt-12 sm:gap-8">
-            <template v-for="(link, index) in navLinks" :key="link.label">
-              <NuxtLink
-                v-if="link.href.startsWith('/')"
-                :to="link.href"
-                class="font-display text-2xl font-semibold text-[var(--color-text-primary)] transition-colors hover:text-[var(--color-accent-primary)] sm:text-3xl"
-                :style="{ animationDelay: `${index * 50}ms` }"
-                @click="emit('close')"
-              >
-                {{ link.label }}
-              </NuxtLink>
-              <a
-                v-else
-                :href="link.href"
-                class="font-display text-2xl font-semibold text-[var(--color-text-primary)] transition-colors hover:text-[var(--color-accent-primary)] sm:text-3xl"
-                :style="{ animationDelay: `${index * 50}ms` }"
-                @click="emit('close')"
-              >
-                {{ link.label }}
-              </a>
-            </template>
+            <NuxtLink
+              v-for="(link, index) in navLinks"
+              :key="link.label"
+              :to="link.href"
+              class="font-display text-2xl font-semibold text-[var(--color-text-primary)] transition-colors hover:text-[var(--color-accent-primary)] sm:text-3xl"
+              :style="{ animationDelay: `${index * 50}ms` }"
+              @click="emit('close')"
+            >
+              {{ link.label }}
+            </NuxtLink>
           </nav>
 
           <!-- Social Links -->

content/blog/hello-world.md

@@ -15,6 +15,7 @@ There are several reasons why I decided to start writing:
 1. **Learning in public** - Writing forces me to organize my thoughts and understand concepts more deeply
 2. **Helping others** - If my experiences can help even one person, it's worth the effort
 3. **Building a portfolio** - A blog showcases not just coding skills but also communication abilities
+4. **Fun Brain Exercise** - I wanted to keep sharpening the saw for my creative side of the brain, if you know what I mean.
 
 ## What to Expect
 
@@ -24,14 +25,15 @@ I'll be covering a variety of topics including:
 - **Tech Reviews** - My honest opinions on tools, frameworks, and technologies I use
 - **Career Insights** - Lessons learned from my journey as a developer
 - **Personal Projects** - Deep dives into side projects and what I learned building them
+- **Hobbies & Interests** - When I feel like sharing a more personal side of me
 
 ## My Commitment
 
 I aim to publish at least one quality post per month. I believe in quality over quantity, so each post will be thoroughly researched and carefully written.
 
 > "The best time to plant a tree was 20 years ago. The second best time is now." - Chinese Proverb
 
-This quote resonates with me because I've been putting off starting a blog for years. But here we are, finally taking that first step!
+This quote resonates with me because I've been putting off starting a blog (even completing this website) for years. But here we are, finally taking that first giant leap!
 
 ## Let's Connect