Hi there!
You have not only stumbled upon a website I’ve been long wanting to launch, but also its “blog”, which is fairly empty at the time of writing. This short post is here to mark the milestone of finally getting everything together to launch the 1.0 version of the site, with more content and features incoming sometime in the future. First, I wanted to talk about the whys and the hows of the genesis of this place.
Motivation
I do a bunch of things. As a PhD student, I research in the topics of network science, community detection and data mining. As a hobbyist, my main non-computer hobby is photography, but I also like to do computer things, like designing and developing websites and apps, and I experiment with everything: I dipped my toes into video editing, podcasting, writing, game development, mobile app development and much more.
I always wanted a central place to document my work, so it doesn’t just float around on Instagram, 500px, or GitHub. And finally, I believed to have to skillset to build a personal website on my own, and I’m really happy that it itself is a showcase of my skills. I have previously built a productivity timer app called Focustide, so it felt natural to use my skills to do something slightly bigger. This site supports dark mode (albeit for now, it only follows the system theme), becomes quite interactive on Chromium browsers (because they support view transitions), and is incredibly fast and fully responsive.
How it was made
While the code repository behind this site is not open, I want to share the technologies that made it possible to develop it. The list goes like this:
- Astro is the framework powering this statically generated website. I am making good use of its Content API, built-in image optimization, view transitions and everything else around it.
- Tabler Icons by Paweł Kuna provide the beautiful iconography that brings this site from “text only” to actually alive. I’ve used Paweł’s icons in FocusTide as well, and I can’t think of a better resource if you need icons for your project. Make sure to support him as well!
- Tailwind CSS makes my life a lot easier with its utility-first approach. It saved me a lot of time writing CSS, and its version 4 (alpha) with CSS variables is incredible! I use Tailwind for most of my projects as it lets me create the design from scratch while also imposing a system on me, and it’s quite performant and lightweight.
- Svelte is used to power the interactivity in the photo viewer. While what is done there could’ve been done in Astro itself, though I kept running into bugs where items randomly became un-interactive. I plan to use Svelte for more interactive items as it shortens the syntax needed to write components and it doesn’t bring along the weight of React or Vue at the same time.
What is to come
I plan to expand this site with both older and newer posts that include news about my projects, photography, and everything inbetween. Stay tuned!