React Profile Page

This project is a user profile page built using React. It includes features such as displaying user information, badges, points history, and more. Additionally, it incorporates a modal for displaying badge achievements and a celebration animation using react-confetti when a badge is unlocked. Built in 5 hours.

Features

• View user's profile details including name and avatar.
• Display user's points and level.
• Show user's rank.
• View user's badges.
• See user's point history.
• modal for displaying badge achievements and a celebration animation using react-confetti when a badge is unlocked.

Built With

• React - JavaScript library for building user interfaces
• CSS - Cascading Style Sheets for styling

Dependencies

• react - ^18.2.0
• react-confetti - ^6.1.0
• react-dom - ^18.2.0
• react-icons - ^5.0.1

Dev Dependencies

• @types/react - ^18.2.55
• @types/react-dom - ^18.2.19
• @vitejs/plugin-react - ^4.2.1
• eslint - ^8.56.0
• eslint-plugin-react - ^7.33.2
• eslint-plugin-react-hooks - ^4.6.0
• eslint-plugin-react-refresh - ^0.4.5
• vite - ^5.1.0

Screenshots

Getting Started

Prerequisites

• Node.js installed on your local machine

Installation

1. Clone the repository.
2. Install dependencies using npm install.
3. Start the development server using npm run dev.
4. Open your browser and navigate to the provided URL to view the application.