Deepthi's Reading

Clinical

041

The caregap-analyzer Story

Where the standards fall short

Lovable · React · Recharts · shadcn/ui

Edition #041 · 6 chapters · 6 min read

The caregap-analyzer Story

Where the standards fall short

TJC standards compliance dashboard summarising findings under 100%.

An ebook edition of the caregap-analyzer build journey: how it started, what actually happened, the conversations that changed the build, what broke, and what I learned. Written in plain English for readers with no technical background. Tools covered: Lovable, Charts.

Start reading Back to the library

Start here

What you'll understand by the end

Not mastery — understanding. By the last page you'll be able to explain these in your own words, even with no technical background.

•what Charts really is, and what it cannot do
•what Lovable really is, and what it cannot do
•the difference between what the AI does, what the tool does, and what I do
•why permissions and privacy matter once AI can act on your behalf
•where a real person's judgement is still necessary

The concept ladder — the order I actually learned things

I had an idea worth building

↓

I asked an AI to help me shape it

↓

I learned the AI could explain things but could not act outside the chat by itself

↓

I met the tools that actually do the work

↓

I learned how those tools are connected and permitted

↓

I built something real and watched it break

↓

I learned where my own judgement is still required

Chapter 01

Why CareGap Analyzer had to exist

Track 1 · My journey

A Joint Commission report is not hard to read. It is hard to hold. Each finding has a standard code, a description and a different score in every department, and by the fourth page you have stopped comparing anything. I wanted one surface where a standard and a department meet in a single cell.

Learning checkpoint

Before this chapter

I had a problem I could describe in a corridor conversation, but nothing I could hand to anyone.

After this chapter

I still did not know which tools to use, but I knew exactly who I was building for.

What changed my mind

The problem stopped being a complaint and became a specification.

Can you answer these?

?Can you state the problem in one sentence, without naming a solution?
?Do you know who is holding the screen when your product is used?

Chapter 02

Describing it before building it

Track 1 · My journey

I described the output, not the interface: every standard down one side, every department across the top, colour where compliance drops. What came back was a heatmap and a bar chart. The departments in the code are the real ones I was working with — PACU, TSC, Endoscopy — because a made-up department makes the whole screen unreadable as a test.

Learning checkpoint

Before this chapter

A blank project and a chat window.

After this chapter

The shape of the product was decided before a single deliberate design decision was made.

What changed my mind

I learned to treat conversation as a design tool, not as preparation for design.

Can you answer these?

?What is the one sentence in your own notes that decided the architecture?
?Are you describing outcomes, or dictating implementation?

Chapter 03

Building it: React, Recharts and a typed data file

Track 1 · My journey

The entire application is one route. All the content sits in tjc-data.ts, where a finding is an object with a standard code, a description, a score map keyed by department and the written detail. Recharts draws from that shape directly, and Embla puts the written findings into a carousel so an inspector's paragraphs are walked through rather than scrolled past. No database was involved at any point.

Track 2 · Learn with Deepthi

A heatmap

USED — evidence shows I used it

What did I just discover?: That a grid of colours answers "which department, which standard" faster than any table of the same numbers.
What is it, really?: A table where each cell's colour encodes its value, so the eye finds the outliers before you read a single number.
Think of it like this (analogy): A weather map. You do not read temperatures; you look for the red patch.
How does it actually work?: Each cell gets a score, the score is mapped to a colour scale, and the grid is drawn from that mapping.
Why did it matter to my project?: Because a Joint Commission report crosses many standards with many departments, and that is exactly a grid.
Where I used it: The department-by-standard compliance view on the dashboard.
What this tool cannot do: Colour shows magnitude, not cause. A red cell tells you where to go and nothing about why.

Track 2 · Learn with Deepthi

Typed static data

USED — evidence shows I used it

What did I just discover?: That putting real audit content in a typed TypeScript file, before any database, is a legitimate stage rather than a shortcut.
What is it, really?: Data stored as code, with its shape enforced by the compiler, shipped inside the app.
Think of it like this (analogy): A printed reference card. Fast, reliable, and you have to reprint it to change it.
How does it actually work?: An interface describes the shape of a finding; the file holds the records; the screens read them directly.
Why did it matter to my project?: It lets you test whether the information design works before committing to storage.
Where I used it: tjc-data.ts, holding every standard, score map and written finding.
What this tool cannot do: Nobody can add or edit data without a code change, and there is no history.

Track 2 · Learn with Deepthi

Carousels for long text

USED — evidence shows I used it

What did I just discover?: That written inspection findings get skipped when they sit under charts, and walked through when they sit in a carousel.
What is it, really?: A component that shows one item at a time from a list, with controls to move between them.
Think of it like this (analogy): Flash cards instead of a wall of text.
How does it actually work?: The list is held in state, one item is rendered, and the controls change which index is showing.
Why did it matter to my project?: Because qualitative findings are the part people actually need to read.
Where I used it: The detailed findings slides beneath the compliance charts.
What this tool cannot do: One-at-a-time hides the overview; you cannot scan the whole set at once.

Learning checkpoint

Before this chapter

I had screens in my head and a stack I had not yet justified.

After this chapter

A working product, and a much shorter list of things I believed without evidence.

What changed my mind

The stack became a means, not an identity.

Can you answer these?

?Could you rebuild your first screen in an afternoon if you had to?
?Which tool are you using out of habit rather than fit?

Chapter 04

The limit I built in on purpose

Track 1 · My journey

Static data has a cost and I paid it knowingly: there is no upload, no export, no login, and therefore no way for anyone else to add an audit. It also means the app shows one moment in time. It can tell you where you stand; it cannot tell you whether you are improving.

Learning checkpoint

Before this chapter

Something that worked in the demo and failed in real life.

After this chapter

A smaller, blunter, considerably more useful product.

What changed my mind

I stopped defending the first version and started measuring it.

Can you answer these?

?What in your build is complete but unused?
?What would you cut if you had to halve the time it takes to use?

Chapter 05

What the screen changed

Track 1 · My journey

The conversation moved from reading findings aloud to pointing at a cell. Once compliance per department is visible at a glance, the discussion skips the summary and goes straight to the two squares that are wrong.

Learning checkpoint

Before this chapter

A product that worked, and no clear evidence that it mattered.

After this chapter

A clear-eyed view of what the product does and does not fix.

What changed my mind

Success stopped meaning "it is built" and started meaning "it is used".

Can you answer these?

?What behaviour changed because your product exists?
?Would anyone notice if it disappeared tomorrow?

Chapter 06

What I would tell you before you start

Track 1 · My journey

Fix the shape of the information first, in a typed file you can edit by hand. If the shape is wrong, a database only makes the wrongness permanent.

Learning checkpoint

Before this chapter

You have read what happened. Here is what to take with you.

After this chapter

A method you can reuse on a completely different problem.

What changed my mind

The build became repeatable rather than lucky.

Can you answer these?

?What is your version of the short loop?
?What will you ship this week, even if it is embarrassing?

Appendix

Deepthi's Dictionary

Short loop: Describe, build, use, correct — repeated in hours rather than weeks. The core working method behind this build.
Second use: Whether someone opens the product a second time without being asked. The simplest honest measure of whether it works.
Conversation beat: A single line in a build conversation that changed a decision. Collected, these form the real design document.
Worst day design: Designing for the tired, rushed, distracted user rather than the ideal one in a demo.
Lovable: Lovable — part of the stack used to build caregap-analyzer.
Charts: Charts — part of the stack used to build caregap-analyzer.