Add comprehensive workflow commands for AI-assisted development: - Claude commands: analyze, clarify, plan - Kilocode workflows: full feature development lifecycle - Opencode commands: specification and implementation workflows - Roo MCP configuration for tool integration Update .gitignore to exclude .astro build cache directories. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
4.3 KiB
4.3 KiB
Astro Routing Mapping
This document specifies the mapping from downloaded HTML files in research/www.enchun.tw/ to Astro routing files in frontend/src/pages/. The purpose is to recreate the Astro pages by converting the HTML content into Astro components.
Static Routes
| Route | Astro File | Source HTML |
|---|---|---|
/ |
src/pages/index.astro |
research/www.enchun.tw/index.html |
/about-enchun |
src/pages/about-enchun.astro |
research/www.enchun.tw/about-enchun.html |
/contact-us |
src/pages/contact-us.astro |
research/www.enchun.tw/contact-us.html |
/marketing-solutions |
src/pages/marketing-solutions.astro |
research/www.enchun.tw/marketing-solutions.html |
/news |
src/pages/news.astro |
research/www.enchun.tw/news.html |
/website-portfolio |
src/pages/website-portfolio.astro |
research/www.enchun.tw/website-portfolio.html |
/teams |
src/pages/teams.astro |
research/www.enchun.tw/teams.html |
Dynamic Routes
Blog Posts (/xing-xiao-fang-da-jing/[slug])
- Astro File:
src/pages/xing-xiao-fang-da-jing/[slug].astro - Source Folder:
research/www.enchun.tw/xing-xiao-fang-da-jing/ - Description: Dynamic individual blog post pages. Posts are managed in Payload CMS and can be added/removed.
- Implementation: Use Astro's
getStaticPathsto fetch post slugs dynamically from Payload CMS API. - Files: Existing
.htmlfiles for initial migration; future paths generated from CMS.
Blog Categories (/wen-zhang-fen-lei/[slug])
- Astro File:
src/pages/wen-zhang-fen-lei/[slug].astro - Source Folder:
research/www.enchun.tw/wen-zhang-fen-lei/ - Description: Dynamic category listing pages for blog posts. Categories are managed in Payload CMS and can be added/removed dynamically.
- Current categories in Payload CMS (subject to change):
- 恩群數位最新公告 (slug: en-qun-shu-wei-zui-xin-gong-gao)
- 行銷時事最前線 (slug: xing-xiao-shi-shi-zui-qian-xian)
- Meta小學堂 (slug: meta-xiao-xue-tang)
- Google小學堂 (slug: google-xiao-xue-tang)
- Implementation: Use Astro's
getStaticPathsto fetch category slugs dynamically from Payload CMS API. - Files: Existing
.htmlfiles for initial migration; future paths generated from CMS.
Portfolio Projects (/webdesign-profolio/[slug])
- Astro File:
src/pages/webdesign-profolio/[slug].astro - Source Folder: Not directly available; portfolio items are managed in Payload CMS.
- Description: Dynamic individual portfolio project pages. Projects are managed in Payload CMS and can be added/removed.
- Implementation: Use Astro's
getStaticPathsto fetch project slugs dynamically from Payload CMS API. - Example mappings:
web-design-project-2→/webdesign-profolio/web-design-project-2(based on current sitemap)
Conversion Process
- For static routes: Convert HTML files directly to Astro pages by extracting content, converting styles to Tailwind, and breaking into components.
- For dynamic routes: Create Astro files with
getStaticPathsto fetch slugs from Payload CMS API. For initial migration, use existing HTML files as placeholders; replace with CMS data integration. - Ensure SEO meta tags are preserved or dynamically set from CMS fields.
- Categories and content are editable in Payload CMS, so routes will be generated dynamically post-migration.
Blog Post Structure (from DevTools Inspection)
Based on inspecting a sample post (e.g., /xing-xiao-fang-da-jing/2-zhao-yao-kong-xiao-fei-zhe-de-xin):
- Header/Navigation: Top nav with links to main sections; includes "回到文章列表" (back to list) link.
- Title:
<h1>and<h2>with post title. - Publish Date: "文章發布日期:" + date (e.g., "January 20, 2022").
- Content: Text paragraphs separated by
<br>tags; no images or rich media in sample. - Footer: Company info, contact details, links to services and categories.
Map to Payload CMS: title, publish_date, content (rich text), category.
Notes
- All HTML files are in Chinese; ensure proper encoding and localization if needed.
- Images and assets referenced in HTML may need to be downloaded and placed in
frontend/public/. - Scripts and external dependencies should be migrated to Astro's script handling.
- For dynamic routes, implement
getStaticPathsto pull slugs from CMS; use existing HTML for initial static generation.