DevDash – All-in-One Developer Toolkit for HTML, CSS, JavaScript, and React

What is DevDash?

DevDash is a curated platform built for developers who want to learn faster and build better. It combines courses, interactive tools, and ready-to-use code into one seamless experience.

Live Demo: devdash-ten.vercel.app/dashboard

📚 What's Inside

🎓 Courses

• HTML & CSS fundamentals
• JavaScript
• TailwindCSS
• React Icons

🛠️ Interactive Tools

• HTML/CSS Code Playground – experiment with code in real-time
• AI Prompt Guide – write better prompts for development tasks

⚡ Ready-to-Use Components

• Pre-built, reusable components
• Ready-to-use buttons with various styles
• Copy-paste friendly code snippets

🎨 Resources

• Icon names reference for React Icons
• UI component inspiration

🛠️ Tech Stack

• Next.js 16 – App Router, server components
• TypeScript – type safety
• TailwindCSS – utility-first styling
• Framer Motion – smooth animations

Why I Built This

As a developer, I often found myself jumping between multiple tabs – one for documentation, one for code playgrounds, one for component inspiration. DevDash brings everything together in one place.

🔗 Links

GitHub Repository: github.com/nour-yahyaoui/devdash-online-tools

If you find this useful, please ⭐ star the repo – it helps others discover the project!

🚀 What's Next?

I'm planning to add:

• More interactive playgrounds
• Additional component libraries
• Dark mode (if not already implemented)

💬 Let's Connect

Drop a comment with your feedback or suggestions. What tools would you add to a developer dashboard?