Skip to content
Submitted about 1 month ago

Blogr: responsive, accessible full-stack Angular blog app landing page

angular, sass/scss, typescript, node, mongodb
LVL 2
@akcumeh
A solution to the Blogr landing page challenge

Solution retrospective


What are you most proud of, and what would you do differently next time?

This is my third Angular project and the one where the framework finally stopped feeling like something I was fighting. Angular 21 with standalone components, signals, and OnPush change detection throughout. No NgModules, no zone-based anything. The SCSS is structured around BEM with a proper design token system, so that spacing, color, and typography decisions live in one place and the rest of the stylesheets just reference them.

More than the landing page, I'm proud that I didn't stop at the challenge brief. Blogr is a real product: there's an Express + MongoDB backend behind it, JWT auth, a paginated blog feed, post detail pages, and a post editor. The keyboard navigation and accessibility work was non-negotiable for me; so the page is fully keyboard navigable and every interactive element is reachable without a mouse.

If I could go back, I'd build a companion React Native app. The project grew into something people could actually use, and a mobile app was the obvious next step I kept deprioritizing. That's what I'd do in parallel from the start.

What challenges did you encounter, and how did you overcome them?

The challenge brief ends at a landing page. I kept going, which meant designing pages that didn't exist in the original mockup: the blog feed, post detail, auth flows, and editor. Borrowing the design language from the original challenge and extending it consistently was the real work. Every new page had to feel like it belonged to the same product without a designer handing me specs.

The biggest outstanding challenge is the post editor. Right now posts are created directly via the API. What I actually want is a proper in-app markdown editor so that Blogr works end-to-end as a publishing platform without ever touching a terminal. That's next on the list.

What specific areas of your project would you like help with?

How do I go about building a Markdown editor? :D

Code
Loading...

Please log in to post a comment

Log in

Community feedback

No feedback yet. Be the first to give feedback on Angel Umeh’s solution.

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord