My Experience Building a Headless WordPress with Angular (Personal Perspective)

Intro

I recently had the opportunity to build a real website using WordPress as a headless CMS and Angular as the frontend. Going into it, I had the general idea of combining the power of WordPress for content editing with the flexibility and performance of Angular for the UI.

But let me tell you: it’s one thing to read about headless CMS setups and quite another to actually build one from scratch. This post isn’t a tutorial — it’s a reflection on how it really went, what worked, what got messy, and what I’d do again.

Getting Started

I decided to use WordPress because it’s something clients are comfortable with. They don’t need to learn a new tool to manage content — and with plugins like ACF and CPT UI, I was able to shape the backend in a way that made sense for their needs.

The frontend, on the other hand, was 100% Angular. I love how much control I get with it, especially paired with Tailwind CSS. Styling things became quick and consistent, and the structure was solid from the beginning.

Unexpected Challenge: The Content

The client didn’t send me content in an editable format — no Word docs or spreadsheets. Instead, they sent me PowerPoint presentations converted to PDF, packed with text, diagrams, and corporate slides.

So my first “development” task was… parsing slides. 😅

I had to extract the actual website content manually and restructure it into something usable, and then map that into ACF fields on the backend.

What Actually Helped Me

Some things that really saved me time and headaches during the process:

ACF + CPT UI: With these plugins I could give the client a clean and intuitive way to manage even complex sections like services or certifications.

RxJS in Angular: I used shareReplay to cache content so the app wouldn’t make repeated API calls on every route change.

Tailwind: I honestly don’t want to go back to writing raw CSS. Tailwind made the whole UI much easier to scale and keep consistent.

EmailJS: I didn’t want to set up a backend just for a contact form, so I used EmailJS to send form data directly to the client’s inbox.

Real-World Problems (And What I Did)

Here are a few moments that stood out:

The client didn’t know WordPress was "headless" — I had to explain that they’d only see the backend and not the frontend changes.

Organizing messy content became a full content strategy job.

Optimizing API performance was a challenge with Angular, but RxJS helped a lot.

SEO without SSR was tricky. I didn’t go with Angular Universal, but I made sure to use Meta and Title services, clean routing, and optimized images to help Google do its job.

Final Thoughts

This wasn’t a perfect build. There were moments of doubt, of unexpected client requests, and of technical limitations. But it taught me a lot.

Sometimes you don’t need a “perfect stack” — just one that works for the project and for the people involved. WordPress + Angular + a bit of patience ended up being a great combo.

Would I do it again? Definitely. But now I know what I’m walking into 😅