Skip to content

Vue 3 + ViteSSG migration: 86 pages, EXPRESS design system#29

Merged
ronaldtse merged 3 commits into
mainfrom
vue-migration
May 3, 2026
Merged

Vue 3 + ViteSSG migration: 86 pages, EXPRESS design system#29
ronaldtse merged 3 commits into
mainfrom
vue-migration

Conversation

@ronaldtse
Copy link
Copy Markdown
Contributor

Summary

Complete migration of ap210.org from Jekyll to Vue 3 + ViteSSG + Tailwind CSS 4, matching the EXPRESS site design system.

What changed

  • Framework: Jekyll → Vue 3 + ViteSSG (static site generation)
  • Design: Full EXPRESS design system — gradient heroes, BaseCard hover-lift animations, AnimatedSection scroll reveals, Montserrat headings, SVG logos
  • Content pipeline: AsciiDoc → JSON via scripts/build-content.ts, loaded at build time via import.meta.glob
  • 86 HTML pages generated across all sections (about, standards, application, research, 5 learn modules, resources, blog, legal)
  • 88 sitemap URLs with proper meta descriptions
  • 78 content files in AsciiDoc format
  • 0 build warnings, 0 errors

Architecture

  • SectionPage.vue / SimplePage.vue — meta-driven page layouts (no per-page components for content pages)
  • navigation.ts — single source of truth for breadcrumbs, sidebar, and top nav
  • Data-driven breadcrumbs resolving titles from navigationMap
  • Per-section sidebar navigation with active state tracking
  • Lesson prev/next navigation for all 5 learn modules

Content sections

  • About (4 pages), Standards (5 pages), Application (5 pages), Research (8 pages)
  • 5 Learn modules (41 total lessons with sidebar + prev/next)
  • Resources (8 pages including test case gallery, Javadoc, ARM/MIM reference)
  • Blog (1 post), Privacy, Terms of Service, 404

Assets preserved

  • Static assets in public/: Javadoc, ARM/MIM reference, test cases, training materials, discussions, implementation source, learn examples
  • SVG logos (light/dark variants)
  • Google Fonts (Fira Sans, Montserrat, JetBrains Mono)

ronaldtse added 3 commits May 3, 2026 22:20
- Replace Jekyll with Vue 3 + ViteSSG + Tailwind CSS 4
- 83 pages across all site sections
- 5 progressive learning modules (41 lessons)
- 7 research project pages migrated from markdown
- Application documentation with sidebar navigation
- Blog with AsciiDoc content pipeline
- Custom AP210 branding (header, footer, favicon)
- AsciiDoc -> JSON content pipeline via build-content.ts
- Full route configuration in router.ts
- Navigation data in navigation.ts
- Sitemap generation
- CLAUDE.md updated for new framework
Complete migration from Jekyll to Vue 3 + ViteSSG + Tailwind CSS 4:
- 78 content files across 10 sections (AsciiDoc → JSON pipeline)
- 86 static HTML pages generated via SSG
- SectionPage/SimplePage meta-driven architecture (DRY, open/closed)
- Data-driven breadcrumbs from navigationMap (single source of truth)
- TheSidebar with path-based + slug-based dual mode
- EXPRESS site design language: gradient heroes, BaseCard hover-lift,
  AnimatedSection scroll reveals, font-serif headings, code cards
- Dark mode (92 CSS rules), mobile sidebar, skip-to-content
- SEO: OG/Twitter cards, canonical URLs, meta descriptions, sitemap, robots.txt
- Google Fonts (Montserrat, Fira Sans, JetBrains Mono)
- GitHub Actions CI/CD for Node.js + ViteSSG build pipeline
@ronaldtse ronaldtse merged commit 13eb3be into main May 3, 2026
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant