Add GitHub Actions workflow for VitePress docs deploy

Introduces a GitHub Actions workflow to build and deploy VitePress documentation to GitHub Pages on changes to the docs or workflow file. Updates VitePress config to set the correct base path and update Open Graph and Twitter meta tags for deployment under the GitHub Pages URL.

Author: ayush-gupta07

.github/workflows/deploy-docs.yml

@@ -0,0 +1,69 @@
+# GitHub Actions workflow to build and deploy VitePress docs to GitHub Pages
+name: Deploy VitePress Docs to GitHub Pages
+
+on:
+  # Runs on pushes targeting the default branch
+  push:
+    branches:
+      - main  # Change this to 'master' if your default branch is 'master'
+    paths:
+      - 'docs/**'  # Only run when docs folder changes
+      - '.github/workflows/deploy-docs.yml'  # Or when this workflow changes
+
+  # Allows you to run this workflow manually from the Actions tab
+  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
+        with:
+          fetch-depth: 0 # Not needed if lastUpdated is not enabled
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: npm
+
+      - name: Setup Pages
+        uses: actions/configure-pages@v4
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build VitePress docs
+        run: npm run docs:build
+
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: docs/.vitepress/dist
+
+  # Deployment job
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    needs: build
+    runs-on: ubuntu-latest
+    name: Deploy
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

docs/.vitepress/config.ts

@@ -6,6 +6,7 @@ export default defineConfig({
   lang: 'en-US',
   lastUpdated: true,
   cleanUrls: true,
+  base: '/react-hooks/', // This should match your GitHub repository name
   head: [
     // Enhanced favicon and icons
     ['link', { rel: 'icon', href: '/favicon.png', sizes: '32x32' }],
@@ -21,14 +22,14 @@ export default defineConfig({
     ['meta', { property: 'og:title', content: 'React Hooks Notes - Complete Learning Resource' }],
     ['meta', { property: 'og:description', content: 'Master React Hooks with concise notes, practical examples, and interactive demos. Perfect for interviews and learning.' }],
     ['meta', { property: 'og:type', content: 'website' }],
-    ['meta', { property: 'og:url', content: 'https://your-domain.com' }],
-    ['meta', { property: 'og:image', content: 'https://your-domain.com/og-image.png' }],
+    ['meta', { property: 'og:url', content: 'https://ayush-gupta07.github.io/react-hooks/' }],
+    ['meta', { property: 'og:image', content: 'https://ayush-gupta07.github.io/react-hooks/og-image.png' }],
 
     // Twitter Card
     ['meta', { name: 'twitter:card', content: 'summary_large_image' }],
     ['meta', { name: 'twitter:title', content: 'React Hooks Notes' }],
     ['meta', { name: 'twitter:description', content: 'Master React Hooks with practical examples and concise notes' }],
-    ['meta', { name: 'twitter:image', content: 'https://your-domain.com/twitter-image.png' }],
+    ['meta', { name: 'twitter:image', content: 'https://ayush-gupta07.github.io/react-hooks/twitter-image.png' }],
 
     // Performance and PWA hints
     ['link', { rel: 'preconnect', href: 'https://fonts.googleapis.com' }],