https://github.com/diegaccio/game-hub
React + Chakra UI demo projet
https://github.com/diegaccio/game-hub
chakra-ui chakra-ui-react react typescript
Last synced: about 2 months ago
JSON representation
React + Chakra UI demo projet
- Host: GitHub
- URL: https://github.com/diegaccio/game-hub
- Owner: diegaccio
- Created: 2025-01-05T21:04:47.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-01-17T18:47:14.000Z (over 1 year ago)
- Last Synced: 2025-01-17T19:44:51.716Z (over 1 year ago)
- Topics: chakra-ui, chakra-ui-react, react, typescript
- Language: TypeScript
- Homepage: https://game-hub-blush-omega-98.vercel.app
- Size: 290 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# GameHub
GameHub is a video game discovery web app that helps you find new and interesting games to play. With GameHub, you can search for games by platform, genre, and more.
This is the project we build in the Ultimate React course by Mosh Hamedani. You can find the full course at: https://codewithmosh.com
## Getting Started
To get started with GameHub, follow these steps:
1. Clone this repository to your local machine.
2. Run `npm install` to install the required dependencies.
3. Get a RAWG API key at https://rawg.io/apidocs. You'll have to create an account first.
4. Create a .env file in the root folder of the project
5. Add this line VITE_RAWG_API_KEY='your_api_key_goes_here'
6. Run `npm run dev` to start the web server.
## About the Course
I really appreciated this course because I started with basically zero knowledge of React and TypeScript, and it covers everything you need in great detail. I also like Mosh's approach to clean and organized code.
This course is the first part of a two-part series, covering the fundamentals. You'll learn how to:
- Build front-end apps with React and TypeScript
- Build reusable function components
- Style your components using vanilla CSS, CSS modules, and CSS-in-JS
- Manage component state
- Build forms with React Hook Forms
- Implement form validation using Zod
- Connect your React apps to the backend
- Deploy your React apps
- Use VSCode shortcuts to increase your productivity
- Write clean code like a pro
- Apply best practices
By the end of this course, you'll have a solid understanding of React and be able to build real-world applications with React and TypeScript.
You can find the full course at: https://codewithmosh.com