Welcome to the Next.js ShadCN Admin Dashboard! This is a modern, responsive, and elegant admin dashboard built using Next.js and ShadCN UI. It serves as a foundation for your future projects, offering customizable components and ready-to-use features for building dashboards and management systems.
- Responsive Design: Fully responsive design for seamless experience on mobile, tablet, and desktop.
- ShadCN UI: Leverages ShadCN UI components for quick and clean design implementation.
- Dark & Light Mode: Switch seamlessly between dark and light modes for a better user experience.
- Easy to Extend: Add new features, pages, and components with ease.
- Authentication Ready: Easily integrate authentication (with NextAuth.js or other providers) for a secure experience.
- Customizable Theme: TailwindCSS and ShadCN allow full customization of the theme.
Before you begin, make sure you have the following installed:
-
Clone the repository to your local machine:
git clone https://github.com/your-username/nextjs-shadcn-admin-dashboard.git
-
Navigate to the project directory:
cd nextjs-shadcn-admin-dashboard -
Install the dependencies:
npm install
Or if you use Yarn:
yarn install
-
Start the development server:
npm run dev
Or with Yarn:
yarn dev
-
Open your browser and go to http://localhost:3000.
You can easily customize the theme and layout by modifying the following files:
/styles/globals.css: Global styles for the dashboard./components/Sidebar.js: Modify the sidebar navigation./components/Navbar.js: Customize the top navigation bar./pages/_app.js: Global settings and theme toggles.
Here’s a quick overview of the project structure: