Making a landing page to present a few projects

After completing some of the courses I’ve ended up having a few small projects that I wanted to store somewhere but without spreading them into several repos (as they are rather small). I then decided to simply gather them under one page and be done with it.

For the structure I’ve just put the landing page files in the main folder in order not to bother with the GitHub pages issues (which have a strange desire to always have index.html file in the main folder). And then the projects are stored in the separate folders linked on the main page. I also wanted them to be independent of each other, that’s why there is no single CSS or JS file. Every page has its own.

First, I’ve added the title with a short description and a section with the links to the projects. Then I’ve realized that a while ago I was playing around with JS and made a tiny random-quote generator. It was of no use having it as a separate repo, so I’ve slightly refactored it and put at the bottom of the page to run on its loading. There’s no API link, it simply runs through three different arrays to randomly show a three-parts message.

Then, to add a bit more content, I’ve made a section with some notes I took while doing the courses. It was a sort of a recap for me, so I only took notes of the things I found useful or didn’t know before (it’s not a summary of all possible things). There are two buttons each opening a small section with a bunch of list-elements.

Finally I’ve adjusted the texts, sizes and spent a bit of time making it look ok-ish on mobile. So far, the weirdest size I’ve found is Galaxy Fold (seriously, why?). Every time you check various screen everything goes well up until the point you look at this one. Then you need to start more tweaking. Frankly, sometimes I just leave it as it is, because other screens look normal.

I’ve also noticed that I started using vw and vh for pretty much everything related to the elements sizes and it may not always be a good idea. Seems like pixels could be a better option when you want something to be precise and of the same size everywhere.

At the end the page seems to be doing the job, and I didn’t want spending too much time on it as it’s kind of a little storage for some small things. Maybe I’ll add something else later but for now it’ll be left like this. Must also mention that doing something on your own without a tutorial behind is quite refreshing. May come out being chunky-bulky, but at least it’s fully you who made, huh?

As always, if after reading this you consider the text useful, I thank thee kind person.

Related posts:

Happy Holidays! It has been a wild ride of a year, with amazing achievements and terrible tragedies one after another, all over the map. And yet, here we are, at the end of it. We’re getting ready to…