Deconstructing this Static Site

This post explores how this static site is built and how it works under the hood.

Architecture

The site is built with:

PureScript for type-safe code
Markdown for content
Tailwind CSS for styling
Bun for fast execution

Components

The site consists of:

A templating system for HTML generation
A markdown parser for content
A routing system for URLs
A build system for compilation

Future Improvements

In the future, I’m planning to add:

Better code syntax highlighting
Improved responsive design
Search functionality
Dark mode support

( Incomplete by design )

+-------+
|       |
|  0x0  |
|       |
+-------+
   /|\
  / | \

+-------+
|       |
|  0x1  |
|       |
+-------+
   /|\
  / | \

+-------+
|       |
|  0x2  |
|       |
+-------+
   /|\
  / | \

Incomplete

There are two kinds of people: those who like to focus on reflection but describe themselves with poetry or any journal, and those who make websites like museums full of their latest works.

The first type holds the concept of simplicity and is entirely focused on how they express themselves in writing. The second type defines all imagination on the canvas.

I’m the second type. Admittedly, creating a personal website is difficult because the creators want to make the best website they have ever made. They liken it to a canvas, painting according to the imagination and mood of the painter. They often lose track of time, making the artwork incomplete and the painter exhausted. Or, halfway through, they get bored or bothered by another idea, throw away the canvas, and start a new painting. This cycle never ends.

The way to break it is to mark that the painting is Done.

After two years of working, I mark this site as "Done.

As version 1.0 :P

Concept

I’ve think bringing old style & modern art style together with keywords like ASCII, monospace typeface, cyberpunk, gradient, blur & grain yet keeping the simplicity for documenting journals.

Here’s some moodboard I’ve collected so far:

@[Counter]