Git-Mastery
GitMastery: Master Git Through Play
An interactive Git learning platform that makes mastering Git fun
Try It Live · Features · Getting Started · Contributing
If you find this project helpful, please consider giving it a star 🌟
🚀 About The Project
GitMastery is an interactive learning platform designed to help developers master Git through hands-on practice. While traditional tutorials often rely on passive learning, GitMastery provides a fully simulated Git environment where you can:
- Execute real Git commands in a safe sandbox
- See immediate visual feedback
- Progress through structured, bite-sized challenges
- Learn Git intuitively through gamification
Whether you’re a complete beginner or looking to level up your Git skills, GitMastery offers an engaging, interactive approach to learning this essential developer tool.
🌐 Visit GitMastery at gitmastery.me to start your journey!
No registration needed!
✨ Features
🎓 Core Learning Experience
- 🖥️ Interactive Terminal: Practice Git commands in a realistic simulated environment
- 🎯 Structured Learning Path: Progress through carefully designed levels of increasing complexity
- 📊 Visual Git Status: See your repository status visually update as you work
- 🎮 Playground Mode: Freely experiment with Git commands without level requirements
- 📝 Command Cheat Sheet: Quick reference for Git commands with explanations
- 📈 Progress Tracking: Track your learning journey with a visual progress system
- 🌍 Multi-language Support: Available in both English and German
🎮 Gamification & Rewards
- 🏪 In-Game Shop: Earn points and purchase customization items and power-ups
- 🎨 Terminal Themes: Unlock beautiful terminal themes including Matrix, Golden, and Dark themes
- 🐱 Git Mascot Pet: Purchase an animated mascot that cheers you on during challenging levels
- 🔊 Victory Sound Pack: Satisfying sound effects when completing levels and achieving milestones
- ⚡ Double XP Weekends: Boost your point earning with 2x multiplier for 7 days
- 😊 Emoji Commit Messages: Smart emoji suggestions for better commit messages
- 🏆 Achievement Badges: Visual recognition system with special badges and legendary status
- 🎲 Mini Games: Practice Git skills through fun interactive challenges
🛠️ Tech Stack
GitMastery is built with modern web technologies to provide the best learning experience:
Frontend Framework
- Next.js 15 - React framework with server-side rendering, App Router, and performance optimizations
- TypeScript - Type-safe development with enhanced IDE support and error catching
- Tailwind CSS - Utility-first CSS framework for rapid, responsive design
UI & UX
- Lucide React - Customizable SVG icon library
- shadcn/ui - Re-usable component system built on Radix UI and Tailwind CSS
Game Engine & State Management
- Custom Git Simulation - Full Git repository simulation in the browser
- React Context API - Global state management for game progress, themes, and user data
- LocalStorage - Client-side persistence for progress, purchases, and preferences
🚦 Getting Started
Prerequisites
- Node.js (v18 or higher)
- npm (v8 or higher)
Installation
- Clone the repository
git clone https://github.com/MikaStiebitz/Git-Mastery
cd Git-Mastery
- Install dependencies
npm install
- Start the development server
npm run dev
- Open your browser
Navigate to http://localhost:3000 to start learning Git!
📚 Documentation
For developers and contributors, detailed documentation is available to help you understand the codebase:
- Commands Implementation - How Git commands are implemented and how to add new ones
- Levels System - How levels and stages work and how to create new levels
- Translation System - How to add or modify translations
🤝 Contributing
We welcome contributions to GitMastery! Whether you’re fixing bugs, improving the documentation, or adding new features, please follow these steps:
- Fork the repository
- Create a new branch for your feature (
git checkout -b feature/amazing-feature) - Make your changes
- Commit your changes (
git commit -m 'Add some amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
For more details on the project structure, check the documentation linked above.
⭐ Support This Project
If you find GitMastery helpful in your Git learning journey, please consider:
- Giving it a star on GitHub: Visit github.com/MikaStiebitz/Git-Mastery and click the star button
- Sharing it with friends and colleagues who are learning Git
- Contributing to make it even better
Your support helps this educational tool reach more developers!
📜 License
This project is licensed under the Restricted Use License - see the LICENSE file for details.
Made with ❤️ by Mika Stiebitz