GitHunt

DisPanel - Discord Bot Management Panel

DisPanel is a full-featured web-based control panel to manage Discord bots with ease. It lets you authenticate your bots, monitor real-time stats, manage servers (guilds), send messages, and more โ€” all in one place.

๐Ÿ“ธ Screenshots

  • Login
    Login

  • Dashboard
    Dash

  • Message Interface
    Guild Manager

**And More!

โœจ Features

  • ๐Ÿ” Discord bot token-based login system
  • ๐Ÿ“Š Real-time bot stats (uptime, ping, memory usage)
  • ๐Ÿ’ฌ Send messages to channels or DMs
  • ๐Ÿ›  Guild management (join/leave servers)
  • ๐Ÿ’ป Live chat and console logs
  • ๐ŸŒ™ Light/Dark mode support
  • ๐Ÿ–ฅ๏ธ Clean and modern UI with shadcn/ui + Tailwind CSS

โš™๏ธ How to Set Up

๐Ÿงฑ Step 1: Clone the Repository

git clone https://github.com/yourname/dispanel.git
cd dispanel

๐Ÿ“ฆ Step 2: Install Dependencies

Backend

cd server
npm install

Frontend

cd ../client
npm install


๐Ÿ—ƒ Step 3: Set Up Database

Ensure PostgreSQL is running.

Run database migrations using Drizzle:

cd server
npx drizzle-kit push

๐Ÿงช Step 4: Run the App in Development Mode

Start Backend

cd server
npm run dev

Start Frontend

cd ../client
npm run dev

Now open your browser and go to:

http://localhost:5173

๐Ÿš€ Step 5: Build for Production

Build the frontend:

cd client
npm run build

Then go to the backend:

cd ../server
npm run build
npm start

๐Ÿง  Tech Stack

Frontend

  • โš›๏ธ React + Vite
  • ๐ŸŽจ Tailwind CSS with Discord color palette
  • ๐Ÿงฉ shadcn/ui (built on Radix UI)
  • ๐ŸŒ Wouter (routing)
  • ๐Ÿ” TanStack Query (state management)
  • ๐Ÿ”Œ WebSocket client
  • ๐ŸŸฆ TypeScript

Backend

  • ๐Ÿง  Express.js (TypeScript)
  • ๐Ÿค– Discord.js
  • ๐Ÿ›ข PostgreSQL + Drizzle ORM
  • ๐Ÿงต Express sessions (PostgreSQL store)
  • ๐ŸŒ WebSocket server
  • ๐Ÿงฐ tsx + ESBuild

๐Ÿ—ƒ๏ธ Database Tables

  • bot_sessions: Stores bot token sessions
  • bot_messages: Logs message history
  • bot_guilds: Tracks botโ€™s guilds
  • bot_stats: Logs live statistics

๐ŸŒ Deployment Strategy

Development

  • Vite for frontend hot reload
  • tsx for running TypeScript backend
  • PostgreSQL (local or remote)
  • WebSocket for real-time updates

Production

  • Frontend built to static assets (npm run build)
  • Backend compiled to single JS file (npm run build)
  • Static files served via Express
  • Environment variables for secure configuration
  • DB migrations handled via Drizzle Kit

๐Ÿ“… Changelog

June 27, 2025
โœ… Initial release of DisPanel
๐ŸŸข Added real-time updates, Discord bot integration, full UI


๐Ÿ“„ License

MIT License


๐Ÿ™‹โ€โ™‚๏ธ Questions or Contributions?

Feel free to open an issue or pull request on the repository!

Happy botting! ๐Ÿค–

Roban-Community/DisPanel | GitHunt