Overview:
The Discord Bot Dashboard Template is a template built using Typescript, Next.js 13, React 18, and Chakra UI 2.0. It provides a user-friendly and customizable interface for managing a Discord bot. The template supports both light and dark themes, multi-languages using i18n, and has excellent UI/UX with fast performance. It also includes detailed documentation for easy setup and customization.
Features:
- Support Light/Dark theme: The template offers both light and dark themes for a customizable user experience.
- Multi languages support (i18n): Users can easily switch between different languages supported by the template.
- Typescript support: The template is built using Typescript, making it easy for developers to understand and extend.
- Nice UI & UX + Fast performance: The template provides a visually appealing user interface with a focus on performance.
- Flexible and Customizable: Developers can easily customize various aspects of the template to suit their specific needs.
- Detailed Documentation: The template includes detailed documentation to guide users through the installation and customization process.
Installation:
To install the Discord Bot Dashboard Template, follow these steps:
- Install Node.js and a Package Manager (such as npm or pnpm).
- Clone the repository:
git clone https://github.com/fuma_nama/discord-bot-dashboard-next.git - Install dependencies. Use either npm or pnpm:
- For npm:
npm install - For pnpm:
pnpm install
- For npm:
- Customize files according to your needs. The project contains the following file structure:
src/pages/*: All the pagessrc/components/*: Componentssrc/api/*: API utilssrc/config/*: Common configurations
- Define features by modifying the
src/config/featuresfile. This file allows you to enable/disable features and customize their configurations. - Customize general information in the
src/config/common.tsxfile. This includes the bot name, icon, and invite URL. - Configure environment variables by creating a
.envfile. The required variables are specified in the.env.examplefile. - Setup a backend server to connect the dashboard with your Discord bot. You can use any programming language for this.
- Start the app by running
pnpm run dev(or the appropriate command for your package manager). The app will be running on port 3000.
Summary:
The Discord Bot Dashboard Template is a feature-rich template built using Typescript, Next.js, React, and Chakra UI. It provides a user-friendly interface for managing Discord bots with support for customization, multiple themes, multi-languages, and fast performance. The template offers detailed documentation and easy installation steps, making it a great choice for developers looking to create a robust Discord bot dashboard.