thebuilder.dkDaniel Schmidt
Sections

Weak signal

Signal lost

Daniel Schmidt

Frontend engineer working on the difficult parts between product, design and engineering.

I work across frontend architecture, accessibility, performance and developer experience, usually on large, long-lived web platforms.

The day job

At Charlie Tango, I lead frontend architecture on large websites and web applications, and I stay hands-on in the code.

My work covers frontend structure, CMS and backend integration, accessibility, testing and the tooling teams use to ship. I’ve also led and grown the frontend team and mentored developers across projects.

  1. 2026Viaplay Sport NewsSports newsroomUmbraco Awards runner-up
  2. 2025SundhedsstyrelsenPublic health
  3. 2024MDT+Clinical decision support
  4. 2023FeriepartnerHoliday booking
  5. 2022EDCProperty platform
  6. 2020VælgererklæringPublic service
  7. Earlier work includes Nike, Blue Origin, Vurderingsportalen, Dansk Erhverv and Sticks’n’Sushi, among others.

Built for Umbraco

Open source for the CMS behind most of that work.

  1. blur-placeholder

    Image placeholders generated once, in Umbraco.

    Generated when the image is saved, then handed to the frontend as a single string. Public requests do none of that work.

    Look insideDocsGitHub

  2. web-analytics

    Vercel and Plausible reports inside the Umbraco backoffice.

    See overall traffic and the numbers for the page being edited without opening another tab. It reads the analytics you already run.

    Look insideDocsGitHub

  3. @charlietango/umbraco-rich-text

    Umbraco rich text, rendered as React components.

    Renders the Delivery API rich text JSON as React, with a hook to swap any node or block for a component of your own.

    Look insideGitHub

Open source

I maintain react-intersection-observer, a React library downloaded around 20 million times a month.

Open source is where I turn recurring project problems into reusable tools. Occasionally, several million other people need the same thing.

  1. react-intersection-observer

    Tell a React component when it enters the viewport.

    A hook, a render prop, and a component over the Intersection Observer API. It reuses observers where the options match, and ships a test mock so tests do not need a browser.

    Look insideDocsGitHub

the whole look

Afterglow is the design system this page is drawn with: a terminal for the modern web, under CRT glass, in eight phosphor colours.

  1. afterglow

    Old-school terminal UI

    Phosphor green on unlit glass, a pink signal for the thing that is actually happening, hairline borders and no corner radius anywhere. The look this page is wearing, in eight colours.

    Look insideOpen AfterglowGitHub

RealmBinder

A campaign log and living compendium for tabletop RPGs.

I’m building a platform for recording RPG session notes and turning them into a connected record of the people, places, quests and clues that make up a campaign.

  1. RealmBinder

    Closed beta

    Every session, bound together.

    Write the session up the way you always would. What comes back is the campaign's cast, its places and its open threads, each one linked to the words that put it there.

    Look insideOpen RealmBinder

It’s a Unix system!

When I saw Jurassic Park back in 1996, the dinosaurs were cool. But not as cool as the “unix” file system, flown through in 3D to lock the doors. I have wanted to build one ever since.

  1. FSN

    Visualize and navigate your file system in 3D space.

    Point it at a folder and the files stand up in front of you, in the same arrangement every time you open it.

    Look insideOpen FSNGitHub

VECTIDE

Neon jet ski racing, right in the browser. Hit a wave flat out, flip it, and put a torpedo into whoever is in front of you.

  • MultiplayerSend your friends a room code and race up to ten on the same water.
  • PickupsTorpedoes, seeking torpedoes, sea mines, boosts, and a wave to throw at whoever is behind you.
  • TricksHold jump, let go on the crest, and flip.
Play VECTIDEGitHub

Schmidt’s Arcade

Say hello

Based in Copenhagen. Questions about the work, open source or a difficult frontend problem? Write to me.

react-intersection-observer

Is this element in view?

const { ref, inView } = useInView({
  threshold: 0.5,
})

The frame is the root and the dashes are rootMargin. The mark on each element is threshold: that much of it has to be inside before it lights, and the plate counts the ones that are.

Published 2 May 2017, over an IntersectionObserver that browsers had only just shipped and nobody had wrapped for React yet. 5k stars and 20M downloads a month later, all of it organic.

Read the docsGitHub

blur-placeholder

What do you show before the image?

{
  "src": "/media/hero.jpg",
  "placeholder": "LE7,[YNH9v-Un"
}

Nothing is uploaded. It never leaves this tab.

The work happens once, when the image is saved in Umbraco. A public request does none of it: the string is already in the payload, next to the URL. ~30 characters for a whole picture.

Read the docsGitHub

@charlietango/umbraco-rich-text

Type something

GitHub

web-analytics

How is the page you are editing doing?

/work/umbraco

It reads whatever the site already runs, Vercel or Plausible, and puts the figures next to the thing they are about. No second tracker, and no second tab.

Read the docsGitHub

afterglow

What if the whole thing was a terminal?

--phosphor: #86fadd;
--signal:   #ff5b82;

Those two colours are most of what you are looking at: phosphor for the screen, a pink signal for the thing that is actually happening. Buttons, dialogs and inputs are drawn in them, and so are the pieces only a terminal has - boot logs, LEDs, scanlines, glass.

Green is only the loudest of eight phosphors to pick from, and the theme runs deep enough that a component from somewhere else, dropped in untouched, comes out square-cornered and glowing like the rest.

Open AfterglowGitHub

RealmBinder

What happened last session?

session: The salt road

At the top is what actually got typed at the table. Underneath is the same session written up, with the words each entry was taken from lit where they stand, in the colour of what they became. Step through the sessions and watch the names come back.

A name that turns up again is the same record, not a second one, so by session fourteen the mill, the token and the ledger are one thing with three sessions behind it, not nine separate notes.

Open RealmBinder

FSN

What does a folder look like?

fsn ~/projects/fsn

Everything in the folder is standing on the floor, each one as tall as it is big. The pink ones are folders. Pick a name above to walk into one, and the floor you land on is drawn the same way.

The original is the thing Lex flies through to lock the doors in Jurassic Park, and it was real software before it was a film prop. This one opens in a browser tab, and you can point it at a folder of your own.

Open FSNGitHub

InvadersTaito, 1978

The formation never breaks.

Squadron

MDT+

A clinical tool for preparing and discussing cancer cases, bringing patient data and AI recommendations into the same workflow.

Frontend lead · 2024

MDT+ is used by doctors preparing for multidisciplinary cancer conferences, where specialists meet to review patient cases and decide on treatment.

A list of scheduled conferences, one marked as in progress and the rest awaiting patient input.
Conferences · A doctor's own conference schedule

I built the Next.js application used to create and prepare patients for those conferences. The interface brings the relevant clinical data together with recommendations from an AI model, so doctors can review both as part of the same discussion.

A conference agenda listing two patients with their age, treatment status and an AI prediction.
Patient list · Each patient carries an AI prediction beside their clinical status

The hard part was making a large amount of clinical information usable during a time-pressured conference. The AI recommendation is one source among many, so the interface keeps it in context and leaves the decision with the doctors.

The patient preparation form, beginning with CPR number and patient information fields.
Preparing a patient · The form runs on well past what fits here

I was responsible for the frontend architecture and implementation, working with complex healthcare data and the different states that come with real patient workflows.

MDT+ is now being introduced at several hospitals in Denmark, with further expansion planned outside Denmark.

Client
Center for Surgical Science
Scope
Frontend architecture, application development, clinical workflows and technical quality
Stack
Next.js, NextAuth, Tailwind CSS