Valery Melou
Articles
Date

Version 3 of my personal website

I spent some free time last week updating my personal website, three years after the last update. The new version is fully built using... Angular.

Tech stack

The previous version (v2.0.0), was built using Scully, a static site generator for Angular. Even though I enjoyed working with Scully, I really wanted to build the website this time using Angular and only Angular.

For this new version, I opted for a headless CMS approach to explore the capabilities of Angular Server-Side Rendering (SSR) and prerendering with dynamic content. Contentful, a platform I've admired for its flexibility, was the natural choice.

The tech stack for this version of my personal website includes:

The challenges

The main challenge I faced building this new version was with the prerendering. When prerendering an Angular application, the browser APIs are usually not available since Angular is executing the code on the server side. So you have to be very cautious about using browser objects like

.

To overcome this problem, I implemented an injection token for the

object and provided a server compatible version when the code is executed on the server. I will I'll delve deeper into this solution in an upcoming article.

Open issues

One ongoing challenge is optimizing build times with incremental builds. When I push code changes to Github, the whole website is rebuilt which is okay for now. But when I publish an article in Contentful, the whole website is still rebuilt. To reduce build times, I'm exploring solutions to trigger builds only for specific pages, such as those associated with newly published or modified articles.

Conclusion

Thank you for reading. You can keep browsing the website or check the code on Github. I'm always open to remarks and suggestions. If you would like to share your feedback with me, please hit me up on X and let's discuss there.