.d8888. .o88b. .d88b. d8888b. d88888b
88' YP d8P Y8 .8P Y8. 88 `8D 88'
`8bo. 8P 88 88 88 88 88ooooo
`Y8b. 8b 88 88 88 88 88~~~~~
db 8D Y8b d8 `8b d8' 88 .8D 88.
`8888Y' `Y88P' `Y88P' 88888D' Y88888P
✨ A sleek, responsive, and modern game hub built with React, TypeScript, and Tailwind CSS. ✨
GCADE is a polished, modern hub for classic web games, rebuilt from the ground up using Next.js, React, TypeScript, and Tailwind CSS. This project showcases a clean user interface, fluid animations, and a collection of addictive games, all wrapped in a scalable architecture that's easy to expand.
- Dynamic & Animated UI: A visually appealing interface with a subtle animated gradient background and smooth screen transitions.
- Multiple Games: Features fully-functional, lovingly crafted versions of classic games like 2048 and Dino Run.
- Responsive Design: A mobile-first approach ensures a seamless experience on all devices, from phones to desktops.
- Rich Gameplay: Games include custom graphics, fluid animations, state management (like undo and high scores), and achievements.
- Extensible Architecture: Designed to be easily expandable with new games.
| Game | Status | Description |
|---|---|---|
| Typing Master | ✅ Available | Adaptive typing practice that focuses on your weak keys and combinations. |
| 2048 | ✅ Available | Join the numbers to get the 2048 tile! |
| Pixel Dino Run | ✅ Available | Jump over obstacles and run as far as you can! |
| Tic Tac Toe | ✅ Available | Classic Xs and Os. Can you get three in a row? |
| Block Fall | ✅ Available | Classic falling block puzzle. Clear lines to score! |
| Stack Tower | ✅ Available | Tap to place blocks and build the tallest tower! |
| Minesweeper | ✅ Available | Clear the board without hitting any mines. A true classic! |
| Snake | ✅ Available | Eat the food, grow your snake, and avoid the walls! |
| Connect Four | ✅ Available | Drop your discs and be the first to get four in a row! |
| Flappy Bird | ✅ Available | Tap to flap your way through the pipes. How far can you get? |
| Sudoku | ✅ Available | A classic logic puzzle. Fill the grid with numbers 1-9. |
| Memory Match | 🚧 Coming Soon | Flip cards and find all the matching pairs. Test your recall! |
| Stickman Hook | 🚧 Coming Soon | Swing through levels with your grappling hook! |
| Bouncing Ball | 🚧 Coming Soon | Navigate your ball through tricky obstacles. |
-
Clone the repository:
git clone https://github.com/your-repo/gcade.git cd gcade -
Install dependencies:
npm install
-
Run the development server:
npm run dev
This will start the Next.js development server. Open http://localhost:3000 in your browser!
/
├── components/ # Reusable React components (Header, Modals, etc.)
├── lib/ # Shared utilities, types, and constants
├── pages/ # Next.js pages for routing (_app, _document, game pages)
├── screens/ # Top-level screen components used by pages
├── styles/ # Global stylesheets
├── next.config.js # Next.js configuration
└── tsconfig.json # TypeScript configuration
We welcome contributions to make GCADE even better! Please read our contributing guidelines to get started.
- Issues: Open issues using the appropriate template (Bug report or Feature request) so we can triage quickly.
- Pull requests: Please follow the PR template when opening a pull request.
Huge thanks to the contributors.
This project is licensed under the MIT License. See the LICENSE.md file for details.