More Premium Hugo Themes Premium React Themes

Discord Bot Dashboard 2

A Modern Discord bot Dashboard Template

Discord Bot Dashboard 2

A Modern Discord bot Dashboard Template

Author Avatar Theme by fuma-nama
Github Stars Github Stars: 96
Last Commit Last Commit: Aug 22, 2023 -
First Commit Created: Dec 18, 2023 -
Discord Bot Dashboard 2 screenshot

Overview

This project has been deprecated and users are now recommended to use discord-bot-dashboard-next instead. This modern Discord bot project is built using TypeScript, Vite 3, React 18, and Chakra UI 2.0. It supports both light and dark themes, as well as multi-language support using i18n. The project also offers TypeScript support, a nice UI and UX, and fast performance. It is flexible and customizable, with detailed documentation available. A live demo can be accessed at the provided URL. The project currently supports only the “Welcome message” feature and the API may experience occasional downtime.

Features

  • TypeScript, Vite 3, React 18, and Chakra UI 2.0 technology stack
  • Support for light and dark themes
  • Multi-language support using i18n
  • TypeScript support
  • Nice UI and UX with fast performance
  • Flexible and customizable
  • Detailed Documentation
  • Support for the “Welcome message” feature

Installation

To install the theme, you need to follow these steps:

  1. Install Node.js and a Package Manager (e.g. npm or pnpm).
  2. Clone the repository using the command git clone https://github.com/SonMooSans/discord-bot-dashboard-2.git.
  3. Install the dependencies using one of the following package managers:
    • NPM: npm install
    • PNPM: pnpm install
    • Yarn: yarn install
  4. Customize the necessary files:
    • src/views/dashboard - User Dashboard: Customize states about the users.
    • src/views/home - Home page: Introduce your bot.
    • src/views/guild - Guild Dashboard: Customize guild features and actions.
  5. Define features:
    • The dashboard has built-in support for configuring features.
    • Users can enable/disable features and configure them after enabling.
    • Customize all typings in src/config/types/custom-types.ts.
    • Use CustomFeatures to define features and options.
    • Open src/config/features to see how a feature is configured.
    • The useRender property is used to render the Feature Configuration Panel.
  6. Configure general information:
    • Modify src/config/common.tsx.
    • Customize bot name, icon, invite URL, and guild settings.
  7. Configure API Endpoint URL:
    • Set the VITE_API_ENDPOINT environment variable.
    • Modify the default URL in src/api/bot.ts (default: http://localhost:8080).
  8. Start the app with npm run dev (or the appropriate command for your package manager).
  9. The app should start on port 3000.

Summary

In summary, this project is a modern Discord bot built using TypeScript, Vite, React, and Chakra UI. It offers support for light and dark themes, multi-language support, and a customizable dashboard. The project is well-documented and supports features such as the “Welcome message”. It provides a nice UI and fast performance, making it a suitable choice for creating Discord bots. However, it is important to note that the project has been deprecated and users are advised to use the discord-bot-dashboard-next project instead.