This repository serves as a practical exploration of web development and GitHub workflow management, created through an interactive collaboration with Claude AI. The project demonstrates the process of building and managing a simple yet professional website while learning various web development concepts.
I must give credit to David Andrej and his youtube video "Build Anything with Claude Agents: Here's How"
Having been an avid AI user I see videos often on new capabilties but I think this one (MCP) by far takes the cake.
It is an almost start to finish AI implementation that allows claude to access all relevent information (OS + latest news/websites + data + Github) and manage these different aspects just through prompting.
This project was created to:
- Understand the GitHub workflow (creating repositories, branches, and managing code)
- Learn web development best practices
- Implement accessibility features
- Practice working with multiple HTML pages and CSS styling
- Responsive design implementation
- Separate CSS styling
- Accessibility features including:
- ARIA labels
- Semantic HTML
- Skip to main content links
- Screen reader support
- Multiple page navigation
- Projects showcase page
index.html: Main landing pageprojects.html: Detailed projects showcasestyles.css: Shared styling for all pages
- Understanding of GitHub Pages deployment
- Implementation of web accessibility standards
- File organization in web projects
- HTML/CSS best practices
- Version control basics
This project serves as a foundation for further web development learning and can be expanded with:
- Additional pages
- More interactive features
- Enhanced styling
- JavaScript functionality
The live site can be viewed at: https://mross2858.github.io/claude_project_1/
This project was created as a learning exercise in collaboration with Claude AI, demonstrating the potential of AI-assisted learning in web development.