Skip to content

kevin-dev.com

July 20265 min readOngoing

Le siteCode source

This is the site you’re reading right now: portfolio, blog, résumé, contact form, and behind it a full admin area so I can manage everything myself. It’s the third version, and the first I built without following a tutorial.

The two before it

The first one dates from 2021. HTML, CSS, a bit of JavaScript, all followed step by step from a video tutorial. Technically it stays modest, but it’s very concretely what taught me those three languages: reproduce, break, understand why it broke, start again. I even hosted the projects I’d built until then in it, a Java minesweeper written during a course at technical college and a small platform game made in secondary school, straight in the repository.

The second one, in 2022, still followed a ready-made template, but I was starting to move away from it. I added interactivity: a mobile menu, a skills accordion, tabs for my education, a project carousel, the nav link highlighting itself as you scroll. It served me for nearly four years, and I maintained it until recently.

Both were static. To change one line, I opened an HTML file, edited the text by hand, pushed to Git and waited for the redeploy. That works when you update your résumé once a year. It stops working the moment you want to write.

What I actually wanted

Somewhere I could add a project, write an article, fix a sentence, from an interface, without touching code or redeploying.

That’s the starting point of this version, and it’s also the part that took the most work: the part nobody sees.

The admin area

The back office covers about a dozen sections: projects, articles, talks, technologies, categories, media, contact form messages, legal pages, home page content, security, sessions, and a dashboard.

The content editor offers two modes over the same Markdown source. A visual mode to write normally, with tables, images and lists, and a raw mode with syntax highlighting when I want to see exactly what I’m writing.

The back office editor, with the switch between text mode and Markdown mode

Content is stored twice, as Markdown to stay readable and recoverable, and as pre-rendered HTML so the display isn’t recomputed on every visit. Rendering goes through unified, remark and rehype, with code highlighting.

Uploaded images are converted to WebP and generated in several sizes, so a page serves the right variant rather than a two-megabyte image.

Access is protected by two-factor authentication, and the contact form sends its notifications through a mail gateway running on my own server.

A style that’s finally mine

After two versions built on templates, I wanted a design I could defend line by line.

The result is deliberately plain: light by default, very airy, a single accent colour, a deep red, and three typefaces with clearly separated roles. Nothing superfluous, no animation that draws attention to itself, no concept design. The tone of the text follows the same logic, factual rather than promotional.

It’s a deliberate stance: the site should make you want to read what’s in it, not admire its layout. The fonts are self-hosted too, like everything else.

On the technical side

The site runs on AdonisJS, largely because I wanted to try something else. I’d already done several projects with Next.js, and I was curious what a more classical framework felt like, with its ORM, validation, sessions and file storage provided out of the box.

The part I take away is the bridge between server and interface. The front end is React, but there’s no API between the two: controllers hand their data straight to the React page, with types shared end to end. No API layer to maintain, no duplicated types, one source of truth.

Beyond the comfort of writing it, what convinced me has more to do with what surrounds the framework. The documentation is clear and current, which isn’t that common. The official building blocks cover most of what a content site needs, so I depend on few third-party libraries, and each one I add is one more thing that can age badly. The maintainers announce their choices and version bumps ahead of time, the community is small but present, and answers can be found. For a site I intend to keep for years and evolve without rewriting it, that stability matters more than novelty.

Managing it all myself

This is the first of my sites I administer end to end. The previous ones lived on platforms that handled everything for me, which was comfortable, but I couldn’t see any of what happened behind the scenes.

This time I wanted my own server, my own services, my database, my backups. Deciding where things go and knowing how to bring them back up when they fall over. This site was well suited to that: simple enough not to drown in it, complete enough to have to look after a database, files, mail delivery and visit statistics. It was a good place to start, and nothing here depends on a service I don’t control.

Enjoy your visit

I hope you like the site and find what you’re looking for. If you’d like to get in touch, ask a question or just say hello, the contact page is there for that.

Enjoy the read.

Technologies used