Gemuhabu - A Gaming Hub

Table of Contents

1. Links
2. About The Project
   • Project Description
   • User Stories
   • Built With
3. Getting Started
   • Prerequisites
   • Installation

---

Links

• Repository: https://github.com/hoanglechau/gemuhabu
• Deployed Website: https://gemuhabu.vercel.app/

(back to top)

---

About The Project

Project Description

Gemuhabu is a gaming hub application that allows users to search for game information.

(back to top)

User Stories

• As a user, I can view a list of all the games.
• As a user, I can toggle between light and dark modes.
• As a user, I can filter games by genres using the left side bar.
• As a user, I can filter games by platforms using the dropdown button.
• As a user, I can order games by relevance, date added, name, release date, popularity, and average rating.
• As a user, I can search for specific games using the search input.
• As a user, I can find more details about a game by clicking on its name to go to the game details page.

(back to top)

Built With

• React
• React Query
• React Router
• Zustand (state management)
• Chakra UI
• ESLint
• Prettier

(back to top)

---

Getting Started

Prerequisites

1. Check your version of Node.js and npm

   node -v
   npm -v

2. Install Node.js and npm if needed at https://nodejs.org/en/download

(back to top)

Installation

1. Clone the repo

   git clone https://github.com/hoanglechau/gemuhabu.git
   cd gemuhabu

2. Install NPM packages

   npm install

3. Get a RAWG API key at https://rawg.io/apidocs. You'll have to create an account first
4. Create an .env file with the following contents

   VITE_API_KEY = your_api_key;

5. Replace the value of VITE_API_KEY with your RAWR API key
6. Build the app

   npm run build

7. Run the app

   npm run start

(back to top)