New Website
Hey There! Welcome to my brand new website! As you can see, the site has changed
substantially, I am using a brand new tech-stack, design and general approach
for writing project details or blog posts. In this post I will be going over
these different changes and why I made them.
Tech Stack
The previous site was build in plain
HTML,
CSS and
JavaScript, with the addition of
Bootstrap and
jQuery for
styling and functionality. I build that website back in January 2020, I didn't
have much web development experience at the time. But I was keen to learn and
build something. I guess some things never change ;).
This website is build using
Deno,
Fresh and
TailwindCSS, I
am quite interested in the development of Deno and their web framework Fresh,
although I don't think it is suitable for big production projects. Smaller
websites or services like this portfolio or my
Emby Recap project fit well in
the design of the product. The setup is quick and minimalistic and development
is fast, both in development speed and actual needed compute power. However, the
support of (third party) components and utilities is extremely limited in
comparison with a well established framework like
React or
even
Vue. Component libraries or even a different CSS
engine then
TailWindCSS isn't current available to
my knowledge. Kind of like the early Deno days, if you need something you have
to publish a package yourself.
The homepage is quite simple and doesn't use any special elements. But I wanted
to do something different for the Project / Blog pages. I came across
littlesticks' fresh-blog project
through the
Fresh Showcase where they were
rendering markdown files into HTML using
gfm.
I ended up doing something similar, implementing it in a way that each project
has its own data folder containing everything for that project. This includes
any images or other assets.
Design
We have a brand new design! Finally, no more Bootstrap, endless scrolling to
read projects and limited project customization due to the fact that everything
was displayed on the home page. This new design brings a lot of changes, most of
the styling uses
TailWindCSS, but the project pages
use a customized version of Github's
Primer styling.
This is mostly because of some technical reasons. But while developing the
website I started to like the readability and simplicity of the Primer styling.
Unlike the previous website, I actually designed (part) of the website before
coding it. I used
Figma to design the home page, I
didn't end up designing the project pages, but I copied some elements of the
homepage while all headers, paragraphs and images are mostly using Primer
styling. The illustrations seen on the home page of the website are made by
Lukasz Adam, who provides free
illustrations for personal and commercial use. I am by no means a designer,
especially not for illustrations, so I am very happy that was able to use these
illustrations.
Purpose
As you can see, the website has changed a lot. But why did I change it? Well, as
mentioned in previous "legacy" posts, changing the design and used technology of
the website has been on my mind since July 2021, I wanted to use some new
technologies that I actually use in my day to day life. In April of 2022 I also
came to realize that I wanted to be able to write longer, more detailed
projects. Something that the previous website was never meant to do.
This website, like the one before, is a fun exercise for me. Not necessarily
from a technical standpoint, but more from a writing standpoint. As you might
know I primarily speak Dutch, so writing down my projects in English is a fun
and meaningful way for me to develop my English writing skills. In addition to
that, I have discovered that having a history of my project is fun to look back
on. And it is a great way to show my skills to others.
Conclusion
The website has changed a lot, and it is bound to change some more. I still have
to add a section showing my experience and skills, but I am not sure how I want
to do that yet. I am excited to see how this website will develop over time.
Legacy Posts
Well, here we are, with a dilemma. I have a bunch of old project posts from the
old website. Which don't fit into the new design at all. But of course I don't
want to delete them. i have created a special project post for these legacy
posts. You can find them
here.
Created: December 30, 2023
Last edit: December 30, 2023
