✨ feat: add Firebase dev setup guide page with i18n support

- New /how-to-develop-setup page with 10-step Firebase setup guide
- Beginner-friendly with terminal blocks for each step
- Full Myanmar/English translations
- Consistent UI with HowTo page (timeline, CTA card)
- Added footer navigation link
- Updated CLAUDE.md Next.js version to 16.1.6

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: lwinmoepaing

CLAUDE.md

@@ -6,7 +6,7 @@ Myanmar Software Engineers (MMSWE) — a community platform showcasing Myanmar s
 
 ## Tech Stack
 
-- **Framework**: Next.js 13.5.4 (App Router, TypeScript, static export)
+- **Framework**: Next.js 16.1.6 (App Router, TypeScript, static export)
 - **Package Manager**: Bun (primary)
 - **Styling**: Tailwind CSS + DaisyUI + Sass
 - **Content**: Contentlayer with MDX (profiles and blogs)

messages/en.json

@@ -280,6 +280,77 @@
     "accessDeniedDesc": "You don't have permission to view this page.",
     "backToBlog": "Back to Blog"
   },
+  "devSetup": {
+    "label": "Development Setup",
+    "title": "Firebase Setup Guide",
+    "subtitle": "Follow these {count} steps to set up Firebase for local development. Beginner-friendly — no prior experience needed.",
+    "step1Title": "Create a Google Account",
+    "step1Desc": "Firebase is a Google product, so you need a Google account. If you already have a Gmail account, skip this step.",
+    "step1Line1": "Go to: accounts.google.com/signup",
+    "step1Line2": "Fill in your name and create a username",
+    "step1Line3": "Set a password and verify your phone",
+    "step1Line4": "Done! You now have a Google account",
+    "step2Title": "Create a Firebase Project",
+    "step2Desc": "Go to the Firebase Console and create a new project for your development environment.",
+    "step2Line1": "Go to: console.firebase.google.com",
+    "step2Line2": "Click \"Create a project\" or \"Add project\"",
+    "step2Line3": "Enter project name (e.g. mmswe-dev)",
+    "step2Line4": "Enable or skip Google Analytics",
+    "step2Line5": "Click \"Create project\" and wait ~30 seconds",
+    "step3Title": "Register a Web App",
+    "step3Desc": "Inside your Firebase project, register a web application to get your credentials.",
+    "step3Line1": "On Project Overview, click the Web icon",
+    "step3Line2": "Enter an app nickname (e.g. mmswe-web)",
+    "step3Line3": "Skip Firebase Hosting (uncheck it)",
+    "step3Line4": "Click \"Register app\"",
+    "step4Title": "Copy Firebase Config",
+    "step4Desc": "After registering, Firebase shows your config values. Copy them — you'll need these for your .env.local file.",
+    "step4Line1": "apiKey: \"AIzaSy...\"",
+    "step4Line2": "authDomain: \"your-project.firebaseapp.com\"",
+    "step4Line3": "projectId: \"your-project-id\"",
+    "step4Line4": "storageBucket: \"your-project.firebasestorage.app\"",
+    "step4Line5": "messagingSenderId: \"123456789\"",
+    "step4Line6": "appId: \"1:123456789:web:abc123\"",
+    "step4Tip": "You can find these anytime at: Project Settings → General → Your apps",
+    "step5Title": "Enable Google Authentication",
+    "step5Desc": "Set up Google sign-in so users can log in to the platform.",
+    "step5Line1": "Sidebar → Build → Authentication → Get started",
+    "step5Line2": "Click \"Sign-in method\" tab",
+    "step5Line3": "Click \"Google\" → Toggle Enable → Save",
+    "step5Line4": "Set your project name and support email",
+    "step6Title": "Create Firestore Database",
+    "step6Desc": "Firestore stores blog posts, job listings, and user data.",
+    "step6Line1": "Sidebar → Build → Firestore Database",
+    "step6Line2": "Click \"Create database\"",
+    "step6Line3": "Choose location (asia-southeast1 for Myanmar)",
+    "step6Line4": "Start in \"Test mode\" for development",
+    "step6Line5": "Click \"Create\"",
+    "step7Title": "Create Firebase Storage",
+    "step7Desc": "Storage handles image uploads for blog cover photos and user avatars.",
+    "step7Line1": "Sidebar → Build → Storage",
+    "step7Line2": "Click \"Get started\"",
+    "step7Line3": "Start in \"Test mode\" for development",
+    "step7Line4": "Click \"Done\"",
+    "step8Title": "Clone & Install the Project",
+    "step8Desc": "Clone the MMSWE repository and install dependencies using Bun. If you already have the code cloned, just run bun install and skip to the next step.",
+    "step9Title": "Set Up Environment Variables",
+    "step9Desc": "Create your .env.local file and paste the Firebase config values from Step 4.",
+    "step9Line1": "cp .env.example .env.local",
+    "step9Line2": "# Then edit .env.local with your Firebase values:",
+    "step9Line3": "NEXT_PUBLIC_FIREBASE_API_KEY=your-api-key",
+    "step9Line4": "NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=your-project.firebaseapp.com",
+    "step9Line5": "NEXT_PUBLIC_FIREBASE_PROJECT_ID=your-project-id",
+    "step9Line6": "NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=your-project.firebasestorage.app",
+    "step9Line7": "NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=123456789",
+    "step9Line8": "NEXT_PUBLIC_FIREBASE_APP_ID=1:123456789:web:abc123",
+    "step9Line9": "NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID=G-XXXXXXXXXX",
+    "step10Title": "Run the Dev Server",
+    "step10Desc": "Start the development server and open the app in your browser.",
+    "ctaComplete": "Setup Complete!",
+    "ctaDesc": "You're all set to develop locally with Firebase. Sign in with Google, create blog posts, and test job listings.",
+    "ctaOpenApp": "Open Dev Server",
+    "ctaViewGuide": "View How-to Guide"
+  },
   "profileHero": {
     "label": "Developer Directory",
     "title": "Profiles",
@@ -301,6 +372,7 @@
     "blog": "Blog",
     "contactUs": "Contact Us",
     "jobs": "Jobs",
+    "devSetup": "Dev Setup",
     "community": "Community",
     "github": "GitHub Organization",
     "facebook": "Facebook Group",

messages/mm.json

@@ -280,6 +280,77 @@
     "accessDeniedDesc": "ဤစာမျက်နှာကို ကြည့်ရှုခွင့် မရှိပါ။",
     "backToBlog": "ဘလော့ဂ် သို့ ပြန်သွားရန်"
   },
+  "devSetup": {
+    "label": "ဆော့ဖ်ဝဲ ပတ်ဝန်းကျင် စတင်ရန်",
+    "title": "Firebase စတင်အသုံးပြုနည်း",
+    "subtitle": "Local development အတွက် Firebase ကို စတင်ရန် ဤအဆင့် {count} ဆင့်ကို လိုက်နာပါ။ အတွေ့အကြုံ မလိုပါ - အစကနေ လမ်းညွှန်ပေးပါမည်။",
+    "step1Title": "Google အကောင့် ဖန်တီးပါ",
+    "step1Desc": "Firebase သည် Google ၏ ထုတ်ကုန်ဖြစ်သောကြောင့် Google အကောင့် လိုအပ်ပါသည်။ Gmail အကောင့် ရှိပြီးသားဆိုလျှင် ဤအဆင့်ကို ကျော်လိုက်ပါ။",
+    "step1Line1": "ဒီကိုသွားပါ: accounts.google.com/signup",
+    "step1Line2": "အမည်နှင့် username ဖြည့်ပါ",
+    "step1Line3": "လျှို့ဝှက်နံပါတ် သတ်မှတ်ပြီး ဖုန်းနံပါတ် အတည်ပြုပါ",
+    "step1Line4": "ပြီးပါပြီ! Google အကောင့် ရရှိပါပြီ",
+    "step2Title": "Firebase Project ဖန်တီးပါ",
+    "step2Desc": "Firebase Console သို့ သွားပြီး သင့် development အတွက် project အသစ် ဖန်တီးပါ။",
+    "step2Line1": "ဒီကိုသွားပါ: console.firebase.google.com",
+    "step2Line2": "\"Create a project\" သို့မဟုတ် \"Add project\" ကို နှိပ်ပါ",
+    "step2Line3": "Project အမည် ထည့်ပါ (ဥပမာ - mmswe-dev)",
+    "step2Line4": "Google Analytics ကို ဖွင့်ပါ သို့မဟုတ် ကျော်ပါ",
+    "step2Line5": "\"Create project\" ကို နှိပ်ပြီး စက္ကန့် ၃၀ ခန့် စောင့်ပါ",
+    "step3Title": "Web App မှတ်ပုံတင်ပါ",
+    "step3Desc": "Firebase project ထဲတွင် web application ကို မှတ်ပုံတင်ပြီး credentials များ ရယူပါ။",
+    "step3Line1": "Project Overview တွင် Web icon ကို နှိပ်ပါ",
+    "step3Line2": "App nickname ထည့်ပါ (ဥပမာ - mmswe-web)",
+    "step3Line3": "Firebase Hosting ကို ကျော်ပါ (uncheck လုပ်ပါ)",
+    "step3Line4": "\"Register app\" ကို နှိပ်ပါ",
+    "step4Title": "Firebase Config ကူးယူပါ",
+    "step4Desc": "မှတ်ပုံတင်ပြီးနောက် Firebase က config values များ ပြပါမည်။ ကူးယူပါ - .env.local ဖိုင်တွင် သုံးရပါမည်။",
+    "step4Line1": "apiKey: \"AIzaSy...\"",
+    "step4Line2": "authDomain: \"your-project.firebaseapp.com\"",
+    "step4Line3": "projectId: \"your-project-id\"",
+    "step4Line4": "storageBucket: \"your-project.firebasestorage.app\"",
+    "step4Line5": "messagingSenderId: \"123456789\"",
+    "step4Line6": "appId: \"1:123456789:web:abc123\"",
+    "step4Tip": "ဤတန်ဖိုးများကို အချိန်မရွေး ရှာနိုင်ပါသည်: Project Settings → General → Your apps",
+    "step5Title": "Google Authentication ဖွင့်ပါ",
+    "step5Desc": "အသုံးပြုသူများ platform သို့ Google ဖြင့် ဝင်ရောက်နိုင်ရန် Google sign-in ကို စနစ်ထည့်သွင်းပါ။",
+    "step5Line1": "Sidebar → Build → Authentication → Get started",
+    "step5Line2": "\"Sign-in method\" tab ကို နှိပ်ပါ",
+    "step5Line3": "\"Google\" ကို နှိပ်ပါ → Enable ဖွင့်ပါ → Save",
+    "step5Line4": "Project name နှင့် support email ထည့်ပါ",
+    "step6Title": "Firestore Database ဖန်တီးပါ",
+    "step6Desc": "Firestore သည် blog posts, job listings နှင့် user data များကို သိမ်းဆည်းပါသည်။",
+    "step6Line1": "Sidebar → Build → Firestore Database",
+    "step6Line2": "\"Create database\" ကို နှိပ်ပါ",
+    "step6Line3": "တည်နေရာ ရွေးပါ (မြန်မာအတွက် asia-southeast1)",
+    "step6Line4": "Development အတွက် \"Test mode\" ကို ရွေးပါ",
+    "step6Line5": "\"Create\" ကို နှိပ်ပါ",
+    "step7Title": "Firebase Storage ဖန်တီးပါ",
+    "step7Desc": "Storage သည် blog cover photos နှင့် user avatars အတွက် ပုံများ upload လုပ်ရာတွင် အသုံးပြုပါသည်။",
+    "step7Line1": "Sidebar → Build → Storage",
+    "step7Line2": "\"Get started\" ကို နှိပ်ပါ",
+    "step7Line3": "Development အတွက် \"Test mode\" ကို ရွေးပါ",
+    "step7Line4": "\"Done\" ကို နှိပ်ပါ",
+    "step8Title": "Project ကို Clone နှင့် Install လုပ်ပါ",
+    "step8Desc": "MMSWE repository ကို clone လုပ်ပြီး Bun ဖြင့် dependencies များ install လုပ်ပါ။ code ရှိပြီးသားဆိုလျှင် bun install သာ run ပြီး နောက်အဆင့်သို့ ကျော်လိုက်ပါ။",
+    "step9Title": "Environment Variables စနစ်ထည့်ပါ",
+    "step9Desc": ".env.local ဖိုင် ဖန်တီးပြီး အဆင့် ၄ မှ Firebase config values များကို ထည့်ပါ။",
+    "step9Line1": "cp .env.example .env.local",
+    "step9Line2": "# ထို့နောက် .env.local ကို သင့် Firebase values များဖြင့် ပြင်ပါ:",
+    "step9Line3": "NEXT_PUBLIC_FIREBASE_API_KEY=your-api-key",
+    "step9Line4": "NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=your-project.firebaseapp.com",
+    "step9Line5": "NEXT_PUBLIC_FIREBASE_PROJECT_ID=your-project-id",
+    "step9Line6": "NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=your-project.firebasestorage.app",
+    "step9Line7": "NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=123456789",
+    "step9Line8": "NEXT_PUBLIC_FIREBASE_APP_ID=1:123456789:web:abc123",
+    "step9Line9": "NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID=G-XXXXXXXXXX",
+    "step10Title": "Dev Server ကို ဖွင့်ပါ",
+    "step10Desc": "Development server ကို စတင်ပြီး browser တွင် app ကို ဖွင့်ပါ။",
+    "ctaComplete": "စနစ်ထည့်သွင်းမှု ပြီးပါပြီ!",
+    "ctaDesc": "Firebase ဖြင့် local development အတွက် အဆင်သင့် ဖြစ်ပါပြီ။ Google ဖြင့် ဝင်ရောက်ပါ၊ blog posts ဖန်တီးပါ၊ job listings များ စမ်းသပ်ပါ။",
+    "ctaOpenApp": "Dev Server ဖွင့်ရန်",
+    "ctaViewGuide": "လမ်းညွှန် ကြည့်ရန်"
+  },
   "profileHero": {
     "label": "Developer လမ်းညွှန်",
     "title": "ပရိုဖိုင်များ",
@@ -301,6 +372,7 @@
     "blog": "ဘလော့ဂ်",
     "contactUs": "ဆက်သွယ်ရန်",
     "jobs": "အလုပ်များ",
+    "devSetup": "Development Setup စတင်ရန်",
     "community": "အသိုင်းအဝိုင်း",
     "github": "GitHub အဖွဲ့အစည်း",
     "facebook": "Facebook အဖွဲ့အစည်း",