My Projects Dashboard

screenshot of My Projects Dashboard
nextjs
react
material-ui

My Projects Dashboard

Next.js, Material UI, MongoDB Personal Dashboard with dev.to, GitHub, Twitter, and npm API integration.

Overview

The Personal Dev Dashboard is a web application that provides a comprehensive solution for tracking personal development goals. This dashboard allows users to monitor their progress, create and update goals, and view visualizations of their achievements. It also integrates with various APIs such as GitHub, dev.to, Twitter, and npm to fetch and display relevant data. Built using Next.js, TypeScript, and Material UI, this dashboard offers an intuitive user interface and seamless user experience.

Features

  • Goal Tracking: Users can create and update personal development goals, tracking their progress over time.
  • Visualization: The dashboard offers visualizations of users' achievements and progress, providing insights into their growth and improvement.
  • API Integrations: Integration with various APIs such as GitHub, dev.to, Twitter, and npm allows users to fetch and display relevant data directly in the dashboard.
  • Responsive Design: The dashboard is designed to be responsive, ensuring optimal user experience across different devices and screen sizes.
nextjs
Next.js

Next.js is a React-based web framework that enables server-side rendering, static site generation, and other powerful features for building modern web applications.

react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

material-ui
Material UI

material-ui adds classes to Tailwind CSS for all common UI components. Classes like btn, card, etc. This allows us to focus on important things instead of making basic elements for every project.

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.

recharts
Recharts

Recharts is a powerful and easy-to-use React library for building customizable and interactive charts. Built on D3.js, it offers a wide range of pre-built chart types, such as line, bar, pie, and scatter charts, all of which can be composed with a declarative syntax.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.