blizzard-site's Introduction

Blizzard Website

A Blizzard Website from BRChallangers. You can see the website by clicking here.

Preview

Technologies used

Technology	Version
ReactJS	18.2.0
TailwindCSS	3.2.4
React Query	4.20.4
Radix UI	1.0.2
Zustand	4.3.2

Usage

Installation:

npm i

Start the server:

npm run dev

What I Learned

TailwindCSS is a great choice if you want to create a faster layout, that was pretty easy to put the configurations and the class names, I had to check the documentation so many times to see how I apply x thing in Tailwind, but it’s completely normal.
Zustand was the pretty one, that framework helps in a easy way to create a global state in React, I had to create a state on my navbar to open and close the sections, because the components doesn’t have a connection between.
RadixUI was the easy way to create a modal, in the case, I grab the react dialog, but the Radix have so many components that you can donwload in your documentation.
React Query is a great lib if you want to make a API call without useEffect, they have so many features that I doesn’t discover yet, but I want in a future.

Improvements

Make the images load more fast
Make more animations between the games when the section change
The last section was weird on mobile

What would I do differently

It was probably better to init the project with NextJS.

Conclusion

In conclusion, creating the Blizzard Website was a challenging but rewarding experience. Through this project, I had the opportunity to improve my skills with ReactJS, TailwindCSS, React Query, Radix UI, and Zustand. I learned valuable lessons about web development best practices, and responsive design.

Recommend Projects