Website Changelog

Last updated on February 5, 2026

v3.0: React and Next JS

2026-02-05

Motivation

The main motivation for this update is to get more comfortable with the most popular frontend framework, React, and its server-side rendering companion, Next JS.

React also offers a number of advantages over Hugo:

  • Easy creation of interactive user interfaces thanks to great state management
  • Better code structure and reusability thanks to the component-based architecture
  • Better performance for interactive content
  • Great Ecosystem of libraries and tools

Changes

This update turned into a major overhaul of the website, with the entire code being rewritten in React.

For styling, instead of Bootstrap I now use Tailwind CSS and Shadcn UI, which are more modern and customizable.

The website was redesigned, and more features can be found especially in the recording page.

v2.1: Static files and removal of the backend

2023-10-03

Motivation

Heroku (my backend hosting provider) decided to remove the free plan. So, in order to save costs I had to get rid of the backend which, being a programming exercise, was mostly unnecessary anyway.

Changes

So what I did is to turn the recordings into static files, which makes them less flexible to be queried, but reduces loading time to nothing.

Furthermore I had to remove the highscore table in the LEDs game as it also requires the backend. The game is still playable. It has been moved to the Informatics section as I don't think I will be adding enough games in the future to justify a dedicated games section. Besides, this website is rather supposed to be about me and what I do than a games portal.

v2.0: Hugo SSG

2022-06-28

Problems so far

Altough the site seemed rather complete, there were a few under-the-hood issues that affected the performance (loading time) and the development flow:

  • In the free plan from Heroku, the server is shut down after some minutes of inactivity, causing a way too long initial response time for the next request.
  • Pages such as "About me", that don't contain live data, were server-side rendered on every request. This was slower than rendering the page on compile time as Static Site Generators do.
  • HTTPS was unavailable because of limitations in Herokus free plan on custom domains.
  • The frontend code was split over two different repositories, one with the dynamic flask app and another one containing the static "cs" section. This meant that if I wanted to change let's say the text color, I had to do double work and programmers hate that.
  • Content writing and editing wasn't very comfortable in the flask app, as most of it happened in raw HTML and the translations could only writtten in .po files, which had to be generated with extra scripts.

Changes

Most of these issues were adressed by merging the frontend code into a single Hugo project. Hugo is a powerful Static Site Generator. The pages are now compiled once and served quickly via Netlify. The content is comfortably edited in the Markdown language with optional HTML extensions and the translation process is more straight forward. The code is available on my Github repository.

The dynamic content is requested via JavaScript and served by the flask app which has been radically reduced to a simple API. The delay due to the on-demand launch of the server is still present, but only noticeable in the music section, where it takes a bit longer to load the available composers.

v1.0: Initial version

The initial version of this web site consisted of:

  • An application written in python 3 with the libraries Flask, Jinja y Werkzeug
  • A database with tables for users, videos and the results of the games
  • Multiple HTML files that describe the structure of every page
  • CSS documents, made to the define the style of every HTML element (I used Bootstrap in many cases)
  • JavaScript files that add some interactivity to the pages

The core of this site is the Flask-app, which is cloud-hosted by Heroku. When a user makes a request to the app, it sends the required HTML, CSS and JS files. Some contents however are dependent of a database, since they change frequently and it's the only way to store them.

Thanks to th Jinja library, that data can be dinamically integrated into the HTML files when sent to the user. In adition to that, the AJAX tecnology allows the exchange of information between the server and the browser of the user without need to reload the page, which can be seen when selecting a composer in the music section.