Stor8

2021-09-28
#TypeScript#HTML#CSS

A Pastebin alternative for storing Toyhou.se templates

I created STOR8 as an alternative to Pastebin specific for storing HTML and CSS templates for Toyhouse. Although the first version was released back in 2021, an updated version with more features and easier use was developed in January of 2024. The original project was written in Python using the Flask library while the current iteration is written in TypeScript (much like most of my other work).

The current homepage, designed by Elliott

(Side note: I thought the little carousel was fun so I made a tiny video showcasing it. Thanks, Elliott!)

The main features I wanted STOR8 to have in comparison to Pastebin were better organization and easier integration with Toyhouse itself. Compared with the original version, the new STOR8 also was meant to be easy for anyone to use, without much backend knowledge needed. While the original required a package download and individual hosting, the current version allows users to log in using Toyhouse's OAuth API and upload codes directly through an onsite form.

upload page

The current upload page

Once a code is uploaded, it'll get its own code page. The code page links directly back to the corresponding Toyhouse page (if linked) and to the user's onsite profile, where all their codes can be viewed. If a code has multiple "versions" (something quite common within the Toyhouse codes niche), both versions will be displayed directly on the code's page.

code page with multiple versions

An example of a code with multiple versions, seen here

Another upgrade from the original was how I handled passwords. Since the new version supports "versioning" of codes, passwords were also versioned. This way, codes can have a "Free" and "Locked" version, if for whatever reason, this is needed.

Past Iteration

The original STOR8 was a package download that would turn a file directory of HTML (or CSS) files into a Flask powered site. The main plus side to the past iteration was not needing a database, while the negatives included the difficulty in setting the site up and each user needing their own instance of the site.

Besides the general difficulties with that, the UI of the site was also not ideal. The folders system was a bit clunky, and would display in a very plain way.

UI of the original site, dark mode and light mode

The code page itself was also not the prettiest. Here's what a default code page and password locked page looked like:

In comparison, here's what the current password locked page looks like:

password locked page

Much cleaner!

Set up required each code to have a specific .md file with a header detailing the password, name, and code pasted below. While this wasn't super complicated, it was still pretty annoying. It also required people to update the site manually by uploading the .md file to the repository. Comparatively, the new STOR8 is much easier to use.

Read About My Journey

Part 1

Setting up the new version of STOR8.

Part 2

Some changes in features to focus on.