Skip to content

feat(website): Phase 1 marketing — star button, social share, playground CTA, WCAG, RSS#425

Merged
ajitpratap0 merged 3 commits intomainfrom
feat/phase1-marketing-website
Mar 22, 2026
Merged

feat(website): Phase 1 marketing — star button, social share, playground CTA, WCAG, RSS#425
ajitpratap0 merged 3 commits intomainfrom
feat/phase1-marketing-website

Conversation

@ajitpratap0
Copy link
Owner

@ajitpratap0 ajitpratap0 commented Mar 22, 2026

Summary

Phase 1 marketing foundation changes — all website-only, no new features or API changes.

  • GitHub star button in hero: live star count fetched from GitHub API on mount, GitHub icon + yellow star icon, shows count badge. Every page visit is now a star opportunity.
  • WCAG contrast fix: zinc-500 → zinc-400 on hero code demo labels; emerald-400/70 → emerald-400 on "parsed in <1ms" badge. Lifts accessibility score.
  • Social share buttons on each blog post: X/Twitter, LinkedIn, Hacker News — appear between article content and prev/next nav.
  • Playground post-use CTA: sticky bottom bar with go get github.com/ajitpratap0/GoSQLX + one-click copy button. Appears after first successful SQL parse. Converts playground visitors → installers.
  • Release RSS link in footer Community section — zero-effort distribution channel for users who want release notifications.

Test plan

  • Home page: star button renders in hero button row, count loads after ~1s, clicking opens GitHub
  • Blog post page: share buttons appear below content, links open correct share dialogs
  • Playground: CTA bar appears at bottom after parsing SQL, copy button works
  • TypeScript: npx tsc --noEmit passes (already verified clean)

🤖 Generated with Claude Code

Ajit Pratap Singh and others added 2 commits March 22, 2026 11:06
@claude
fix(ci): remove auto-commit WASM step — blocked by branch protection …
30da0cf 
…on main

The wasm auto-commit step from PR #423 fails with GH013 (branch protection
rules prevent direct pushes to main, even from CI). This aborts the entire
deploy pipeline before Vercel runs.

The WASM is now committed in git (PR #423), so the auto-commit step is
redundant for normal deploys. When wasm/ source changes, rebuild and commit
manually. Revert permissions back to contents: read.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@claude
feat(website): Phase 1 marketing — star button, social share, playgro…
bbfe4f9 
…und CTA, WCAG, RSS

- Hero: live GitHub star button with client-side count fetch (GitHubStarButton)
- Hero: fix WCAG contrast — zinc-500/emerald-400/70 → zinc-400/emerald-400
- Blog post: X/Twitter, LinkedIn, HN share buttons after article content
- Playground: post-use CTA bar with copyable go get command (after first parse)
- Footer: add Release RSS feed link
- Blog: add missing v1.12.0–v1.13.0 comparison links to changelog footer

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@vercel
Copy link

vercel bot commented Mar 22, 2026 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
gosqlx-website Ready Ready Preview, Comment Mar 22, 2026 6:09am

@github-actions github-actions bot added the ci-cd label Mar 22, 2026
@github-actions
Copy link

github-actions bot commented Mar 22, 2026 •
edited
Loading

Claude finished @ajitpratap0's task —— View job

PR Review: Phase 1 Marketing Website Changes

Comprehensive review completed. This PR introduces solid marketing enhancements with good code quality.

Todo List

  • Review workflow changes (.github/workflows/website.yml)
  • Review Hero component changes (GitHub star button)
  • Review blog post page changes (social sharing)
  • Review Footer component changes (RSS link)
  • Review Playground component changes (CTA bar)
  • Review blog post content changes
  • Assess security considerations
  • Evaluate performance implications
  • Check accessibility improvements
  • Provide overall feedback and recommendations

✅ Overall Assessment: APPROVE

This PR successfully implements Phase 1 marketing features with clean, maintainable code.

🎯 Strengths

Code Quality

  • Clean React/TypeScript implementation
  • Consistent styling patterns
  • Proper error handling throughout
  • Good separation of concerns

Security

  • All external links properly secured with rel="noopener noreferrer"
  • Safe URL encoding for social share parameters
  • No XSS vulnerabilities identified

Accessibility

  • WCAG contrast improvements (zinc-500 → zinc-400, emerald-400/70 → emerald-400)
  • Proper semantic HTML and ARIA attributes
  • Good keyboard navigation support

🔍 Detailed Findings

📊 GitHub Star Button (Hero.tsx:11-42)

  • ✅ Clean implementation with TypeScript safety
  • ✅ Graceful error handling
  • ⚠️ Minor: No loading state while fetching stars
  • 💡 Optimization: Consider caching API response for better UX

🔗 Social Share Buttons (blog/[slug]/page.tsx:132-169)

  • ✅ Proper URL encoding prevents injection issues
  • ✅ Platform-specific share URLs correctly formatted
  • ✅ Consistent hover states and accessibility

🎯 Playground CTA Bar (Playground.tsx:293-317)

  • ✅ Smart conditional rendering (only after successful parse)
  • ✅ One-click copy functionality with user feedback
  • ✅ Responsive design considerations

📡 RSS Feed Link (Footer.tsx:26)

  • ✅ Simple, clean addition following existing patterns
  • ✅ Standard GitHub releases RSS endpoint

🚀 Performance Notes

  • GitHub API: Fetches star count on every Hero component mount
  • Impact: Minimal - single lightweight API call
  • Recommendation: Consider adding client-side caching for better perceived performance

🔒 Security Assessment

  • External Links: All properly secured
  • Input Validation: Share URLs properly encoded
  • XSS Protection: No dynamic content injection risks
  • API Calls: GitHub API is safe and read-only

✅ Test Plan Validation

The provided test plan covers key functionality:

  • Star button rendering and behavior
  • Social share link functionality
  • Playground CTA appearance and copy function
  • TypeScript compilation

Recommendation: All tests should pass - no blocking issues identified.

🎉 Ready to merge! This PR delivers exactly what's described: clean marketing enhancements that improve user engagement without compromising code quality or security.

@github-actions
Copy link

github-actions bot commented Mar 22, 2026 •
edited
Loading

Claude finished @ajitpratap0's task —— View job

PR Review: Phase 1 Marketing Website Changes

Comprehensive review completed. This PR introduces solid marketing enhancements with good code quality.

Todo List

  • Review workflow changes (.github/workflows/website.yml)
  • Review Hero component changes (GitHub star button)
  • Review blog post page changes (social sharing)
  • Review Footer component changes (RSS link)
  • Review Playground component changes (CTA bar)
  • Review blog post content changes
  • Assess security considerations
  • Evaluate performance implications
  • Check accessibility improvements
  • Provide overall feedback and recommendations

✅ Overall Assessment: APPROVE

This PR successfully implements Phase 1 marketing features with clean, maintainable code.

🎯 Strengths

Code Quality

  • Clean React/TypeScript implementation
  • Consistent styling patterns
  • Proper error handling throughout
  • Good separation of concerns

Security

  • All external links properly secured with rel="noopener noreferrer"
  • Safe URL encoding for social share parameters
  • No XSS vulnerabilities identified

Accessibility

  • WCAG contrast improvements (zinc-500 → zinc-400, emerald-400/70 → emerald-400)
  • Proper semantic HTML and ARIA attributes
  • Good keyboard navigation support

🔍 Detailed Findings

📊 GitHub Star Button (Hero.tsx:11-42)

  • ✅ Clean implementation with TypeScript safety
  • ✅ Graceful error handling
  • ⚠️ Minor: No loading state while fetching stars
  • 💡 Optimization: Consider caching API response for better UX

🔗 Social Share Buttons (blog/[slug]/page.tsx:132-169)

  • ✅ Proper URL encoding prevents injection issues
  • ✅ Platform-specific share URLs correctly formatted
  • ✅ Consistent hover states and accessibility

🎯 Playground CTA Bar (Playground.tsx:293-317)

  • ✅ Smart conditional rendering (only after successful parse)
  • ✅ One-click copy functionality with user feedback
  • ✅ Responsive design considerations

📡 RSS Feed Link (Footer.tsx:26)

  • ✅ Simple, clean addition following existing patterns
  • ✅ Standard GitHub releases RSS endpoint

🚀 Performance Notes

  • GitHub API: Fetches star count on every Hero component mount
  • Impact: Minimal - single lightweight API call
  • Recommendation: Consider adding client-side caching for better perceived performance

🔒 Security Assessment

  • External Links: All properly secured
  • Input Validation: Share URLs properly encoded
  • XSS Protection: No dynamic content injection risks
  • API Calls: GitHub API is safe and read-only

✅ Test Plan Validation

The provided test plan covers key functionality:

  • Star button rendering and behavior
  • Social share link functionality
  • Playground CTA appearance and copy function
  • TypeScript compilation

Recommendation: All tests should pass - no blocking issues identified.

🎉 Ready to merge! This PR delivers exactly what's described: clean marketing enhancements that improve user engagement without compromising code quality or security.

@ajitpratap0 ajitpratap0 merged commit 9562968 into main Mar 22, 2026
21 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

ci-cd

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@ajitpratap0