GameZone is a video game discovery web app that helps you find new and interesting games to play. With GameZone, you can search for games by platform, genre, and more.
Live Preview
Display a list of games with key information: title, score, rating, and platform. This feature provides users with an overview of the available games in your application.
Allow users to search for games by name. A search functionality enhances user experience by helping them quickly find specific games they are interested in.
Enable users to filter games based on genre and platform. Filtering helps users narrow down their choices and discover games that match their preferences.
Provide sorting options for games. Users can sort games by categories such as name, relevance, and date added. Sorting enhances the usability of your application by allowing users to organize the game list to their liking.
Implement both dark and light modes for your application's user interface. This feature enhances accessibility and user comfort by providing different visual styles to suit user preferences.
Implement user-friendly interactions for accessing game details, reviews, and additional information about each game. Consider adding features like favoriting games or leaving reviews if applicable.
Ensure your application is responsive and works well on various screen sizes and devices, providing a consistent and enjoyable experience for users.
The GameHub application utilizes a variety of technologies and frameworks, including:
TypeScript: A statically-typed superset of JavaScript that enhances code quality and scalability.
React.js: A powerful JavaScript library for creating user interfaces and building reusable UI components.
Vite: Vite is the build tool and development server used in this project. It offers fast build times and a smooth development experience.
Axios: Axios is a popular JavaScript library for making HTTP requests. It is used to handle API requests and manage data retrieval and submission. Axios provides a simple and consistent API for handling asynchronous operations.
Chakra UI: Chakra UI is a set of accessible and customizable UI components for React. It is used in this project to create a visually appealing and responsive user interface. Chakra UI simplifies the process of building beautiful and functional web applications.
To get started with GameZone, follow these steps:
- Clone this repository to your local machine.
- Run
npm install
to install the required dependencies.
- Get a RAWG API key at https://rawg.io/apidocs. You'll have to create an account first.
- Add the API key to src/services/api-client.ts
- Run
npm run dev
to start the web server.