[WIP] Refactor projects section to be dynamic and data-driven

[Copilot]

Thanks for asking me to work on this. I will get started on it and keep this PR's description up to date as I form a plan and make progress.

Original prompt

Objective

Refactor the projects section of the GitHub Pages portfolio to be dynamic and data-driven.

Proposed Changes

1. GitHub Actions Workflow

   • File: .github/workflows/update-projects.yml
   • Details:
     • Trigger the workflow on a push to main and weekly cron schedule.
     • Use the GitHub GraphQL API (via GITHUB_TOKEN) to fetch pinned repositories for the user chrislyonsKY.
     • Extract the following fields for each pinned repo:
       • name
       • description
       • url
       • homepageUrl
       • repositoryTopics
       • pushedAt
       • openGraphImageUrl
     • Write this data into a projects.json file in the root of the repository.
     • Commit and push projects.json back to the main branch.

2. Dynamic Rendering in HTML

   • File: index.html
   • Details:
     • Replace the hardcoded project cards with a JavaScript fetch of projects.json.
     • Dynamically create project cards matching the existing design: same card layout, tag pills, hover effects.
     • Use vanilla JavaScript and preserve the portfolio’s existing visual aesthetics.
     • Add a graceful fallback if fetching the projects.json data fails (e.g., display a message or load placeholder cards).

3. Preserving the existing design

   • Ensure the dynamically rendered cards replicate the layout, styles, and interactivity (hover effects, etc.) as the current hardcoded cards.
   • Validate cross-browser compatibility.

4. Testing and Validation

   • Test the GitHub Actions workflow in both trigger cases (push and schedule).
   • Verify that the projects.json file contains the correct data format.
   • Test dynamic rendering and graceful fallback in index.html in scenarios where:
     • projects.json is available.
     • Fetching projects.json fails.

---

This implementation will automate the projects section, keep it updated with live GitHub activity, and retain the current style/UX using data-driven methods.

This pull request was created from Copilot chat.

---

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.