A modern game discovery platform that helps gamers find their next favorite game. Built with Next.js 15 and powered by the RAWG Video Games Database API.
- 🔍 Real-time Search - Instant game search with dynamic results
- ⭐ Top Rated Games - Browse the highest-rated games across all platforms
- 🎨 Bold Gaming UI - Competitive, high-energy design aesthetic
- ⚡ Server-Side Rendering - Optimal performance with Next.js SSR
- 📱 Fully Responsive - Seamless experience on all devices
- 🎯 Genre Tags - Quick identification of game categories
- 🚀 Fast Loading - Optimized images and caching strategies
- Next.js 15 - React framework with App Router
- TypeScript - Type-safe development
- Tailwind CSS - Utility-first styling
- RAWG API - Comprehensive game database
- React Icons - Professional iconography
- Vercel - Serverless deployment platform
gamehub/
├── app/
│ ├── components/ # Reusable components (GameCard, SearchBar, etc.)
│ ├── search/ # Search results page
│ ├── layout.tsx # Root layout with Navbar and Footer
│ └── page.tsx # Homepage with top-rated games
├── public/ # Static assets
└── .env.local # Environment variables (not committed)
- Node.js 18+ installed
- RAWG API key (free at rawg.io/apidocs)
# Clone the repository
git clone https://github.com/iftyzubaer/gamehub.git
# Navigate to project
cd gamehub
# Install dependencies
npm install
# Create environment file
cp .env.example .env.local
# Add your RAWG API key to .env.local
NEXT_PUBLIC_RAWG_API_KEY=your_api_key_here
# Start development server
npm run devOpen http://localhost:3000 to view it in the browser.
Create a .env.local file in the root directory:
NEXT_PUBLIC_RAWG_API_KEY=your_rawg_api_key_hereGet your free API key at RAWG API Documentation.
This project is optimized for deployment on Vercel:
- Push your code to GitHub
- Import the repository in Vercel
- Add the
NEXT_PUBLIC_RAWG_API_KEYenvironment variable - Deploy!
- Real-time search through 500,000+ games
- Debounced input for optimal API usage
- Clean results page with game cards
- High-quality game images
- Rating badges with visual appeal
- Genre tags for quick categorization
- Hover effects for interactivity
- Server-side rendering for initial page load
- Image optimization with Next.js Image
- API response caching (1 hour revalidation)
- Lazy loading for smooth scrolling
This project is open source and available under the MIT License.
- Game data provided by RAWG
- Icons from React Icons
- Deployed on Vercel
Ifty Zubaer
Software Engineering & Management Student
Göteborg Universitet × Chalmers tekniska högskola
- Portfolio: iftyzubaer.vercel.app
- GitHub: @iftyzubaer
- LinkedIn: iftyzubaer
Contributions, issues, and feature requests are welcome! Feel free to check the issues page.
⭐ Star this repo if you find it helpful!