[Chore] Configure GitHub Pages deployment for organization repo

Author: notyado

.github/workflows/nextjs.yml

@@ -1,86 +1,57 @@
-# Sample workflow for building and deploying a Next.js site to GitHub Pages
-#
-# To get started with Next.js see: https://nextjs.org/docs/getting-started
-#
-name: Deploy Next.js site to Pages
+name: Deploy to GitHub Pages
 
 on:
-  # Runs on pushes targeting the default branch
   push:
-    branches: ["main"]
-
-  # Allows you to run this workflow manually from the Actions tab
+    branches:
+      - main
+      - master
   workflow_dispatch:
 
-# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
 permissions:
   contents: read
   pages: write
   id-token: write
 
-# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
-# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
 concurrency:
   group: "pages"
   cancel-in-progress: false
 
 jobs:
-  # Build job
   build:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
         uses: actions/checkout@v4
-      - name: Detect package manager
-        id: detect-package-manager
-        run: |
-          if [ -f "${{ github.workspace }}/yarn.lock" ]; then
-            echo "manager=yarn" >> $GITHUB_OUTPUT
-            echo "command=install" >> $GITHUB_OUTPUT
-            echo "runner=yarn" >> $GITHUB_OUTPUT
-            exit 0
-          elif [ -f "${{ github.workspace }}/package.json" ]; then
-            echo "manager=npm" >> $GITHUB_OUTPUT
-            echo "command=ci" >> $GITHUB_OUTPUT
-            echo "runner=npx --no-install" >> $GITHUB_OUTPUT
-            exit 0
-          else
-            echo "Unable to determine package manager"
-            exit 1
-          fi
-      - name: Setup Node
+
+      - name: Setup Bun
+        uses: oven-sh/setup-bun@v2
+        with:
+          bun-version: latest
+
+      - name: Setup Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: "20"
-          cache: ${{ steps.detect-package-manager.outputs.manager }}
+          node-version: '20'
+
+      - name: Install dependencies
+        run: bun install --frozen-lockfile
+
+      - name: Build
+        env:
+          NEXT_PUBLIC_BASE_PATH: /website
+        run: bun run build
+
+      - name: Create .nojekyll file
+        run: touch ./out/.nojekyll
+
       - name: Setup Pages
         uses: actions/configure-pages@v5
-        with:
-          # Automatically inject basePath in your Next.js configuration file and disable
-          # server side image optimization (https://nextjs.org/docs/api-reference/next/image#unoptimized).
-          #
-          # You may remove this line if you want to manage the configuration yourself.
-          static_site_generator: next
-      - name: Restore cache
-        uses: actions/cache@v4
-        with:
-          path: |
-            .next/cache
-          # Generate a new cache whenever packages or source files change.
-          key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-${{ hashFiles('**.[jt]s', '**.[jt]sx') }}
-          # If source files changed but packages didn't, rebuild from a prior cache.
-          restore-keys: |
-            ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-
-      - name: Install dependencies
-        run: ${{ steps.detect-package-manager.outputs.manager }} ${{ steps.detect-package-manager.outputs.command }}
-      - name: Build with Next.js
-        run: ${{ steps.detect-package-manager.outputs.runner }} next build
+
       - name: Upload artifact
         uses: actions/upload-pages-artifact@v3
         with:
           path: ./out
 
-  # Deployment job
   deploy:
     environment:
       name: github-pages
@@ -91,3 +62,4 @@ jobs:
       - name: Deploy to GitHub Pages
         id: deployment
         uses: actions/deploy-pages@v4
+

app/layout.tsx

@@ -1,9 +1,9 @@
 import type React from "react"
 import type { Metadata } from "next"
 
-import { Analytics } from "@vercel/analytics/next"
 import { Header } from "@/components/header"
 import { Footer } from "@/components/footer"
+import { basePath } from "@/lib/utils"
 import "./globals.css"
 
 import { Inter, Playfair_Display, JetBrains_Mono, Libre_Baskerville as V0_Font_Libre_Baskerville, IBM_Plex_Mono as V0_Font_IBM_Plex_Mono, Lora as V0_Font_Lora } from 'next/font/google'
@@ -21,7 +21,7 @@ export const metadata: Metadata = {
   title: "BreadCrumbs - A Modern Programming Language",
   description: "BreadCrumbs is a modern programming language for enthusiasts who love clean, expressive code.",
   icons: {
-    icon: "/images/image-2025-12-24-01-58-31.png",
+    icon: `${basePath}/images/logo.png`,
   },
     generator: 'v0.app'
 }
@@ -39,7 +39,6 @@ export default function RootLayout({
           <main className="flex-1">{children}</main>
           <Footer />
         </div>
-        <Analytics />
       </body>
     </html>
   )

app/page.tsx

@@ -1,4 +1,5 @@
 import type React from "react"
+import { basePath } from "@/lib/utils"
 import { CrumbButton } from "@/components/crumb-button"
 import { Code, Zap, Users, BookOpen, ArrowRight } from "lucide-react"
 
@@ -11,8 +12,10 @@ export default function HomePage() {
           <div className="flex flex-col items-center text-center max-w-4xl mx-auto">
             <div className="mb-8 animate-in fade-in zoom-in duration-500">
               <img
-                src="/images/image-2025-12-24-01-58-31.png"
+                src={`${basePath}/images/logo.png`}
                 alt="BreadCrumbs Logo"
+                width={160}
+                height={160}
                 className="w-32 h-32 md:w-40 md:h-40 mx-auto"
               />
             </div>

components/docs-sidebar.tsx

@@ -2,7 +2,7 @@
 
 import Link from "next/link"
 import { usePathname } from "next/navigation"
-import { cn } from "@/lib/utils"
+import { cn, basePath } from "@/lib/utils"
 import { docsConfig } from "@/lib/docs-config"
 import { ChevronDown } from "lucide-react"
 import { useState } from "react"
@@ -21,7 +21,7 @@ export function DocsSidebar() {
     <aside className="w-64 shrink-0 border-r border-border bg-sidebar hidden lg:block">
       <div className="sticky top-16 h-[calc(100vh-4rem)] overflow-y-auto p-4">
         <div className="flex items-center gap-2 mb-6 pb-4 border-b border-sidebar-border">
-          <img src="/images/image-2025-12-24-01-58-31.png" alt="BreadCrumbs" className="w-8 h-8" />
+          <img src={`${basePath}/images/logo.png`} alt="BreadCrumbs" width={32} height={32} />
           <span className="font-serif font-bold text-sidebar-foreground">BreadCrumbs</span>
         </div>
 

components/footer.tsx

@@ -1,4 +1,5 @@
 import Link from "next/link"
+import { basePath } from "@/lib/utils"
 
 export function Footer() {
   return (
@@ -7,7 +8,7 @@ export function Footer() {
         <div className="grid grid-cols-1 md:grid-cols-4 gap-8">
           <div className="space-y-4">
             <div className="flex items-center gap-2">
-              <img src="/images/image-2025-12-24-01-58-31.png" alt="BreadCrumbs Logo" className="w-8 h-8" />
+              <img src={`${basePath}/images/logo.png`} alt="BreadCrumbs Logo" width={32} height={32} />
               <span className="font-serif text-lg font-bold">BreadCrumbs</span>
             </div>
             <p className="text-sm text-muted-foreground leading-relaxed">

components/header.tsx

@@ -3,7 +3,7 @@
 import Link from "next/link"
 import { usePathname } from "next/navigation"
 import { ThemeToggle } from "./theme-toggle"
-import { cn } from "@/lib/utils"
+import { cn, basePath } from "@/lib/utils"
 import { Menu, X } from "lucide-react"
 import { useState } from "react"
 
@@ -26,9 +26,11 @@ export function Header() {
         <div className="flex items-center justify-between h-16">
           <Link href="/" className="flex items-center gap-2 group">
             <img
-              src="/images/image-2025-12-24-01-58-31.png"
+              src={`${basePath}/images/logo.png`}
               alt="BreadCrumbs Logo"
-              className="w-10 h-10 transition-transform duration-300 group-hover:rotate-6"
+              width={40}
+              height={40}
+              className="transition-transform duration-300 group-hover:rotate-6"
             />
             <span className="font-serif text-xl font-bold text-foreground hidden sm:block">BreadCrumbs</span>
           </Link>

lib/utils.ts

@@ -4,3 +4,7 @@ import { twMerge } from 'tailwind-merge'
 export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs))
 }
+
+// Base path for GitHub Pages
+// This should match the basePath in next.config.mjs
+export const basePath = process.env.NEXT_PUBLIC_BASE_PATH || '/website'

next.config.mjs

@@ -1,12 +1,15 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
+  output: 'export',
   devIndicators: false,
   typescript: {
     ignoreBuildErrors: true,
   },
   images: {
     unoptimized: true,
   },
+  basePath: '/website',
+  assetPrefix: '/website/',
 }
 
 export default nextConfig

package.json

@@ -6,7 +6,8 @@
     "build": "next build",
     "dev": "next dev",
     "lint": "eslint .",
-    "start": "next start"
+    "start": "next start",
+    "export": "next build"
   },
   "dependencies": {
     "@hookform/resolvers": "^3.10.0",