Learning to make a website

My name is Nuzcraft. I am a game developer.

In late November 2023, I decided to make a website for a few reasons:

• I want to market my games
• I want to learn how web development works

I have professional, non-academic experience in software development, but even with that, the barrier to entry for this is HIGH.

Technologies

After some research, I settled on the following:

• Kinsta
  • they offer FREE hosting for static sites
• Astro
  • recommended by Kinsta as an option for static sites
• Github
  • I already keep my other code here, why not by website code too
  • it integrates with Kinsta well

Ready to get started, I dug in. Kinsta first, as I didn’t really know what they meant by static site. Turns out its some mumbo jumbo about not needing a database or server resources? I figured if I put something together with some basic stuff I could make that work. Astro was a product I’d heard was gaining traction, but had no clue what it actually was. Kinsta had a couple articles and that was enough to get me to try it.

Getting things installed

I know next to nothing about web dev, so step 1 was installing node.js. This was daunting, especially when it asked about installing the supplementary tools - getting big terminal windows and lots of warnings made it seem like the install wasn’t working some of the time.

Setting up a new Astro project (in hindsight) is a simple matter (just a create command to get the project going), but for the uninitiated it seems weird and hard to comprehend. After a test run, I decided to use a theme to get everything started with some blogging functionality. This was good. Looking through the codebase, I have almost no idea how it’s put together and will need to put in some work to understand it.

Getting the site running

Astro makes it really easy to run, build, and preview your site, but a running site still might have build errors (as this one did). Knowing very little about typescript, I google-fixed everything red and squiggly while trying not to break any key functionality.

Kinsta has a super simple interface for getting a site like this up and running. Start a static site, choose a repo (mine is on github) and the documentation has the couple deployment settings you need. In just a couple minutes, the boilerplate site was up and live on a Kinsta URL. I shared it with a couple people and it was really cool to hear that they could access a site built on code from my repo.

Customization and Summary

Now that the pieces were all lined up, I went to town updating and changing the theme to match my new site. Ripping out all the old social links and putting in some new ones (SVGs are annoying). I made a bunch of new profile images of giadrome from MHFU. I moved the old example blog posts to a temp location so I could start my own blogs, including this one!! Finally, I added a small portfolio, mostly links out to itch.io or github.

In summary, I’ve had a great time learning to make a website. Turns out, if you don’t stress too much about being in the dark, today’s tools make it pretty easy to get something up and running. Astro is an enigma to me, but I’ll learn it eventually. Typescript is confusing, but I’ll get there. Kinsta kinda makes sense, but I’m sure I’ll learn plenty more.

Thanks for stopping by, I hope you enjoyed.

- nuzcraft