📊 React Dashboard Interface

This project is a responsive and interactive dashboard application built using React and Tailwind CSS, based on an SVG design mockup. It demonstrates a modern dark-themed layout with reusable components and mock data.

---

🧩 Features

• ✨ Clean dark UI based on SVG mockup
• ⚛️ Built with React (Vite)
• 🧱 Component-based structure
• 🧪 Mock data in JSON format
• 📱 Responsive design (desktop & tablet)
• 🧭 Navigation with active tab highlighting
• 📊 Interactive blocks with icons, stats, and graphs

---

🛠️ Technologies

• React
• Tailwind CSS
• JavaScript (ES6+)
• Mock JSON Data
• Vite

---

🧠 AI/Tools Used

This project was assisted by:

• ChatGPT (OpenAI) – used for generating and editing code, texts, and the README file.

• GitHub Copilot – the built-in version in Visual Studio Code assisted with code autocompletion.

• Figma AI – used the built-in recognizer to analyze UI elements and design layouts.

📸 Screenshots

https://www.dropbox.com/scl/fi/leo5gy66rckijly140kiv/DASHBOARD-1.svg?rlkey=afg8bn2gtl5pa7fo0u1vufjzx&st=p9ny79j2&dl=0 https://www.dropbox.com/scl/fi/94m7p601z23g1urc8pfmb/ACCOUNT-GENERAL.svg?rlkey=7s4uj15yq1ifd3b31b1z9nour&st=se0io00h&dl=0

📦 Installation

1. Clone the repository: git clone https://github.com/yaStigma/react-dashboard-interface.git
2. Navigate to the project folder: cd
3. Install dependencies: npm install
4. Start the server: npm run dev The app will be accessible at http://localhost:3000.

🙋‍♀️ Author

Yenakiieva Tanya - Junior Frontend Developer

Contact Information:

• email: yastigma@gmail.com,
• telegram: yastigma.
• GitHub: https://github.com/yaStigma