First

2023/07/19

Hello!

This is officially the first post on the blog. As I write this, the website isn’t even on a git repository yet. I’m actually in this process of migrating it from a static HTML/CSS/JS site to use Jekyll to generate some of the repetitive content, like these blog posts. Why don’t I tell you about how the site is currently working?

Current stack

I chose to slightly rework the site in order to take advantage of some features that were hard to use before, like Sass, or Github Actions.

Sass is saving me a moderate amount of CSS by allowing neat features like selector nesting. As an example, I can turn the following CSS into a much shorter Sass file by using selector nesting:

/* The .css file */
.class1 h1 {
    color: white;
}

.class2 h2 {
    color: red;
}

/* The .scss file */
.class1 {
    h1 {
        color: white;
    }

    h2 {
        color: red;
    }
}

This site uses two separate files to define its dark theme, so when you click the dark mode icon in the right corner, a class is added to the body that enables the dark styles. I wanted to reimplement this feature using Sass to store the different colors in variables, and then when the button is toggled, the variable value could be changed, but that was not possible. Sass generates static CSS files from the variables, so updating Sass variable value at runtime doesn’t make any sense.

I’m able to use Github Actions to implement a continuous deployment system. Each time I push the site, a version of Ruby running on a Github server builds the site, and deploys the files to a separate branch, which hosts the site.

Next steps

In the future of the site, I’d like to be able to persist dark mode across many pages. I’ve read that using a cookie is probably the way to go for this. I’d also like to be able to host some of the games I’ve created, and I will look into creating a game template that wraps the games into a nicely presented player along with some information.

That’s all I wanted to talk about for now, but I’ll be sure to post more updates to the site and my projects in the future!