Website v.0.3 update notes

Website v.0.3 update notes

V0.3

TLDR;

• Made the blog posts system
• Fixed a lot of small issues

Explanation of this update:

While technically this update says it only took 3 days If i had to guess I would say that it probably took at least 15 hours. This time I improved my process. Instead of taking from a project with no permission I took from a project that I was completely allowed to take from, in this case the Astro blog template. I looked for a long time for one that would be better but in the end I settled on this one. This was because it was simple, I could understand it, and I actually had permission to build off it.

Yeah but how does it work:

You only talk about the big changes, what small changes have you made:

Well I’m glad you asked. This was the update where I started to realize that while all the stuff that I was doing was good and all. Most users wouldn’t see it and so I started to make these changes:

• Autofocus on the text input - CSS
• Renames a lot of my HTML classes to be more readable - HTML & CSS
• Removed arbitrary CSS lines, eg padding where it didn’t matter - CSS
• Made the Ascii image of my face center and the same with the intro text to make it more readable - CSS
• Made it so that you can execute the welcome command and it returns the text that the website starts by giving you - JS
• Made some TS specific changes so that I didn’t have to have a if (input == null) {return} in every command
• Removed arbitrary HTML classes

What went wrong and how did I fix it:

• My original blog post template used tailwind css - Used another one
• The blogpost template kept breaking whenever I tried to integrate it into my website - test every SINGLE line to make sure it works, then find out its because I accidentally deleted a line
• Blog Posts broke when I removed ‘arbitrary’ bits of code from the blog posts - whoops, guess they weren’t arbitrary
• Now there is actually arbitrary code - Removed it but was very very careful and checked it was still working when I removed every line

Testing:

This was when I actually woke up to the fact that I may actually have to submit this project as my school HTML, CSS and JS project. So I should actually test it on people. I tested it on 5 people. It went terribly this is how it went, the people are named because I haven’t got permission to use their names.

• Person 1 - “Cool its a terminal emulator Tries to download a program oh ok” This person was already familiar with terminal systems and so got frustrated when it didn’t work like they expected. They were limited to basic commands, they were frustrated by the lack of cd .. and when they saw the code they (rightfully) told me it was disgusting, this sounds mean but was very funny at the time.
• Person 2 - Person 2 had no idea what a terminal was and how to use it. They clicked out of the input field and had to be shown how to select it again, they then tried about me and then gave up
• Person 3 - Person 3, because they were nice had no idea what to do tried their hardest but couldn’t get their head around the file system and ended up getting me to show then
• Person 4 - Person 4 was almost exactly the same as person 3
• Person 5 - Person 5 was really busy, and while they were familiar with terminals only did two commands, then told me it was cool and had to get back to what they were doing

The takeaways from the testing

After doing the testing to be honest I didn’t know what to do. Some people thought it was too simple and easy and others thought it was too hard, so I tried to find some things they agreed on and work to find a compromise, here are the things that I said I’d do

• Make the help page show what each command does
• Redo the ascii image of my face as none of them could tell what it was
• Make it so you can create directories
• Make it so you can interact with text files
• Make it so you can do cd ..

Changes to the plan

Not really much, except now completely rewriting the filesystem was the thing I wanted to do.