Hello Internet

Created: 2023-01-01


This first blog post is going to be me exploring the possibilities of Zola, HTML, JavaScript, and CSS. This blog post will almost certainly contain little information that will be useful to others so...

ABANDON HOPE ALL YE WHO ENTER HERE

While I have both academic and professional experience with full stack development, I have always been confined to React for the front end, which I think limits my understanding of how things are actually put together underneath. Thus, for this project, I wanted to use something other than React. Searching around, I eventually stumbled across Zola, which is a rust-based static website generator. I think this is a good fit for the site for now, as I want to understand more of the inner workings of the internet and webpages, and can use markdown, html, css, and some basic javascript.

After some minor research, I have realized a few things:

 <div id="warning-sign" style="
    text-align:center;
    margin: auto;
    width: 60%;
    border: 1px solid white;
    font-size: 2rem;
    color: red;
    user-select: none;
    ">
    ABANDON HOPE ALL YE WHO ENTER HERE
</div>

For my first script example, go ahead and click on the Warning Sign and the color will change to all the colors of the rainbow!

Now, with the simple stuff out of the way, I present to you my MAGNUM OPUS:

Instructions

  1. Press start/restart button
  2. A sequence of tiles (starting with 1) will flash yellow
  3. Wait until the sequence is complete, and then click the tiles in the same order they flashed
  4. Your current score and high score are shown on the top
    • NOTE: Your high score will not save if the page closes or reloads! I'm not saving any of this data!
Current Score:
0
Highest Score:
0
1
2
3
4
5
6
7
8
9

While my MAGNUM OPUS was an interesting thing to write as it introduced me to the DOM (Document Object Model) and touched on recursion, I don't know if I'll do many more programs like this on the site, unless I figure out a method to produce more maintainable code.