// M05 — Blog index + post detail page const BlogIndex = ({ setPage, openPost }) => { const [cat, setCat] = React.useState('All'); const cats = ['All', 'Engineering', 'AI', 'Design', 'Payments', 'Studio']; const filtered = cat === 'All' ? POSTS : POSTS.filter(p => p.category === cat); return (
{/* Hero */}
The Atoms Journal · 47 essays

Field notes from active builds.

Engineering essays, post-mortems, and the occasional half-baked idea — written by the team while they're still close enough to the work to remember the details.

{/* Filters */}
{cats.map(c => ( ))}
{/* Featured */}
● FEATURED
openPost(filtered[0])} className="card clickable" style={{padding:0,overflow:'hidden',display:'grid',gridTemplateColumns:'1.2fr 1fr'}}>
JOURNAL · ESSAY №01
Featured {filtered[0].category} {filtered[0].read}

{filtered[0].title}

{filtered[0].excerpt}

{filtered[0].author}
{filtered[0].date.toUpperCase()}
{/* Grid */}
ALL ESSAYS
{filtered.slice(1).concat(filtered).concat(filtered).slice(0,9).map((p,i) => (
openPost(p)} className="card clickable" style={{padding:0,overflow:'hidden',display:'flex',flexDirection:'column'}}>
{p.category.toUpperCase()}
{p.category} {p.read}

{p.title}

{p.author.toUpperCase()} · {p.date}
{Icon.arrow()}
))}
); }; const BlogPost = ({ post, setPage, openPost }) => { const p = post || POSTS[0]; return (
{/* Hero */}
{p.category} {p.read} {p.date.toUpperCase()}

{p.title}

{p.excerpt}

{p.author.split(' ').map(w=>w[0]).join('')}
{p.author}
{['ENGINEERING LEAD','AI ENGINEER','BACKEND LEAD','PRODUCT DESIGNER'][POSTS.indexOf(p) % 4]}
{/* Hero image */}
{/* Body */}
{/* TOC */} {/* Article */}

Most rewrites die. Of the four I've personally been through, two shipped — and one of those shipped 11 months late. The other two were quietly killed when someone calculated how much it had cost to not ship features for a year.

When this client came to us, the codebase was 14 years old: a PHP 5.6 monolith with parts written by people who had since become CTOs at other companies, then left, then become VCs. Page loads averaged 3.2 seconds. The team had stopped trying to add features and was instead just trying to keep the lights on.

Six rules

We rewrote it in 9 weeks. Here's what we did differently — and the rules we followed religiously.

RULE №01
Demo before merge, every time.

Every PR demoed to the broader team before it merged. Five-minute demos, async over Loom, with one engineer and the product owner watching. No exceptions. This sounds slow until you compare it to the cost of finding out three sprints later that what you built isn't what was needed.

Most rewrites fail because the team disappears into a branch for six months and emerges with something that's both 3 months late and not what anyone wanted. Demo-before-merge solves both problems by forcing weekly contact with reality.

Lessons

If we did it again — and we will — three things change. We'd retrofit the test harness in week 0 not week 4. We'd push back harder on scope creep in week 6. And we'd keep an "outside reviewer" engineer rotating in monthly who hadn't seen the code for two weeks, to catch the things we'd stopped seeing.

TL;DR
    {['Demo before merge','Feature flags from day 1','Ship one slice all the way through','Track velocity weekly','Pay down test debt early','Bring in an outside reviewer monthly'].map(r => (
  • {Icon.check()}{r}
  • ))}
{/* Right rail */}
{/* Author bio */}
{p.author.split(' ').map(w=>w[0]).join('')}
WRITTEN BY
{p.author}
Engineering lead at SolidAtoms. Writes about systems, builds, and the gap between shipped and finished.
{/* Related */}
KEEP READING
{POSTS.filter(x=>x.id!==p.id).slice(0,3).map(np => (
{openPost(np);window.scrollTo({top:0})}} className="card clickable" style={{padding:0,overflow:'hidden'}}>
{np.category.toUpperCase()}
{np.category} {np.read}

{np.title}

))}
); }; Object.assign(window, { BlogIndex, BlogPost });