I've been building in Notion for years now.
Not casually. Obsessively. 21 databases, cross-linked with DUAL relations, governed by 8 laws, maintained through 200+ Architecture Decision Records, and operated on daily by a fleet of AI agents that treat the workspace like a stateful knowledge graph.
For most of that time, the only people who could see the graph were me & my agents.
Now I can finally convey WHY + HOW it's such a useful resource to me + my agentic workflows, in an interface others can explore while learning a bit more about who I am, what I've done, and how I built those things.
And the best part is, this'll grow / expand as my personal knowledge graph grows as well.
The knowledge graph now has a window people can use:
an interactive, explorable visualization that renders my entire professional history as a network of connected nodes.
Jobs, projects, technologies, proficiencies, AI models. 400 nodes. 692 edges.
15 years of career history (from Obama White House Advance through pandemic nonprofit work to the Rivian/VW Tech Joint Venture), rendered as a force-directed graph you can drag, zoom, click, and collapse.
I didn't set out to build a portfolio visualization.
This was more to organize my work + personal life to make everything a bit easier & track what is important.
Find a way to store my tasks, work, personal, and history + what/how I do it all in one place so I don't have to reinvent the wheel across 45x different collaboration / task-tracker / productivity tools.
The visualization is what you can get now that AI-driven front-end development unlocks a faster build time for such a website.
Before tools like Cursor and Claude Code, I could never justify the effort it would take to pipe all this in via my Notion, safely without leaking credentials or secrets, and in a stable way that scales.
Now that I've pointed Gatsby at my Notion workspace & told it to render the relations, and discussed / brainstormed / attacked this goal bit by bit (an old boss used to say "eating the elephant one bite at a time,"), this has finally shipped.
This kind of unlock, finally being able to ship what I've envisioned in my head for so long but never had the bandwidth to produce on my own, is part of why I think a lot of developers are so excited about AI, despite all the (major) caveats, drawbacks and exaggerated flamboyant hype.
The graph is the resume
A traditional resume is a list. A knowledge graph is a web. That matters a lot to me because it bridges my past personal + work background across fine art, visual disciplines, and through a myriad of domains, quite well.
To me, here, the medium is the message.
I like being able to ship this because - well, let's be honest we're all a bit vain - but more because I'd rather share THIS with anyone trying to understand my work history + ability vs. a tired LinkedIn profile or Resume.
This - to me - an interactive interface that communicates visually, interactively, and via the very tools + frameworks I callout in my work history - works better for me than a tired LinkedIn profile or Resume.
Click on my Senior IT Solutions Engineer role and the graph collapses to show only the nodes connected to that role:
35 technologies I currently use daily, the discrete projects I've shipped that I am showcasing in this role, the proficiencies I exercise in the day-to-day work, the AI models in my toolkit.
Click on just Terraform and you see the projects where I've used it, the other technologies it connects to, the Work History roles where it was relevant.
Click on a blog post and you see which technologies that specific blog post references & which projects the blog post itself relates to.
Every node is reachable from every other node through the edges.
That's not just a gimmicky visualization trick.
That's the actual relational structure of my Notion workspace. The graph on screen is a 1:1 projection of the DUAL relations between my databases.
It's also a fabulous HUMAN expression of what can make LLMs / AI systems so magical (if used well, & clear-eyed); the neural nets inside of LLMs are modeled after neurons, as we've heard explained over and over.
And to be sure, the vast multidimensional vector spaces of LLM baseline training sets are more complex than this, and so are VectorDBs.
However, this structure begins to make accessible what is so OBTUSE to so many who are just starting to experiment with AI systems, which is an unfortunate consequence of much of the disjoined and dis functional hype conversations about tech & especially AI.
That has the impact of gatekeeping this entire field for a lot of people who have a wonderful intuition and talent for this domain, I'm hopeful we can demystify a lot about how these systems work more rapidly with proof-of-concept systems / interfaces and websites like this more often in the future with the help of AI.
I didn't just build a knowledge graph visualization & then blast it with random data. I spent quite a few years building a rigorously-connected Notion workspace, had an idea about how to visualize it (this is what I was doing in my head to keep it organized anyway), and then worked with Claude Code & Cursor to build a pipeline and pointed Gatsby at it. The system is the product.
How it actually works
If you've read my post about building a headless CMS with Notion & Gatsby, you already know the pattern: Notion is the backend, Gatsby queries it at build time via GraphQL, Netlify serves pure static HTML. No runtime API calls. No server. Zero.
That's the same build cycle we had for our custom headless Shopify Storefront with Contentful as the CMS at Project N95.
See what I mean? There's another node connection in my job history right to THIS personal project.
That's what a knowledge graph gets you.
The knowledge graph visual interface extends that same architecture as Project N95 used to - at build time - construct the catalogue of masks & covid-19 tests.
We used it so we could decouple engineering management of the shopping experience from the supplier / catalogue management by different teams. We could improve the experience and not need to wait on suppliers. Suppliers could add or remove products and get them served up at next build time.
Here, at build time, Gatsby queries four Notion databases:
- Work History: my career timeline, from Bell Clerk to Senior IT Solutions Engineer
- Projects: deliverables I've shipped, from Project N95's headless CMS to the Gemini CLI security bug (a P1 I filed on Google's 95k-star repo that triggered an org-wide tool disable)
- Technologies: 318 tools & platforms, categorized and roadmapped
- Proficiencies: human capabilities, rated L1 through L4
The DUAL relations between these databases ARE the graph edges.
When a Project record links to three Technology records & one Work History record, that's four edges in the graph.
Multiply that across hundreds of records and you get 692 edges; every one of them reflects a real relationship I've deliberately maintained in Notion.
The visualization itself uses a force-directed layout.
Nodes repel each other like magnets while edges pull connected nodes together.
Clusters form naturally: my DevOps tools group together, my AI stack clusters, my political career forms its own constellation.
You can see the shape of a career without reading a single label.
The visual graph conveys my career experience + interests visually and intuitively, while also conveying my personal affinity for knowledge graphs & vector DBs by the medium alone, even if you discount the propensity of AI nodes in my graph.
The non-traditional path
I'm not a classically-trained engineer.
I didn't study computer science.
I don't have a CS degree.
I have a political science background & a career that went from campaign field organizing to White House Advance to pandemic nonprofit operations to cloud engineering.
Politics is itself very much a network graph to advance legislation or major initiatives, so the network here felt intuitive, but here, in this interface, I'm focused on proficiencies, technologies, and project histories, not people or equities as in politics.
The knowledge graph doesn't hide my interdisciplinary background.
It celebrates it, and the graph telegraphs HOW + WHY that can be a benefit, not a drawback, and how my background informs how I think about platform engineering, cloud infrastructure, engineering, systems design, microservices, automations, databases, data science, and more in my more technical roles.
Look at the full graph and you'll see two distinct clusters connected by a bridge.
- On one side:
- On the other:
The bridge between them is Project N95 (the pandemic nonprofit where I went from Operations Coordinator to Chief of Staff, from building discrete Operations Team Airtable infrastructure to shipping a full end-to-end Glassdoor replacement in Airtable, technology roadmap planing, SRE support, and Engineering Team leadership).
That bridge is one of the most interesting parts of my graph.
It's also the part a traditional resume would either hide or awkwardly explain in a "Career Summary" paragraph that nobody reads, and which AI systems reading a cover letter or staid resume overlook.
In a graph, it's just visible. Click around for a few minutes and the shape of my career comes through in a way a LinkedIn profile never could.
The edges exist.
The path from Obama White House to RVTech goes through specific projects & tools, and you can trace that lineage yourself.
The substrate IS the pipeline
The Notion workspace that produces this visualization is the SAME workspace I use to:
- Store 200+ Architecture Decision Records governing my AI-driven infrastructure
- Write & publish blog posts (including this one)
- Feed context to every AI agent session I run across Cursor, Claude Code, & Gemini CLI
The knowledge graph isn't a separate thing I built to showcase my work.
It IS my work.
The same exact databases that help me stay organized ARE the databases that Gatsby queries to render the visualization.
The same DUAL relations BETWEEN separate Databases (Airtable and SQL stans will see what I mean here) that help my AI agents discover context in real time are the edges you see on screen, and they are the bridges BETWEEN various clusters.
For example, at Rivian VW Technologies, I've written more than 250 technical articles in my org's Confluence.
My Context Engineering piece hit 301 views & 72 unique viewers, making it the #1 article org-wide.
That article exists because I understand how to structure information for both human & machine consumption; using AI to build out NotebookLM-powered visuals to amplify the content and convey complex information about Agentic Engineering, Hooks, Prompt Engineering, Context Engineering, and even more basic explainers for how to use Gmail Filters or Google Calendar booking pages.
The knowledge graph is the same principle, rendered visually.
This is what context engineering looks like when you take it seriously and treat it like Cloud Engineering or Data Science (it is both of those things).
Not just crafting prompts, but CLEANING your data.
Building the substrate & backend for your agents that makes every prompt better because the context already exists, already connected, already maintained.
The governance that makes it real
Anyone can dump data into a graph database & render a force-directed layout.
What makes THIS graph trustworthy is the governance behind it.
My Notion workspace has a half-dozen or so governance laws.
The most important one:
- NEVER use a multi_select field for data that exists in another database.
- ALWAYS use a DUAL RELATION.
Sounds like pedantic schema hygiene.
A multi_select field that says Skills: ["Python", "React", "Terraform"] is a frozen label. It doesn't link to anything.
It can't be traversed.
If I rename the Technology record from "Terraform" to "OpenTofu" next year, the multi_select string stays frozen as "Terraform" forever. That's not a graph. That's a lie.
A DUAL relation that points to the actual Python, React, & Terraform records in my Technologies database? That's a live edge. Rename the record & every connection updates. Add a new property to the Technology record & every connected Project can access it. The graph is alive because the relations are real.
I learned this the hard way.
Previous AI agent sessions created multi_select fields with hardcoded employer names & skill labels instead of proper DUAL relations.
I call this "AI-slop" and I've spent months building enforcement systems to prevent it from happening again.
Without governance, agents will cheerfully vomit frozen text labels into your schema & call it architecture.
(If you want to go deep on why markdown rules files are theater & what actually enforces agent governance, Part 1 of my enforcement series covers the hooks + validators + guard YAML architecture that keeps my agents honest.)
What you're actually seeing
When you visit the knowledge graph, you're seeing:
| Element | What it is |
| 400 nodes | Every job, project, technology, proficiency, & AI model in my workspace |
| 692 edges | The DUAL relations between them (every edge is a real Notion relation) |
| Westworld FUI | Because if you're going to build something this ambitious, lean into the aesthetic |
| Subgraph collapse | Click any node & the graph filters to only its connections |
| Node inspector | Metadata, connection counts, & related content for any selected node |
| 14+ blog posts | Linked to their technologies & projects via the same DUAL relations |
The visualization updates every time the site rebuilds.
Add a new project to Notion, link it to technologies & a Work History role, trigger a build, and it appears in the graph.
No manual data entry into a separate system.
No export/import pipeline.
The CMS is the graph is the organizational system is the content pipeline.
Why I built this
Partly because I wanted a portfolio piece that actually demonstrates what I can do, not just describes it.
Anyone can write "proficient in Kubernetes" on a resume.
A knowledge graph that shows Kubernetes connected to 6 projects, 2 Work History roles, 3 related technologies, & a roadmap status of "Current" tells a richer story.
Partly because I believe the infrastructure you build to organize your work is a first-class engineering artifact.
My Notion workspace has more thought, more governance, & more architectural discipline than most production codebases I've seen. It deserves to be visible.
But mostly because knowledge graphs are genuinely powerful & most people haven't seen what one looks like when you build it from real data instead of a toy example.
This isn't a demo with sample nodes.
It's 15 years of my actual career, organized in a system I use every single day, rendered as an interactive experience you can explore.
The tools are all open: Notion for the backend, Gatsby for the build, Netlify for hosting, React for the UI.
The secret isn't any particular technology. It's the discipline of maintaining real relations between real records over real time.
That discipline compounds.
And this graph is what compounding looks like.
Related reading: Building a Headless CMS with Notion + Gatsby | ADR-First Development | Notion as Context Pipeline | Hooks-Based Enforcement for AI Agents
John Click is a Senior IT Solutions Engineer. He writes at johnclick.ai & johnclick.dev.
