Skip to main content

Command Palette

Search for a command to run...

Going down the bunny hole - HTML

Published
3 min read

Hey there,

so I was thinking that the next step would be simply building my frontend. I mean I can just google what HTML tags i need and what react specific things there are… Yes… BUT!

I decided that in order to build my frontend I want to understand React well enough to be able to build a lasting foundation. Meaning good code, which I can easily read and maintain and expand upon. Which means I should understand the javascript, which is being used in react(boy has that been some time since university classes…..) and I should probably use typescript instead, since it may make debugging a bit easier… and since i am repeating those anyways, I might as well refresh my HTML and CSS knowledge with a quick tutorial….

So the plan is:

→ Relearn HTML (important for the website layout/structure)

→ Relearn CSS (important to make things look pretty)

→ Relearn javascript ( the thing that makes websites do things)

→ Relearn typescript ( same as javascript, but with types for variables and stuff, so debugging will be easier)

→ Learn React( to only refresh and update the things I need and not the whole site, while making things more comfortable and manageable)

→ Actually build the layout in React

→ Build the tutorial and have you guys play it <3

Aand just to tell you this: I am still working on it. Today I finished the HTML relearning. In a rather unexpected way I got to say. So here is the story:

I was asking Chatgpt for a recommendation of a tutorial site and found this site here https://www.learn-html.org/en/Welcome and I decided to do this - in large part due to the cute pixelart bunnies.

image from the tutorial website

Isn’t this just so cute? <3 Cutest coding ad I ever saw.

So I was going through this tutorial starting at the very, very beginning of “Hello World!” until this happened:

or more specifically… this

No next button, no previous button, no chapterlist, not even black writing on black screen(as in a previous part of the tutorial) , nothing at all. Thus I decided that I had conquered the tutorial. Yay! HTML has been refreshed <3

Since writing HTML is different from writing an HTML template in react though I am not able to write some basic but existing wireframe of HTML “code” yet. For the record: HTML is NOT a programming language, but a markup language. Important difference - is what my teachers told me back in job school.

With HTML out of the way now I will be moving on to CSS on the Mozilla Website. I am really looking forward to all this foundational work to come together and lead to a well structured knowledge base to build this game with <3 See ya next time! Bye bye~~