Skip to content

Commit ac8f8f0

Browse files
committed
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.
1 parent f3b2625 commit ac8f8f0

File tree

2 files changed

+73
-3
lines changed

2 files changed

+73
-3
lines changed

.github/workflows/deploy-docs.yml

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
# GitHub Actions workflow to build and deploy VitePress docs to GitHub Pages
2+
name: Deploy VitePress Docs to GitHub Pages
3+
4+
on:
5+
# Runs on pushes targeting the default branch
6+
push:
7+
branches:
8+
- main # Change this to 'master' if your default branch is 'master'
9+
paths:
10+
- 'docs/**' # Only run when docs folder changes
11+
- '.github/workflows/deploy-docs.yml' # Or when this workflow changes
12+
13+
# Allows you to run this workflow manually from the Actions tab
14+
workflow_dispatch:
15+
16+
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
17+
permissions:
18+
contents: read
19+
pages: write
20+
id-token: write
21+
22+
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
23+
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
24+
concurrency:
25+
group: pages
26+
cancel-in-progress: false
27+
28+
jobs:
29+
# Build job
30+
build:
31+
runs-on: ubuntu-latest
32+
steps:
33+
- name: Checkout
34+
uses: actions/checkout@v4
35+
with:
36+
fetch-depth: 0 # Not needed if lastUpdated is not enabled
37+
38+
- name: Setup Node.js
39+
uses: actions/setup-node@v4
40+
with:
41+
node-version: 20
42+
cache: npm
43+
44+
- name: Setup Pages
45+
uses: actions/configure-pages@v4
46+
47+
- name: Install dependencies
48+
run: npm ci
49+
50+
- name: Build VitePress docs
51+
run: npm run docs:build
52+
53+
- name: Upload artifact
54+
uses: actions/upload-pages-artifact@v3
55+
with:
56+
path: docs/.vitepress/dist
57+
58+
# Deployment job
59+
deploy:
60+
environment:
61+
name: github-pages
62+
url: ${{ steps.deployment.outputs.page_url }}
63+
needs: build
64+
runs-on: ubuntu-latest
65+
name: Deploy
66+
steps:
67+
- name: Deploy to GitHub Pages
68+
id: deployment
69+
uses: actions/deploy-pages@v4

docs/.vitepress/config.ts

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ export default defineConfig({
66
lang: 'en-US',
77
lastUpdated: true,
88
cleanUrls: true,
9+
base: '/react-hooks/', // This should match your GitHub repository name
910
head: [
1011
// Enhanced favicon and icons
1112
['link', { rel: 'icon', href: '/favicon.png', sizes: '32x32' }],
@@ -21,14 +22,14 @@ export default defineConfig({
2122
['meta', { property: 'og:title', content: 'React Hooks Notes - Complete Learning Resource' }],
2223
['meta', { property: 'og:description', content: 'Master React Hooks with concise notes, practical examples, and interactive demos. Perfect for interviews and learning.' }],
2324
['meta', { property: 'og:type', content: 'website' }],
24-
['meta', { property: 'og:url', content: 'https://your-domain.com' }],
25-
['meta', { property: 'og:image', content: 'https://your-domain.com/og-image.png' }],
25+
['meta', { property: 'og:url', content: 'https://ayush-gupta07.github.io/react-hooks/' }],
26+
['meta', { property: 'og:image', content: 'https://ayush-gupta07.github.io/react-hooks/og-image.png' }],
2627

2728
// Twitter Card
2829
['meta', { name: 'twitter:card', content: 'summary_large_image' }],
2930
['meta', { name: 'twitter:title', content: 'React Hooks Notes' }],
3031
['meta', { name: 'twitter:description', content: 'Master React Hooks with practical examples and concise notes' }],
31-
['meta', { name: 'twitter:image', content: 'https://your-domain.com/twitter-image.png' }],
32+
['meta', { name: 'twitter:image', content: 'https://ayush-gupta07.github.io/react-hooks/twitter-image.png' }],
3233

3334
// Performance and PWA hints
3435
['link', { rel: 'preconnect', href: 'https://fonts.googleapis.com' }],

0 commit comments

Comments
 (0)