Discord Bot Dashboard
in ,

Create Your Own Discord Bot Dashboard

I will guide you through how to set up the discord bot dashboard that I created, in case you don’t know what I’m talking about, please take a look at this Github repository or Youtube video before proceeding any further.

 If you are going to host dashboards on Replit, then you may face some issues, but do not worry, as you can always ask for help on our Discord server  

1. Clone The Github Repository

As a first step, you need to clone the repository into your system. Below are the steps to clone the repository.

– How to Clone in Windows?

  • To get started you must download Git, if you already have, you can skip to the next step
  • Create a new folder with your project name, example: my-new-project
  • Open that folder in your IDE or Code Editor, example: VSC, Sublime, Atom, etc
  • Open the terminal and type this command git clone https://github.com/CTK-WARRIOR/Discord-Bot-Dashboard
  • That’s all you have to do clone repository

– How to Clone in Replit?

  • Click on + icon on replit
  • Choose Import From Github option
  • Paste this URL https://github.com/CTK-WARRIOR/Discord-Bot-Dashboard

2. Configuring The Files

After you have cloned the repository, you need to configure the file accordingly; this involves adding your bot token, secret, ID, and redirect URL. 

  • Go to the bot folder, locate the config.json file and fill out the details.
  • After you are done with above step, locate the file with name nuxt.config.js
  auth: {
   strategies: {
    discord: {
      clientId: 'YOUR BOT ID', // Unique ID of your discord bot
      clientSecret: 'CLIENT SECRET', //Secret of your bot
      codeChallengeMethod: '',
      grantType: 'authorization_code',
      scope: ['email', 'identify']

ClientId and clientSecret are required and can be found in the Discord Developer Portal

3. Add Redirect URL

In the developer portal, you have to add the redirect URL, which is an essential part for authentication, if the redirect URL is invalid, the login will not work.

  • Go to Discord Developer Portal
  • Choose your Application or Bot
  • Go to auth Section
  • Add your redirect URL which should look like this : https://<domain>/login. example: https://localhost:3000/login or https://ctk.repl.co/login
  • Save the changes and you are done with this process.

4. Running Discord Bot Dashboard

Last but not least, you will be running your dashboard on your system or cloud, if you followed the guide properly so far then you should see it running immediately, if not, double check the points mentioned in the guide.

  • Open terminal in your IDE
  • Paste below given commands and press enter one by one
npm run setup

Above command will install all the required packages

npm run build

it will generate the .nuxt build directory

Head over to Here to know more about build directory
npm run dev

If you want to run the dashboard in production mode, you can substitute this command for the one above, npm run start

About Dashboard

Now that you have set up your dashboard, I would like to touch on a few technical aspects, for instance “How is this done?”, “What does it use?”, etc., so that if anything goes wrong, you will atleast know what is happening.

In response to the question of what technology it uses, I am including below the technology I employe

  • Discord.js – Wrapper for discord API
  • Nuxt.js – it is a free and open source web application framework based on Vue.js, Node.js, Webpack and Babel.js.
  • Socket.io – it enables real-time, bidirectional and event-based communication.
  • nuxt/auth – Zero-boilerplate authentication support for Nuxt.js
  • NProgress – Slim progress bars for Ajax’y applications. Inspired by Google, YouTube, and Medium

This is it, You have finished the bot dashboard, I hope it runs smoothly. If you have any other question then you can contact me on Gmail – [email protected] or on discord – CTK WARRIOR#7923

Related Posts

Written by Senpai

"This may be a virtual world,but I feel more alive here then in the real world"

Leave a Reply