ETH Prague Hackathon Project
LockBlock is an innovative platformer game with unique blockchain mechanics, where players can purchase map blocks, create custom levels, and save them on the blockchain to build an infinite gaming world.
- Infinite World: Game map consists of purchasable and buildable blocks
- Level Creation: Players can build custom maps in their owned blocks
- Gameplay Validation: Maps must be successfully completed to be saved
- Blockchain Integration: All maps are stored on blockchain and added to the global world
- Global Statistics: Death count and player achievement tracking system
- Block Purchasing: Players buy map sections with cryptocurrency
- Level Editor: Built-in tool for creating platformer levels
- Testing: Mandatory completion of created levels for validation
- Publishing: Successfully completed levels are added to the global map
- Playing: Players traverse the infinite map created by the community
# Install dependencies
pnpm install
# Start development server
pnpm dev
# Build for production
pnpm build
# Lint code
pnpm lint
- React 19 - Modern UI framework
- TypeScript - Typed JavaScript
- Phaser 3 - 2D game engine
- Vite - Fast bundler and dev server
- SCSS Modules - Modular styling
- Ethers.js - Ethereum interaction
- MetaMask - Wallet connection
- Viem - Modern Ethereum library
- Nitrolite - Optimized blockchain operations
- React Router v7 - Routing
- i18next - Internationalization
- Radix UI - UI components
- Biome - Code linter and formatter
- Mario-style platformer with physics
- Touch controls support for mobile devices
- Performance optimization for different devices
- Animation and sprite system
- Intuitive interface for map creation
- Library of game objects (platforms, enemies, bonuses)
- Preview and testing capabilities
- Validation through gameplay
- Map block purchasing through smart contracts
- Decentralized map storage
- Block ownership and trading system
- Global statistics and achievements
- Responsive design for all devices
- Multi-language support
- Modern and intuitive UX
- MetaMask integration
src/
├── components/ # React components
│ ├── Game/ # Game engine and logic
│ ├── MetaMaskConnection.tsx
│ └── SmartContractDemo.tsx
├── hooks/ # Custom hooks
│ ├── useMetaMask.ts
│ ├── useSmartContract.ts
│ └── useNitroliteIntegration.ts
├── pages/ # Application pages
│ ├── GamePage/
│ ├── LevelEditorPage/
│ └── MainPage/
├── utils/ # Utilities and services
│ ├── smartContractService.ts
│ └── nitrolite/
└── types/ # TypeScript types
The project includes a complete set of sprites and animations:
- Player character with animations
- Platforms and environment tiles
- Animated objects (flags, effects)
- Background elements
- Biome - Code formatting and linting
- React CSS Modules - CSS Modules support
{
"editor.formatOnSave": true,
"editor.defaultFormatter": "biomejs.biome",
"editor.codeActionsOnSave": {
"source.organizeImports.biome": "explicit"
}
}
- Map block ownership management
- Block buying and selling system
- Level validation and storage
- Global player statistics
- Ethereum Mainnet
- Polygon
- Arbitrum
- Other EVM-compatible networks
- Multiplayer: Cooperative level completion
- NFT Integration: Unique in-game items
- Tournaments: Competitive events
- Mobile App: Native iOS/Android applications
- VR Support: Virtual reality experience
We welcome community contributions! Please:
- Fork the repository
- Create a feature branch
- Make your changes
- Create a Pull Request
This project was created for ETH Prague hackathon and is distributed under an open license.
Project developed by blockchain gaming enthusiasts for ETH Prague hackathon.
Play, Create, Own - Welcome to the Future of Gaming! 🚀