Skip to content

Commit c3ea52b

Browse files
devnomadicdevnomadic
committed
Refactor staging deployment workflow and add staging area page for preview posts
1 parent 54b7ea9 commit c3ea52b

2 files changed

Lines changed: 238 additions & 32 deletions

File tree

‎.github/workflows/preview.yml‎

Lines changed: 140 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,24 @@
1-
name: Deploy PR Preview
1+
name: Deploy Staging Preview
22

33
on:
4-
pull_request:
5-
types:
6-
- opened
7-
- reopened
8-
- synchronize
9-
- closed
4+
push:
5+
branches: [post/updates] # Build staging when changes pushed to updates branch
6+
paths:
7+
- '_posts/**'
8+
- 'staging/**'
9+
- '_config*.yml'
10+
- '_layouts/**'
11+
- '_includes/**'
12+
- 'assets/**'
13+
workflow_dispatch: # Allow manual trigger
1014

1115
permissions:
1216
contents: write
13-
pull-requests: write
1417

15-
concurrency: preview-${{ github.ref }}
18+
concurrency: staging-preview
1619

1720
jobs:
18-
deploy-preview:
21+
deploy-staging:
1922
runs-on: ubuntu-latest
2023
steps:
2124
- name: Checkout
@@ -27,38 +30,143 @@ jobs:
2730
ruby-version: '3.1'
2831
bundler-cache: true
2932

30-
- name: Setup staging for preview
31-
if: github.event.action != 'closed'
33+
- name: Setup staging posts
3234
run: |
33-
# Copy any new or modified post files to staging directory
34-
# This allows preview of posts before they go live
35+
echo "=== Setting up staging posts ==="
36+
37+
# Ensure staging directory exists
3538
mkdir -p staging
3639
37-
# Find modified .md files in _posts directory from this PR
38-
git diff --name-only origin/main...HEAD | grep "^_posts/.*\.md$" | while read file; do
39-
if [ -f "$file" ]; then
40-
echo "Staging post: $file"
41-
cp "$file" "staging/$(basename "$file")"
42-
fi
43-
done
40+
# Find new or modified .md files in _posts directory
41+
echo "Checking for new/modified posts to stage..."
42+
43+
# Get posts that are new or modified compared to main branch
44+
if git rev-parse origin/main >/dev/null 2>&1; then
45+
echo "Comparing with main branch..."
46+
MODIFIED_POSTS=$(git diff --name-only origin/main...HEAD | grep "^_posts/.*\.md$" || true)
47+
else
48+
echo "Main branch not found, staging all posts..."
49+
MODIFIED_POSTS=$(find _posts -name "*.md" 2>/dev/null || true)
50+
fi
4451
45-
# List staged files for debugging
52+
if [ -n "$MODIFIED_POSTS" ]; then
53+
echo "Posts to stage:"
54+
echo "$MODIFIED_POSTS" | while read -r file; do
55+
if [ -f "$file" ]; then
56+
echo " - Staging: $file"
57+
cp "$file" "staging/$(basename "$file")"
58+
fi
59+
done
60+
else
61+
echo "No new/modified posts found to stage"
62+
fi
63+
64+
# Show current staging content
65+
echo "=== Current staging content ==="
4666
echo "Staged posts:"
47-
ls -la staging/ || echo "No posts staged"
67+
find staging/ -name "*.md" -not -name "README.md" -not -name "index.md" | sort || echo " (none)"
68+
69+
echo "Published posts:"
70+
ls -1 _posts/*.md 2>/dev/null | head -5 || echo " (none)"
4871
49-
- name: Build Jekyll site
50-
if: github.event.action != 'closed'
72+
- name: Build Jekyll site with staging
5173
run: |
74+
echo "=== Building Jekyll site with staging ==="
75+
5276
# Remove CNAME file for previews to avoid routing conflicts
5377
rm -f CNAME
54-
# Build with preview config that includes staging posts
78+
79+
# Build Jekyll site - staging posts will be included as a collection
5580
bundle exec jekyll build --config _config.yml,_config_preview.yml
81+
82+
echo "Build completed. Site structure:"
83+
find _site -name "*.html" | head -10
5684
env:
5785
JEKYLL_ENV: production
5886

59-
- name: Deploy preview
60-
uses: rossjrw/pr-preview-action@v1
61-
with:
62-
source-dir: ./_site
63-
preview-branch: gh-pages
64-
umbrella-dir: pr-preview
87+
- name: Deploy to staging area
88+
run: |
89+
echo "=== Deploying to staging area ==="
90+
91+
# Switch to gh-pages branch
92+
git fetch origin gh-pages:gh-pages || git checkout --orphan gh-pages
93+
git checkout gh-pages
94+
95+
# Clear old staging content and copy new build
96+
rm -rf staging/
97+
mkdir -p staging/
98+
99+
# Copy built site to staging directory
100+
cp -r _site/* staging/
101+
102+
# Create a clear staging landing page
103+
cat > staging-info.html << 'EOF'
104+
<!DOCTYPE html>
105+
<html>
106+
<head>
107+
<title>Staging Area - devnomadic</title>
108+
<meta charset="utf-8">
109+
<meta name="viewport" content="width=device-width, initial-scale=1">
110+
<style>
111+
body {
112+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
113+
max-width: 800px; margin: 0 auto; padding: 20px;
114+
line-height: 1.6; color: #333;
115+
}
116+
.badge {
117+
background: #ff6b6b; color: white;
118+
padding: 4px 12px; border-radius: 20px;
119+
font-size: 0.85em; font-weight: 500;
120+
display: inline-block; margin-bottom: 20px;
121+
}
122+
.nav { margin: 20px 0; }
123+
.nav a {
124+
color: #0066cc; text-decoration: none;
125+
margin-right: 15px; font-weight: 500;
126+
}
127+
.nav a:hover { text-decoration: underline; }
128+
.section {
129+
background: #f8f9fa; padding: 20px;
130+
border-radius: 8px; margin: 20px 0;
131+
}
132+
</style>
133+
</head>
134+
<body>
135+
<div class="badge">🚧 STAGING</div>
136+
137+
<h1>Staging Area</h1>
138+
<p>This is the staging area for preview posts and content before they go live on the main site.</p>
139+
140+
<div class="nav">
141+
<a href="/staging/">→ View Staged Content</a>
142+
<a href="/">← Back to Main Site</a>
143+
</div>
144+
145+
<div class="section">
146+
<h3>What's Here</h3>
147+
<p>• Staged posts that are ready for preview</p>
148+
<p>• Draft content being reviewed</p>
149+
<p>• Updated layouts and styling</p>
150+
</div>
151+
152+
<div class="section">
153+
<p><strong>Latest build:</strong> $(date -u)</p>
154+
<p><strong>Branch:</strong> ${{ github.ref_name }}</p>
155+
<p><strong>Commit:</strong> ${{ github.sha }}</p>
156+
</div>
157+
</body>
158+
</html>
159+
EOF
160+
161+
# Add staging info to root of staging area
162+
mv staging-info.html staging/
163+
164+
# Commit and push
165+
git add staging/
166+
git config user.name "GitHub Actions"
167+
git config user.email "actions@github.com"
168+
git commit -m "Deploy staging preview from ${{ github.ref_name }} (${{ github.sha }})" || exit 0
169+
git push origin gh-pages
170+
171+
echo "=== Staging deployment complete ==="
172+
echo "Preview URL: https://devnomadic.github.io/staging/"

‎staging/index.md‎

Lines changed: 98 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,98 @@
1+
---
2+
layout: default
3+
title: Staging Area
4+
permalink: /staging/
5+
---
6+
7+
# 🚧 Staging Area
8+
9+
This is where posts are staged for preview before going live.
10+
11+
<div class="staging-info">
12+
<span class="badge staging-badge">STAGING</span>
13+
<span>Preview posts appear here before publication</span>
14+
</div>
15+
16+
## Staged Posts
17+
18+
<div class="post-links">
19+
{% assign staging_posts = site.staging | sort: 'date' | reverse %}
20+
{% if staging_posts.size > 0 %}
21+
{% for post in staging_posts %}
22+
<div class="post-link-wrapper">
23+
<a href="{{ post.url | relative_url }}" class="post-link">{{ post.title }}</a>
24+
<div class="post-meta">
25+
<span class="badge staging-badge">STAGING</span>
26+
{% if site.dash.date_format %}
27+
{{ post.date | date: site.dash.date_format }}
28+
{% else %}
29+
{{ post.date | date: "%b %-d, %Y" }}
30+
{% endif %}
31+
{% if post.tags and post.tags.size > 0 %}
32+
<div class="post-tags">
33+
{% for tag in post.tags %}
34+
<a class="tag" href="/tags#{{ tag | slugify }}">{{ tag }}</a>
35+
{% endfor %}
36+
</div>
37+
{% endif %}
38+
</div>
39+
</div>
40+
{% endfor %}
41+
{% else %}
42+
<p>No posts currently staged for preview.</p>
43+
{% endif %}
44+
</div>
45+
46+
## Navigation
47+
48+
- [← Back to main site](/)
49+
- [About](/about/)
50+
- [Archive](/archive/)
51+
52+
<style>
53+
.staging-badge {
54+
background: #ff6b6b;
55+
color: white;
56+
padding: 2px 6px;
57+
border-radius: 3px;
58+
font-size: 0.8em;
59+
margin-right: 8px;
60+
font-weight: bold;
61+
}
62+
63+
.staging-info {
64+
background: #fff3cd;
65+
border: 1px solid #ffeaa7;
66+
border-radius: 5px;
67+
padding: 10px;
68+
margin: 20px 0;
69+
}
70+
71+
.post-link-wrapper {
72+
margin-bottom: 15px;
73+
padding-bottom: 15px;
74+
border-bottom: 1px solid #eee;
75+
}
76+
77+
.post-link-wrapper:last-child {
78+
border-bottom: none;
79+
}
80+
81+
.post-tags {
82+
margin-top: 5px;
83+
}
84+
85+
.tag {
86+
font-size: 0.8em;
87+
background: #f8f9fa;
88+
padding: 2px 6px;
89+
border-radius: 3px;
90+
text-decoration: none;
91+
margin-right: 5px;
92+
color: #666;
93+
}
94+
95+
.tag:hover {
96+
background: #e9ecef;
97+
}
98+
</style>

0 commit comments

Comments
 (0)