ChessPath is a modern, interactive web application designed to guide users through the journey of learning and mastering chess. It provides a structured roadmap, curated resources, and skill-based progression to help players of all levels improve their chess abilities.
- Tech Stack: Built with React and TypeScript for robust, type-safe development. Uses Vite for lightning-fast builds and hot module reloading, and Tailwind CSS for utility-first, responsive styling. UI components are crafted with shadcn/ui and Radix UI for accessibility and consistency. Deployed seamlessly on Vercel for global performance and reliability.
- Interactive Roadmap: Visualize your chess learning journey with a clear, step-by-step roadmap powered by dynamic React components.
- Skill Level Cards: Explore content tailored to different skill levels, from beginner to advanced, with visually distinct cards and smooth transitions.
- Curated Resources: Access high-quality chess resources, tutorials, and guides, organized for easy discovery and continuous learning.
- Quick Start Section: Get started with chess fundamentals quickly and easily, leveraging intuitive UI and guided content.
- Responsive Design: Enjoy a seamless experience across devices, with adaptive layouts and mobile-friendly interactions enabled by Tailwind CSS and Radix UI primitives.
- Performance & Accessibility: Optimized for speed, accessibility, and best practices, ensuring a smooth and inclusive user experience.
- Vercel Deployment: Hosted and deployed on Vercel, providing fast, secure, and reliable access worldwide with zero-config continuous deployment.
Check out the live app here: https://chess-path-eta.vercel.app/
- Clone the repository:
git clone https://github.com/zeeshankhan-05/ChessPath.git cd ChessPath - Install dependencies:
npm install # or bun install - Start the development server:
npm run dev # or bun run dev - Open your browser: Visit http://localhost:8080 to view the app.
ChessPath/
├── public/ # Static assets
├── src/
│ ├── assets/ # Images and media
│ ├── components/ # Reusable UI components
│ │ └── ui/ # UI primitives (buttons, cards, etc.)
│ ├── data/ # Chess-related data and content
│ ├── hooks/ # Custom React hooks
│ ├── lib/ # Utility functions
│ ├── pages/ # Application pages (Home, Roadmap, Resources, etc.)
│ └── App.tsx # Main app component
├── index.html # HTML entry point
├── tailwind.config.ts # Tailwind CSS configuration
├── vite.config.ts # Vite configuration
└── README.md # Project documentation
Contributions are welcome! To contribute:
- Fork the repository
- Create a new branch (
git checkout -b feature/your-feature) - Commit your changes (
git commit -m 'Add new feature') - Push to the branch (
git push origin feature/your-feature) - Open a pull request
Please follow the established coding standards and include clear documentation for any new features or changes.
I'm always looking for quality resources to add to ChessPath. Feel free to create pull requests or contact me with your suggestions!
This project is licensed under the MIT License. See the LICENSE file for details.
ChessPath – Your journey to chess mastery starts here!