Blueprint · Content Architecture
Developer Lab CMS / Artifact System
A content system for managing projects, workbench notes, research papers, artifacts, blueprints, and timelines from typed data.
In ProgressMediumTypeScriptMDXContent LayerStatic RenderingInternal CMS
Overview
The content system behind this personal site: typed data files and reusable templates that make projects, workbench notes, research, artifacts, blueprints, learning maps, and timeline entries feel connected.
Problem
A developer lab can quickly become scattered if each page invents its own data shape. The site needs one place to update content, consistent cards, reliable links, related content, and coming-soon states that do not break.
Core users
- Site owner updating projects and notes
- Readers navigating between projects, blueprints, and field notes
- Future contributors or maintainers reviewing content structure
- Search engines and feed readers consuming structured metadata
MVP scope
- Typed content layer using TypeScript data files
- Reusable cards for projects, workbench notes, blueprints, research, artifacts, and timeline entries
- Detail templates for content that needs long-form rendering
- Tags, status badges, and related links
- Coming-soon artifact states without dead downloads
- Cross-section homepage guide
Non-goals
- Do not add a full hosted CMS before content shape stabilizes
- Do not create download links for files that do not exist
- Do not duplicate project summaries across many files without a reason
- Do not make every rough note feel like a polished essay
Core system components
- TypeScript data files for projects, workbench, blueprints, research, roadmap, timeline, learning, artifacts, and site navigation
- Route templates for index and detail pages
- Shared card components and status chips
- Related content blocks
- Tag and category taxonomy
- Build-time link checks or route generation
- Optional MDX renderer later
Suggested architecture
- Content layer: typed TypeScript arrays first, with a possible migration path to MDX or a CMS later.
- Pages: app router routes import the data and render static pages.
- Templates: detail routes use the same content structures to avoid one-off layouts.
- Links: internal related links point to real routes, and unavailable artifacts use Coming Soon states instead of fake hrefs.
- Deployment: static rendering keeps the site fast and avoids a database for public content.
- External APIs: none required for MVP.
Data model
- Project: slug, title, tagline, description, status, categories, tags, github, live, caseStudy, year, priority
- WorkbenchNote: slug, title, summary, date, tags, relatedProject, status, readTime, intro, goal, learnings, technicalNotes, openQuestions, nextSteps, relatedLinks
- Blueprint: slug, title, summary, category, status, difficulty, tags, overview, problem, users, mvpScope, nonGoals, components, architecture, dataModel, apiDesign, technicalChallenges, tradeoffs, security, scalingPath, observability, futureFeatures
- ResearchEntry: slug, title, topic, type, status, summary, tags, readHref, pdfHref, relatedProject
- Artifact: slug, title, type, status, summary, href, related
- TimelineItem and LearningTopic: structured entries for progression and study maps
API design
- No runtime API is required in the MVP.
- getProjectBySlug(slug) - resolve project detail data
- getBlueprintBySlug(slug) - resolve blueprint detail data
- getWorkbenchNoteBySlug(slug) - resolve note detail data
- getRelatedContent(tags, relatedProject) - future helper for automatic cross-links
- validateContentLinks() - future build-time integrity check
Key technical challenges
- Avoiding duplicated content across pages
- Keeping cross-links working as slugs change
- Adding related content automatically without noisy false matches
- Supporting coming-soon states cleanly
- Keeping content easy to update
- Preventing broken external links and missing internal routes
Tradeoffs
- Use TypeScript data now because it gives type safety and low ceremony.
- Avoid a CMS until the content model has stopped changing every week.
- Keep rough workbench notes separate from polished blog essays so the site does not flatten all writing into one style.
- Use static rendering before introducing search indexes or runtime content APIs.
Security considerations
- Avoid user-submitted content in MVP.
- Do not render unsafe HTML from content strings.
- Keep external links explicit and use rel='noopener noreferrer'.
- Do not expose draft private notes through public data files.
- Check artifact hrefs before adding downloadable files.
Scaling path
- Add MDX for long-form notes if TypeScript arrays become too large.
- Add search across projects, notes, research, and blueprints.
- Add generated feeds for workbench notes and blog posts.
- Add build-time link validation.
- Add an admin/editor surface only if content volume justifies it.
Observability
- Build output should reveal route generation failures.
- Future link checker can report broken internal and external hrefs.
- Analytics can show which sections readers actually use.
- Content freshness dashboard can flag stale roadmap or now entries.
Future features
- MDX support
- Site-wide search
- RSS/JSON feeds
- Automatic related content
- Artifact download registry
- Content linting