BackProject
Portfolio Website (with CMS)

Portfolio Website (with CMS)

For some time, I have been wanting a personal website that can also act as my professional portfolio. However, since I was doing a full-time internship for a full-year (Jul 25 - Jun 26), I lacked the time and energy to build it. Initially, my top requirement is that the contents of the website are easy to manage so, using a CMS (Content Management System) is a must. My initial thought was go for a website builder like Webflow or Framer. However, not only some features required paid subscription but they are just never clicked with me. Most of the time, I find myself adjusting my content for the templates instead of the other way around. As I also have an experience with React, I began to looking for React-based frameworks. However, going for a custom-built website like React means a new problem, the CMS. The best part of using a site builder is probably having the CMS taken care for you.

The trade-offs probably are like these:

 Self-made (coding)Website Builders
Skills⚠️ At least HTML, CCS, and JS.✅ No prerequisites (drag and drop/low code interface).
Time✅ Substantial (at least weeks).✅ Days or even hours with templates.
Design✅ No limit (provides more personal experience).⚠️ Platform-limited.
SEO✅ Full control (meta tags, robots.txt, etc...).⚠️ Generally good but platform-dependent.
Security⚠️ Good luck with that.✅ Taken care.
Deployments⚠️ Full flexibility (more works).✅ Simplified (CMS, CDN, Domain included).
Ownership✅ You own everything.⚠️ Vendor lock-in.
Cost✅ Can be cheaper.⚠️ Predictable pricing but usually higher baseline.

Given the trade-offs, I still decided to code my own website. After some research, I decided to use React Router for the frontend and Strapi for the backend CMS. I decided not to use Next.js here because not only that its heavy but I also won't be using the backend anyway. So, this is the final stack:

  • Frontend: React Router v7
  • Backend: Strapi v5
  • Database: PostgreSQL

And for the deployments:

  • Frontend: Cloudflare Pages
  • Backend: GCP Cloud Run (Dockerize the Strapi app)
  • Database: Neon Postgres
  • Object Storage: Cloudinary

This setup virtually cost you 0$. Cloud Run is so cheap if you set the minimum instance to 0 for a low-traffic app (but the downside is cold start).

I found that building your dream website may costs you a great deal of time and effort. However, the satisfaction and the ownership are incomparable than any website builders can give.

Thank you so much for reading all this bs. This is my first time writing a blog/article so stay tuned for a better one ✌️.

⭐ Bonus tip: Neon has a database branching feature so we don't have to spin up a local postgres instance for further developments.