Dev Dashboard

A personal developer analytics dashboard with GitHub stats, skill visualization, language distribution, and project tracking.

✨ Features

• 📊 GitHub Activity - Contribution graph with activity visualization
• 🎯 Skill Radar - Interactive skill level progress bars
• 📈 Language Stats - Donut chart showing language distribution
• 📦 Project Timeline - Recent projects with stars and forks
• 📈 Stats Overview - Key metrics at a glance
• 🌙 Dark Theme - Professional dark mode design
• 🎨 Animations - Smooth entry animations

🚀 Tech Stack

• Framework: Next.js 14 (App Router)
• Styling: Tailwind CSS
• Language: TypeScript

📦 Installation

# Clone the repository
git clone https://github.com/zhenxun00/dev-dashboard.git

# Navigate to the project
cd dev-dashboard

# Install dependencies
npm install

# Run the development server
npm run dev

📁 Project Structure

dev-dashboard/
├── src/
│   ├── app/
│   │   ├── page.tsx          # Main dashboard page
│   │   ├── layout.tsx        # Root layout
│   │   └── globals.css       # Global styles
│   └── components/
│       ├── GitHubStats.tsx    # GitHub contribution graph
│       ├── SkillRadar.tsx     # Skills visualization
│       ├── LanguageChart.tsx  # Language distribution
│       └── ProjectTimeline.tsx # Recent projects
├── public/                   # Static assets
└── package.json

🚀 Deployment

Deploy to Vercel with one click:

📝 License

MIT License

📬 Contact

• GitHub: zhenxun00
• Twitter: @zhenxun00

---

Built with ❤️ using Next.js & Tailwind CSS