The Content Insight Tool is a system designed to extract data from social media videos and present it in a dashboard. This dashboard allow users to compare videos from different brands, social media platforms and periods of time. Some insights are generated using machine learning.

The platform is a complex project that started before I joined Hub, around 2018. I was involved during my time at the company, where I was responsible for developing modules that retrieve the data, send it to the machine learning module (written in Python), store it in a database, and display it in the dashboard.

Each module utilized a diverse range of technologies:

• Dashboard: A Vue application built using the Quasar framework. The charts were created using ECharts.
• Backend: A Node.js Express server that connects to a Postgres database via Sequelize.
• Data Fetching Tool: A Node.js server that connects to several social media APIs to update the videos of the dataset. The API calls are cached in a MongoDB database.

This project was very exciting as it involved a wide range of technologies and significantly contributed to my growth as a developer.

Ahamo was a web app developed at Hub around 2019, designed to capture and save notes during a event.

Participants could add notes during a live event or while watching an on-demand video after the event had finished. Each note included a timestamp, providing valuable information for the event host. For instance, the app featured a graph showing the number of notes at each timestamp, making it easy to identify the event's highlights.

The application's backend was built with Go, while the frontend was developed using React.

This project was particularly interesting, as it was my first experience with Go and React. Go was especially a significant challenge since, at that point of my career, I was more used to dynamically typed languages.

Additionally, users could attach photos, audio or video recordings to their notes. Determining the best way to store this type of data was another challenging aspect of the project.

Around 2022, Hub underwent a brand refresh. Although the project was outsourced to an external agency due to my full-time commitment to the Content Insight Tool, I took over once the development was completed. My responsibilities included fixing bugs, deploying the site, and mantaining it by creating new pages, updating styles, and adding new functionalities.

Working with unfamiliar code added a layer of complexity to the project, making it occasionally challenging. However, this project provided an excellent opportunity to learn new methods of developing WordPress sites.

The website was developed around 2020 to align with Hub’s new brand guidelines, but was discontinued after the brand refresh of 2022.

Built using WordPress, the theme was created from scratch, challenging me to deepen my understanding of the framework and CSS. Additionally, the forms needed to be submitted to HubSpot, which presented an interesting challenge. This integration was achieved through the WordPress REST API.

Around the year 2020, Bombora was in the process of a brand refresh too, leading to the development of a new website to align with the updated guidelines.

The Bombora website project was similar to Hub's 2020 rebranding: it was developed using WordPress with a theme built from scratch. This project helped me learn more about the framework and CSS.

In my free time, I'm an indie game designer and developer, publishing games under the name 'Paradnight Studio'.

Since I'm also a web developer, it made sense to create a website for the studio. The website is fairly simple, as I've only published one game and a few experimental projects. I designed it on Figma and reused much of the code from my portfolio website to build it.

After completing Jonas Schmedtmann's Ultimate React Course, I wanted to create a React site from scratch to showcase my React skills. To do this, I developed a website that receives data for a Steam game and generates an image of its Steam widget.

Typically, the Steam widget is added to a site by embedding it in an iframe, but some websites don't allow this. Using a screenshot of the widget is a workaround, and my website simplifies this process.

I started this project to address a specific need, which added to my motivation. I also took this opportunity to refresh my React and Test-Driven Development (TDD) skills, making the project both interesting and rewarding.

Learning Tailwind was particularly enriching, as I had heard about it but never used it in a project. Creating a website without writing any CSS was a paradigm shift and helped me learn different approaches to web development.

After finishing my job at Hub, I decided to take courses to learn and improve some skills:

• UX/UI design
• Figma
• Three.js
• Shaders

The portfolio website that you are looking at now is the result of learning these and other skills:

• First, I designed the portfolio in Figma to visualize the website's look and feel. I created a wireframe to outline the site’s flow and, once satisfied with the result, moved on to creating the UI design.
• During the UI design process, I decided to use Three.js to showcase my skills. I created an animation using Three.js and shaders, which I then used as the website's background.
• I had always wanted to use a Server-Side Rendering framework for Vue, so I used Nuxt for the portfolio. Although the learning curve was steep initially, as it requires rethinking some aspecs of how Vue works, the overall experience was enriching.

This project was quite interesting as it allowed me to learn skills I had been eager to acquire. It significantly advanced my developer career by providing me with a broader toolset to tackle future programming challenges with confidence.