Javascript Vue

Dashboard for managing rally discord bot built using vue.js2 min read

Rally Discord Bot Dashboard

Dashboard for managing rally discord bot built using vuejs, a tour of the UI is available in the getting started guide. This app is ready to be deployed on netlify. On deploy it is required to set the CLIENT_ID and BOT_API enviroment variables.

CLIENT_ID – app client ID obtained from discord
BOT_API – base url for the bot API, more info here on setting up the bot and API

Also add the following redirect URIs to your app on discord BASE_URL/ and BASE_URL/dashboard/home.

DEMO

If self hosting is not your thing you can start using the dashboard right away on the official site by visiting https://rallybot.app

Screenshot

initial template
theme
charts

TODO

Setup

Project
Components
Router
Store
I18n
Fetch API utils

Implement

Discord API intergration
Rally API intergration
Rally role bot API intergration(bot setup, commands, set role mapping, get role mappings etc)
Feature request form
Notification system
SSO
Tests

Development

Clone the repo

git clone https://github.com/Ju99ernaut/rally-discordbot-dashboard

Navigate into the repo

cd rally-discordbot-dashboard

Install dependencies

npm install

Start dev server

npm run serve

Production Build

npm run build

Lint files

npm run lint

Configuration

Add BASE_URL/ and BASE_URL/dashboard/home to your discord app’s redirect URIs

Fill in the config.js file

Setting
Description

home
Base URL of the dashboard site

clientId
discord client ID

botApi
Base URL for the discord bot API

githubHome
repo homepage

config.js example

export default {
home: “http://localhost:8080/”,
clientId: “786246670530773023”,
botApi: “http://localhost:8000”,
githubHome: “https://github.com/Ju99ernaut/rally-discordbot-dashboard”,
//…
}

feature request form

You will have to set it up in src/pages/FeatureRequest.vue

example google forms setup

create a google form with title and description field then click get prefilled link, you will get something like:
https://docs.google.com/forms/d/e/formID/formResponse?inputid1=””&inputid2=””
Fill in the submitRequest as shown below

submitRequest() {
const obj = {
“inputid1”: this.title,
“inputid2”: this.description,
};
fetch(
“https://docs.google.com/forms/d/e/” +
“formID/formResponse” +
queryString(obj),
{
mode: “no-cors”,
headers: {
“Content-Type”: “application/x-www-form-urlencoded”,
},
});
//…
},

GitHub

View Github

Pin It on Pinterest

Generated by Feedzy