Custom Usernames
Added 2024-05-02 05:00:09 +0000 UTCCustom usernames! I've wanted to add custom usernames for a time but there's a lot of moving parts that I needed to have full into place first.
Braytech is made up of many parts:
An NGINX server answers requests for static files like HTML, CSS, and JavaScripts
This is the primary entry point for Braytech's visitors
Node.js Express server 1 answers requests for custom API requests
This handles all sorts of things such as push notifications, subscriptions, discord polls, and app widgets
Node.js Express server 2 lurks in the shadow of the NGINX server, answering specific requests
For everything an NGINX server can do, it can't generate images or perform SQL queries for specific page metadata–this is where Node.js Express server 2 comes in!
For all intents and purposes, Braytech is a SPA (single page app) which is downloaded by a browser and runs once all of its JavaScripts have been loaded (clientside).
This is made more complicated by the use of a service worker. Service workers enable things like push notifications. I will not try to explain service workers here! 😅
The NGINX server is configured to pass the requests for specific files such as index.html to Node.js Express server 2. The Express server can then propagate the correct metadata for the request across the HTML tags of index.html. Websites and apps such as Twitter and Discord can then display the correct metadata, specific to the page which the user has linked.
In addition to metadata, you can use this opportunity to inject data into the page for JavaScripts to use or generate unique images. I do both.
The injected data helps Braytech understand what custom usernames are and what destiny memberships they correlate with.
This is an example of a generated image for a Braytech link which points to a destiny member.
Many other image types exist including those for activity reports, items, emblems, and more.
