Static HTML website with Angular Prerender

In this guide I will explain how to use Angular Universal to create a static HTML website, with dynamic content written in Markdown.

This is a double inception post for this website. It's the first post here, and it's about how this site is done.

When I was starting out this project I've had some ideas I want to achieve.

1. I want the site to be static HTML
2. I want to be able to write content in Markdown (like blog posts or whatever)
3. I want to use Angular Universal to perform the pre-render
4. I want to host the site on AWS S3
5. I want to have CI/CD setup via Github Actions
6. I want to be able to use live reload while developing

To be honest, the process was more nuanced then I've expected. In the end I've managed to accomplish all of the above, and learn a ton along the way.

You can checkout the code in this repository and use it to follow the tutorial, or fork it and use it as a starting point.

👉 https://github.com/mfrancekovic/angular-prerender-markdown

This series is broken into four parts:

• Part 1: Initial setup of Angular Universal
• Part 2: Dynamic Content with Angular Prerender
• Part 3: Setup AWS S3 for Website Hosting
• Part 4: Automate Deployment to S3 with GitHub Actions

🚀 Go to Part 1: Initial setup of Angular Universal.