How to build a website without frameworks and tons of libraries

An innocent question was posted on IndieHackers the other day: "I'm asking what did you use to build your website".

The question also had a second part. So just to be fair, here it is in its entirety: "I'm asking what did you use to build your website, I really love the design and feeling of kodingkitty."

But this post is not about people loving our website. Although we're obviously happy about that.

Too lazy to read? Check out Koding Kitty's simple toolchain.

The shocking truth

The question sparked an idea to write about the tech stack that KodingKitty team uses for its own web. And we warn you beforehand: it's so simple that some of you might find it shocking.

You have been warned.

Hype is just a coincidence

Our tech stack has nothing to do with the current hype about lightweight or simplified web development. Not everyone rides that wave, and that's fine.

On the other hand, we believe that in many cases, "back to the roots" or "simplicity is the ultimate perfection" is a better solution for customers than convoluted web of overused frameworks and libraries.

To put it another way, the solution we designed for our website and the current hype is just a coincidence. Our stack is simple because we wanted something pragmatic with minimal friction for the developers.

And even though we wanted Koding Kitty website to have a distinctive yet subtle design, it is important to mention that it could have been achieved in many other ways.

Comparing options

Our website and the way it is built comes from our past experience.

We had the chance to work with different web frameworks in the past. We know this is a luxury not everyone has. It has allowed us to compare different technologies and decide what works best for us.

From the beginning we agreed to start with a static website. After all, what does a kitty's web really need? A front page, a showcase, a blog ... and probably not much more. At least in the beginning.

Our requirements

We set the following set of requirements:

What are the options today to have a website with the above requirements?

Wordpress (and similar CMS)

Nothing against WordPress, it's done a tremendous job for the internet but ...
... honestly, it's a bit overkill for our modest needs.

We don't need to store our content in a database. We don't need to deal with plugins. We don't need a visual editor to write our content.

No-Code

Yes, that's one area where there's a lot of the hype these days.

But to be a web coder and use a no-code tool? Seriously? It sounds weird.

We want to own our content. We want to do whatever we want with our web. We can code a website faster than we can build it in the no-code WYSIWYG editor.

The last point is that such tool still requires initial (and then ongoing) learning.

Frameworks

We have an experience with frameworks.

But, did we want to do the whole setup? Although it can be done quickly, we would end up with too many parts. Like a database, configuration, libraries, admin, and so on. Yes, it is a fully customizable solution, but we would end up with something that resembles WordPress.

And that's not what we wanted.

Jamstack (aka Site generators)

Static site generators look like a tempting option for our needs, don't they?

Just pick a programming language, do some coding, press a button (or run a script) and voila ...
... your fast static site is generated.

Unfortunately, Jamstack tools require an initial setup and an initial (and continuous) learning.

We understand, that writing a blog in markdown is convenient, but taking all things into consideration we decided for simpler solution.

KittyStack

Our solution is obvious, when you review our requirements (repeated below for your convenience):

Let's discuss them one by one:

Fast website

Is a static website fast?
Yes, it is!

Fast development

Now, you may be thinking: "If you're not writing your content in markdown, you're not using a fancy editor, then what are you using?"

We write our content in HTML!

Take a look at our website. For the kind of posts we publish there, HTML is ideal. We mix the text with HTML/CSS/JS widgets, so it makes sense to have a post written directly in HTML.

Inexpensive hosting

Is hosting a static site inexpensive?

It depends on the provider and all the bells and whistles you decide you need.

We decided to go with the absolute minimum, because hosting static sites doesn't require a massive hardware setup.

Mind you, Hetzner webhosting starts at 2 EUR! How crazy is that?

And if you are worried that your site will not survive a massive spike in traffic - like when your post hits the front page of Hacker News - it probably will. At least our site did.

Minimal complexity

We insisted on minimal complexity, but some of our pages and posts have repeating patterns.

While it is possible to use a copy+paste routine, it can quickly get out of control. Using some form of loops would help a lot. Also, the ability to include some blocks of code - like header, footer, and the alike - would be beneficial.

Templating to the rescue

And so we come to the last piece of the puzzle.

Meet Jinja templates, which make our life much easier. Jinja allows us to use loops, include files (navigation bar, footer, etc.) and much more.

Plus, we didn't have to learn a new system as we were already using frameworks based on Jinja before.

A simple toolchain

Now you might be wondering how we generate the final, static page.

We use a short Python script with exactly 45 lines of code. Including comments and blank lines.

In summary, this is the simple toolchain for building our web:

index.src.html
watchdog.pyrenders Jinja templatecalls Tailwind CLI
index.htmlstyles.min.css

It's also important to mention following:

Conclusion

Web development can be kept simple without sacrificing too much.

In fact, it can be liberating to limit yourself to just a few options. And based on what we've seen so far, many customers would benefit from having solutions that are faster, simpler and cheaper.

But don't just take our word for it. Take a look around the web and ask yourself: could the same result be achieved using a less complex tech stack?