Back to Home
Engineering • 2025-11-09

Learn how I built a blogging system using Markdown, Angular, and Git instead of traditional CMS platforms. Exploring the pros, cons, and architecture behind this approach.

Building a Blog Without a CMS: A Modern Alternative

When I set out to redesign my portfolio website, I faced a common developer dilemma: should I use a traditional CMS like WordPress, Contentful, or Sanity, or build something lightweight and custom? After experimenting with various approaches, I landed on a solution that has proven to be elegant, performant, and developer-friendly. In this post, I'll walk you through how I built a blogging system without a traditional CMS and share the lessons learned.

The Problem with Traditional CMS Platforms

Most CMS platforms are powerful but overkill for a personal portfolio. They require:

  • Backend infrastructure to manage
  • Database administration
  • Regular security updates and maintenance
  • Monthly hosting costs
  • Steep learning curves for non-technical users

For a developer portfolio, these requirements seemed excessive. I needed something simpler.

My Solution: Markdown + Service-Based Architecture

Instead of a traditional CMS, I opted for a hybrid approach:

  1. Blog posts as Markdown files stored in src/assets/blog/
  2. A TypeScript service that manages post metadata
  3. ngx-markdown library for rendering
  4. Angular routing for dynamic pages
  5. Git as version control (and backup)

How It Works

Step 1: Write in Markdown

Each blog post is a simple .md file:

src/assets/blog/my-post.md
# My Post Title

This is my introduction.

## Section 1

Content here...

## Section 2

More content...

Step 2: Register in Service

Add an entry to blog.service.ts:

{
  id: 1,
  slug: 'my-post',
  title: 'My Post Title',
  category: 'Engineering',
  date: '2025-11-07',
  description: 'Short summary for the blog list.',
  markdownFile: 'assets/blog/my-post.md'
}

Step 3: Deploy

Commit to Git, push to main branch, and Netlify auto-deploys.

The Architecture

Blog System Flow:
┌─────────────┐
│  Markdown   │
│   Files     │
└──────┬──────┘
       │
       ▼
┌─────────────────┐
│ Blog Service    │ ◄─── Manages all post metadata
│ (TypeScript)    │      (id, slug, date, etc)
└────────┬────────┘
         │
         ▼
┌──────────────────────┐
│ Blog Components      │
│ - blog.component     │ ◄─── Shows latest 3 posts
│ - blog-all.component │      Shows all posts
│ - blog-detail        │      Shows full post
└──────────────────────┘
         │
         ▼
┌──────────────┐
│  ngx-markdown│ ◄─── Renders markdown to HTML
│  Library     │
└──────────────┘

Pros of This Approach

Zero Backend Required

  • Everything runs on the client side
  • No server to maintain or secure
  • No database to manage
  • Reduced attack surface

Version Control Everything

  • All blog posts are in Git
  • Full revision history
  • Easy rollbacks if needed
  • Collaborative editing via GitHub

Developer-Friendly

  • Write in Markdown (what developers know)
  • Use your favorite text editor (VS Code, Vim, etc.)
  • Format as code (syntax highlighting, linting)
  • Type-safe with TypeScript

Fast Performance

  • Static files = instant loading
  • No database queries
  • Optimized bundle size
  • Perfect Lighthouse scores possible

No Vendor Lock-in

  • Export all posts as Markdown anytime
  • Migrate to any platform easily
  • Own your content completely
  • No subscription fees

Cost-Effective

  • Free static hosting (Netlify, Vercel, GitHub Pages)
  • No CMS subscriptions
  • No database hosting costs
  • Scales infinitely at zero cost

SEO-Friendly

  • Server-side rendering possible with Angular Universal
  • Meta tags fully customizable
  • Fast load times = better rankings
  • XML sitemap generation is simple

Automatic Latest Posts

  • Service sorts by date automatically
  • Homepage shows 3 latest posts
  • No manual configuration needed
  • Add a post, it appears instantly

Cons of This Approach

No Visual Editor

  • No drag-and-drop interface
  • Requires Markdown knowledge
  • No WYSIWYG (What You See Is What You Get)
  • Not ideal for non-technical users

Manual Deployment

  • Must commit to Git to publish
  • Can't publish from a web dashboard
  • Requires terminal/Git knowledge
  • No scheduled publishing feature

Limited Features

  • No user comments (would need external service)
  • No analytics built-in
  • No user roles/permissions
  • No draft/publish workflow in UI

Search Limitations

  • Search functionality requires custom implementation
  • No full-text search out-of-the-box
  • Would need to implement client-side search

No Real-Time Collaboration

  • Can't have multiple users editing simultaneously
  • Must use Git for collaboration
  • Conflicts need manual resolution
  • Not ideal for teams

Image Management

  • Must manually upload images to assets/ folder
  • No image CDN integration
  • No automatic optimization
  • Requires file management discipline

Limited to Single Author

  • Designed for personal portfolios
  • Would need modifications for teams
  • No user authentication needed/built-in

Comparison: My Approach vs Alternatives

Feature My Approach Contentful WordPress Medium
Cost Free $489+/month Free (hosting extra) Free/Pro
Backend Required No Yes Yes No
Learning Curve Low Steep Moderate Very Low
Customization Full High High Limited
Performance Excellent Good Fair Good
Version Control Git No Plugins No
Scalability Infinite Depends Fair Excellent
For Portfolio Perfect Overkill Overkill Good

Implementation Tips

1. Organize Posts by Category

Create a category system in your service:

categories = ['Engineering', 'Leadership', 'Future Tech', 'Tools'];

This helps readers find content they care about.

2. Use Consistent Date Format

Always use ISO format (YYYY-MM-DD) so sorting works correctly:

date: '2025-11-07'; // ✅ Correct
date: 'Nov 7, 2025'; // ❌ Won't sort correctly

3. Create a Markdown Template

Make a template for new posts to ensure consistency:

# Post Title Here

**Category:** Engineering  
**Date:** 2025-11-07

Brief description or introduction.

## Section 1

Content...

## Section 2

Content...

## Conclusion

Wrap-up...

4. Use Descriptive Slugs

Make URLs readable and SEO-friendly:

slug: 'angular-state-management-guide'; // ✅ Good
slug: 'post1'; // ❌ Poor

When to Use This Approach

Use this system if:

  • ✅ You're a solo developer/writer
  • ✅ You want full control and ownership
  • ✅ Performance is critical
  • ✅ You prefer Markdown and code
  • ✅ You want zero maintenance
  • ✅ Building a personal portfolio

Don't use this system if:

  • ❌ You need a visual editor
  • ❌ You have non-technical team members
  • ❌ You need real-time collaboration
  • ❌ You require scheduled publishing
  • ❌ You need user comments
  • ❌ You're building a large publication

Lessons Learned

1. Simplicity Wins

The simpler system requires less maintenance and has fewer bugs. I spend more time writing and less time managing infrastructure.

2. Git is Powerful

Using Git as my content management system provides version control, backup, and collaboration features I didn't expect.

3. Static is Scalable

Without a database or backend, scaling is infinite. My site handles traffic spikes without cost or complexity.

4. Developer Experience Matters

Writing in my editor, using Markdown syntax, and deploying via Git feels natural to me as a developer.

The Future

This system works great today, but I'm considering:

  • Adding search functionality with Lunr.js
  • Implementing a commenting system via Disqus
  • Adding reading time estimates
  • Creating an RSS feed generator
  • Automating image optimization

Conclusion

Building a blog without a traditional CMS isn't for everyone, but for developers who value simplicity, performance, and control, it's an excellent choice. My approach eliminates unnecessary complexity while maintaining full flexibility and ownership of my content.

If you're a developer considering this path, I'd say: try it. The barrier to entry is low, and you might find it's the perfect fit for your needs.


Resources