Diswordle
Diswordle

Diswordle

Created
Feb 16, 2022 11:38 AM
Tags
Project

Summary

Wordle is a browser game developed by Josh Wardle, consisting of guessing a random daily word in 6 attempts. Because of its popularity on Twitter, the game attracted the curiosity of the New York Times, which subsequently bought it for several million dollars.
Like the Facebook phenomenon, this game has attracted the curiosity of many developers who have created original alternatives or even copies.
For me, it's a good representation of independence: You can innovate simply, alone, and live from it.
Like thousands, I like to play it on a daily basis so I decided to adapt it to my daily tool: discord.

Overview

This project will lead me to progress on multiple skills. Since the bots of discord are numerous, it will require good SEO and advertising, which led me to choose Next.JS for its website.
And of course, all of this in typescript, a lovely language.
To interact between the database and the website, I will be using GraphQL for technical reasons and to also study this new technology. It’s a technology that I was able to get my hands on some time ago for S&Box, but couldn’t go further in it. Below I will discuss the why of using GraphQL over a Rest API.

Discord bot

The main objective is the discord bot. I will be using the discord.js library, as it is the most updated library existing on discord.

Organization

notion image
I already made a bot in the past, so I got used to organizing it with my own following data structure.
It allows easy event and commands creations like following:
import { Client, CommandInteraction } from 'discord.js'; import ICommand from '../interfaces/ICommand'; import Game from '../classes/Game'; const command: ICommand = { name: 'play', description: 'Start guessing the daily word', defaultPermission: true, callback: async (client: Client, interaction: CommandInteraction) => { await new Game(client, interaction.user).start(interaction); }, }; export default command;
Play example command

Website

As always, like the standards, I started by drawing a model on Figma to give me an idea of the colors that will be used.
I don't usually update templates frequently, so I only used it as a starting template.
Diswordle’s template

Server-side

As I mentioned earlier, I now use GraphQL over a Rest API, and here is why:
One of the main benefits of GraphQL is to make APIs less chatty. On a Rest API, you would request data to a endpoint, that returns needed and unneeded data.
In GraphQL, you only query what you need.
query { books { name } }
Example of GraphQL query
In addition, it provides a web panel for sandboxing where you can execute your queries, and get a schema of what data is available to you.
That make APIs much easier to understand, rather than documentation written by hand as I did for the first API version:
📃
API’s outdated documentation

Goals

The website is just for showcasing. Users will be able to invite the bot by clicking a button, find who’s the leader, their ranking, and maybe more statistics in the future.
 
© All rights reserved🌸 Carbon neutral, or maybe not.by suiramdev