aboutsummaryrefslogtreecommitdiff

Karan's Homepage

Everyone should have a website. Here is mine. I created this website for two reasons:

  • Provide first hand information about myself on the internet
  • Reserve a URL for myself from where I can share my work

A website is just a folder that is shared on the web. The standard way of storing content in this folder is via HTML (Hypertext Markup Language). This allows for a bit of markup and linking to other documents. Standard HTML looks good as you can see on the first ever website but a bit of CSS (Cascading Style Sheets) goes a long way to make a website look much better. The third piece of the puzzle for web development is JavaScript. This allows for dynamic behaviour and user interaction. For this website however, I just wanted to display some static content. So I decided to ignore JavaScript for now. So I needed to create HTML and CSS files and serve / provide them to other via the web.

Another reason I wanted to do this project was because setting up this website was the first production project that I did and I wanted to be able to explain how each piece in the project works. Now I explain exactly why things are placed at a certain location or look a certain way on my website.

HTML: Content

Writing HTML by hand is not hard. HTML itself has some basic tags. When these tags sprinkled over a text document and the documented is stored with the .html extension, a browser should be able to open and render it. A lot of the tags especially the ones used for meta data are quite repetitive though. Also, tags for search engine optimization (SEO) need to be dynamically chosen based on content. This is crucial for getting your content featured on your favourite search engine. Thankfully, some really smart developers have created tools we can use to automatically generate HTML using Markdown files. This document is a Markdown files. Markdown is significantly easier to write and doesn't require us to memorize much. Static site generators then convert these documents to HTML files for us. I initially used Jekyll. Jekyll is a static site generator built using the programming language Ruby. But I got tired of having to have Ruby installed and maintained on my machine just for this application. I then came across hugo. Hugo is just a simple application that you can plop into your path and with some basic setup, you have a website.

CSS: Styling

For quite some time, CSS had been my least favourite amongst HTML, JS and CSS. I had always delegated the styling of web pages to others. Design mattered less than functionality. This opinion was wrong. Hugo comes with several themes you could choose from. I wanted something simple and clean. I initially used hugo-bearblog blog theme inspired by Herman. It looks good but it felt a bit off, it was not perfect for me. Whenever I came across another site using this theme, I felt that my website was a bit disingenuous to myself. When looking at Hacker News, I came across Neat, a minimalist CSS framework. It make a website look great with just over 150 lines of CSS. This inspired me to attempt creating a simplistic style sheet of my own. The whole of it ended up being less that 100 lines in a 2 kB CSS file. It is created for text heavy websites focusing on legibility and simplicity. I have also styled this blog using the same CSS. I learnt quite a lot doing this and have a new found respect for front-end work. Please feel free to reuse the CSS if you need, you can change the color to your preference using the hue and saturation variables.

Deployment

Any text content that is repeatedly edited is source controlled on my machines. This includes this website because I need to change the content based on changes in my life. I use git and store my files on GitLab. GitLab also offers a free functionality to host websites for each of your repositories via GitLab pages. It also offers free server resources to convert your markdown files to HTML via the static site generator discussed earlier. This is accomplished via pipelines. Pipelines allow you to run commands on a machine temporarily available to you on change to the git repository automatically. This allows me to make changes to the markdown documents and push these changes to GitLab. The pipeline automatically converts these files into HTML and hosts them on a website owned by GitLab. I didn't want to stop here though because the site that gitlab provides is "karanjayachandra.gitlab.io" but I wanted my own. So I bought the domain "karanj.com" and connected it to my page. A by product of buying this domain was that I also got a nice email address.

References

generated by cgit v1.3.1 (git 2.54.0) at 2026-09-15 02:56:52 +0000