This is the first blog post I’m publishing in this website. I just finished adding final touch-ups to the site, which took me a three long evenings to make. With the finish, I thought of removing the placeholder posts (if you want to see those placeholders, then you can look at the source code repository 😉) and adding real articles. Yes, this is a real article.
To get started, I’m not a professional website developer, which you might have guessed with how the site looks 🙈, but still, I thought of giving it a try. I’m not really a fan of making websites because
- They are really difficult
- I’m not that creative
- I don’t have enough resources
The above statements might sound vague to you, so let me explain.
They are really difficult
Yes. Gone the days with simple websites. Nowadays every website has a pretty complexity around it. From a rich collection of frameworks to a massive list of variations like browsers (Chrom*, Firefox, Safari etc.), screen sizes (desktop, phone, tablet etc.), personal preferences (dark mode, privacy conscious etc.). A professional website developer may not be worried of these, but as I said in the starting, I’m not a professional. So, it is not really easy from a newbie point of view.
I’m not that creative
I don’t have enough resources
This is a big obstacle in my tech life and so it is for web development. I have a laptop with 2 GB RAM. Yep very old one. You know how difficult it is even to browse modern day websites, then how can I even dream of making one. Thanks to low-memory environment I have made myself comfortable of, I was able to make this site finely. The low-memory environment is nothing but SwayWM and GNU Emacs. I will explain about it later.
Now you might get an idea on the problems I face. Yet, I was able to finish the site by doing this and that. Oh yes!
My Old Website
The first real world website I made is a website for me. I was a very newbie to web development that time. I wanted a website for namesake. So I used (still use) GitLab Pages for hosting. I wrote the code using VueJS and it was a very fine mess. But it did work.
It was not made for blog or ideas sharing, but just a website for namesake. The site was not colorful, it was full black text on a clear white background.
Soon after making the site, I forgot to improve it and later forgot its very existence.
Examples include websites of GNU, Debian, Drew DeVault. They were simply fascinating, and that’s how I was also inspired to make a website that is simple. That’s it.
Time To Start Playing
So now it’s time to start making the website. I decided to use Hugo for building the website and TailwindCSS for CSS. Now after the finish of site, I think I have made a solid decision to use them. They have good documentation and a pretty big community. It really helped.
Also thanks to a vast resources and tutorials available in Internet guiding various topics like semantic web, image optimization etc.
Finally, I solved the first two issues I mentioned earlier, what about the third issue?
I used to keep three workspaces in Sway. The first has Firefox with two tabs. The first tab has
localhost:1313 with my developing website. The second tab has documentation of either Hugo or TailwindCSS or any important site.
The second workspace has Emacs with code of my site. I don’t know how many buffers will be active there, most of the time it is around ten. But at the front (means at Emacs window), I keep only one or two panes at most (two panes if I’m referencing some other code).
The third workspace has two Foot terminal windows. Since the website is in development stage, I run watch mode of TailwindCSS and Hugo in the two windows. Watch mode is nothing but a watchdog that reloads and builds the website on file changes.
With this setup, my memory usage comes around 80%. And sometimes I need to debug the site, so I have to open Firefox’s developer tools. So I’m pretty choking my system. But, this choking is the main reason, I need the website to be minimal. Neither can I make a website that is greedy on resources without killing my laptop 🤷.
After pretty good headache, I finally finished the site. Also, for your kind information, I didn’t jump directly from my old VueJS based site to this one. In between, I spent a lot of time in making 2 to 3 websites for my friends and contacts. For them, I used Hugo and TailwindCSS. This strengthened my experience and helped me in making my site without a lot of hassle.
My first blog post should not be so long, so let’s finish it up. The website’s source code is available for public reference in my GitLab repository, feel free to have a look. Don’t forget to share your feedback and thoughts via any Telegram or EMail (links are there in footer!).
Thanks for your time 😊.
Time has changed, I bought a new laptop - ThinkPad E14. Now, the memory constraints are pretty much not an issue. I also learnt about daisyUI and rewrote the website with a few parts using it. A lot of hard coded values were replaced with the help of daisyUI style classes. I’m now using GNOME but GNU (Doom) Emacs is still my default text editor. Somethings don’t change right 😉?