Development of my portfolio with a new blog section and the application of the knowledge acquired during my React.js training

This is the portfolio you are currently looking to. I decided to completely redo my portfolio in 2021 for two main reasons:

  • the old portfolio no longer suited me in terms of design and technologies used (especially jQuery and bootstrap)
  • I wanted to add a blog section in order to regularly publish articles

Technologies used

This new portfolio was also the opportunity to put into practice some of what I learned during my React.js training. On the other hand, I wanted to use a framework and not directly React to take advantage of the SEO benefits brought by the use of the two main React frameworks (Next.js and Gatsby) and also of the performance benefits brought by the static site generation. After comparing Gatsby and Next.js, my choice finally fell on Next.js.

Regarding the backend part, my wish to have a blog section strongly involves the use of a headless CMS. My choice fell on Strapi, which was quite easy to set up and configure.

What this project taught me

First, through this project, I discovered Strapi and Next.js that I think I will reuse for other projects. This approach seems to me to be much more suited to the modern web in terms of performance, security, user experience and developer experience compared to solutions based on WordPress.
Specifically, the small challenges of this project were the use of the Matter.js library to create the HTML, CSS, JS and React logos that fall and interact with the mouse in the first section of the homepage and also the implementation of a dark theme which was a first for me.

Screenshot of first section of homepage

Future developments

In the future, I would like to set up the internationalization plugin offered by Strapi in order to provide an English version of my site. But that first requires a lot of translation work for all the content so it will not be done immediately.

[UPDATE 10 December 2021] As you are currently on the english version, you can see that the internalization feature has been implemented.