{"id":24708028,"url":"https://github.com/pungrumpy/block-blitz","last_synced_at":"2025-10-09T09:31:47.646Z","repository":{"id":263270920,"uuid":"889860713","full_name":"PunGrumpy/block-blitz","owner":"PunGrumpy","description":"🗼 Falling block puzzle game inspired by classic titles like Tetris","archived":false,"fork":false,"pushed_at":"2024-12-08T19:21:11.000Z","size":895,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-10-01T13:39:29.760Z","etag":null,"topics":["game","nextjs","tailwindcss","tetris","typescript"],"latest_commit_sha":null,"homepage":"https://blockblitz.pungrumpy.com","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/PunGrumpy.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-11-17T12:37:58.000Z","updated_at":"2024-12-08T19:21:15.000Z","dependencies_parsed_at":null,"dependency_job_id":"236307fd-a316-4d4b-9beb-91f8d12be451","html_url":"https://github.com/PunGrumpy/block-blitz","commit_stats":null,"previous_names":["pungrumpy/block-blitz"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/PunGrumpy/block-blitz","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PunGrumpy%2Fblock-blitz","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PunGrumpy%2Fblock-blitz/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PunGrumpy%2Fblock-blitz/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PunGrumpy%2Fblock-blitz/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/PunGrumpy","download_url":"https://codeload.github.com/PunGrumpy/block-blitz/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PunGrumpy%2Fblock-blitz/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279001135,"owners_count":26083022,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-09T02:00:07.460Z","response_time":59,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["game","nextjs","tailwindcss","tetris","typescript"],"created_at":"2025-01-27T06:27:35.099Z","updated_at":"2025-10-09T09:31:47.631Z","avatar_url":"https://github.com/PunGrumpy.png","language":"TypeScript","readme":"# 🎮 Block Blitz\n\nA modern take on classic block-falling puzzle games, built with Next.js and TypeScript.\n\n\u003e [!WARNING]\n\u003e This project was developed as part of the Computer Games Programming course exit examination.\n\n![Block Blitz Game Preview](/public/preview.png)\n\n## Game Mechanics 🎯\n\n### Board \u0026 Blocks\n\n- Game board: 10x20 grid\n- Features 5 unique block types:\n  - Line Block (I) - Long piece for clearing multiple rows\n  - Square Block (O) - 2x2 block that doesn't rotate\n  - T Block (T) - T-shaped piece for versatile placements\n  - L Block (L) - L-shaped piece\n  - Reverse L Block (J) - Mirrored L-shaped piece\n\n### Core Rules\n\n- Blocks can be cleared by:\n  - Completing full rows (line clear like Tetris)\n- Blocks automatically fall to fill empty spaces\n- Win condition: Score 3,000 points within 180 seconds (Time-Based Mode) but can play until time's up\n\n## Features ✨\n\n- 🎯 Classic block-falling gameplay with modern mechanics\n- 🎨 Color-coded blocks with distinctive visuals\n- ⚡️ Special power-ups and combo system\n- 🏆 Global leaderboard with score verification\n- 🎵 Dynamic sound effects and visual feedback\n- 📱 Responsive design with touch controls\n- 🌙 Dark/Light mode support\n\n\u003e [!NOTE]\n\u003e Switch to light mode is coming soon!\n\n\u003e [!TIP]\n\u003e Admin can use secret password to access admin dashboard to delete data in leaderboard.\n\n## 🚀 Getting Started\n\n### Prerequisites\n\n- 📦 Node.js 20+\n- 🔧 npm/yarn/pnpm\n- 🌐 Modern web browser\n- 🖥️ Minimum screen resolution: 800x600\n\n### Installation\n\n```bash\n# Clone the repository\ngit clone https://github.com/PunGrumpy/block-blitz.git\n\n# Navigate to project directory\ncd block-blitz\n\n# Install dependencies\npnpm install\n\n# Start development server\npnpm dev\n```\n\n\u003e [!NOTE]\n\u003e Let's find environment variables with youself.\n\n## 🎮 Game Controls\n\n### Desktop (Keyboard)\n\n- `⬅️` Arrow Left / `A`: Move left\n- `➡️` Arrow Right / `D`: Move right\n- `⬆️` Arrow Up / `W`: Rotate piece clockwise\n- `⬇️` Arrow Down / `S`: Soft drop\n- `Space`: Hard drop\n- `P`: Pause game\n- `ESC`: Return to menu\n\n### Mobile/Tablet (Touch)\n\n- 👆 Tap left/right buttons to move\n- 🔄 Tap rotate button to turn piece\n- ⬇️ Swipe down for soft drop\n- 👇 Double tap for hard drop\n\n## 🛠️ Technology Stack\n\n### Core Technologies\n\n- ⚛️ Next.js 15 (App Router)\n- 📘 TypeScript\n- 🎨 Tailwind CSS\n- 🎭 Framer Motion\n- 🔊 Web Audio API\n- 💾 Upstash Redis (Leaderboard)\n\n### UI Components\n\n- 🔧 Radix UI primitives\n- 📱 Responsive design system\n\n## Project Structure\n\n```\n.\n├── actions/      # Server-side actions (Leaderboard)\n├── app/          # Next.js app router files\n├── components/   # React components\n├── hooks/        # Custom React hooks\n├── lib/          # Utility functions\n├── types/        # TypeScript types\n└── constants/    # Game constants\n```\n\n## 🏗️ Development\n\n### Building for Production\n\n```bash\n# Create production build\npnpm build\n\n# Start production server\npnpm start\n```\n\n### Performance Optimizations\n\n- RequestAnimationFrame for smooth game loop\n- Canvas optimization for block rendering\n- Efficient collision detection\n- Web Workers for physics calculations\n- Code splitting and dynamic imports\n\n## 📝 References \u0026 Attributions\n\n### Code References\n\n- Game loop implementation inspired by the [Canvas API Best Practices Guide](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_animations)\n- Collision detection algorithm adapted from [MDN Web Docs examples](https://developer.mozilla.org/en-US/docs/Games/Techniques/2D_collision_detection)\n- Sound system utilizing [Web Audio API documentation examples](https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API)\n\n### External Libraries\n\n- [NextJS 15](https://nextjs.org/)\n- [Tailwind CSS](https://tailwindcss.com/)\n- [Framer Motion](https://motion.dev/)\n- [Radix UI](https://radix-ui.com/)\n- [Upstash Redis](https://upstash.com/)\n\n### Assets\n\n- Font: Geist from [Google Fonts](https://fonts.google.com/specimen/Geist)\n- Sound effects: Custom generated using [Web Audio API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API)\n- Color scheme: Custom designed for accessibility\n- Logo \u0026 branding: Custom designed in [Figma](https://www.figma.com) with font in Kode Mono from [Google Fonts](https://fonts.google.com/specimen/Kode+Mono)\n\n## 👥 Development Team\n\n- Developer: **Noppakorn Kaewsalabnil**\n- Course: **Exit Exam on Computer Games Programming**\n- Institution: **King Mongkut's Institute of Technology Ladkrabang**\n- Academic Year: **1/2567** (2024)\n\n## 📄 License\n\nThis project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpungrumpy%2Fblock-blitz","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpungrumpy%2Fblock-blitz","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpungrumpy%2Fblock-blitz/lists"}