JOHNNY.EXEREADY

PRODUCT-FOCUSED FRONTEND + FULL-STACK ENGINEER

I build the interface and the system behind it.

I ship useful software end to end, from customer-facing quote tools and private CRMs to safer infrastructure for AI agents. I care about the click, the workflow it triggers, and the outcome it creates.

View shipped work Email Johnny GitHub

Qualified opportunities: 40
Conservative quoted pipeline: $196,042
Median dealer alert: 1 second
Upstream contribution: MERGED

SELECTED WORK // 01

Things I've shipped

Public code, production systems, and measurable outcomes.

SHED210.PROJECTCLIENT PRODUCT // LIVE

NEXT.JS · TYPESCRIPT · CONVEX · THREE.JS

A 3D quote experience that turns product choices into sales-ready opportunities.

I designed and built the customer site, in-browser shed configurator, server-side pricing, structured quote capture, CRM handoff, and instant dealer notifications. The system turns each shopper's choices into usable sales context.

The measured January–February campaign produced 40 qualified opportunities and $196,042 in conservative quoted pipeline. That is submitted quote value, not closed sales or recognized revenue.

01ConfigureSize, roof, doors, add-ons

02PriceValidated server-side quote

03RouteCRM context + 1 sec alert

Read measured case study View live product

AGENT-GATE.REPOOPEN SOURCE // SECURITY

TYPESCRIPT · NODE.JS · ZOD · LINUX

A deterministic approval layer between AI agents and real-world actions.

Agents submit drafts. Humans approve the exact payload in Telegram. With the documented process, filesystem, and credential isolation in place, deterministic code executes only what was reviewed and no model sits in the execution path.

Write-only inbox
Hash-bound approvals
Credential isolation
Audit trail

View source and security model

FRONTIER-CRM.APPPRIVATE PRODUCTION SYSTEM

NEXT.JS · CONVEX · BETTER AUTH · ZOD

One operating surface for leads, conversations, and follow-up.

I built and continue to evolve a multi-tenant CRM that keeps lead identity, quote context, SMS, email, calls, scheduled follow-up, consent records, push notifications, and audit history together.

Source is private because the system supports a live client operation.

Visit FrontierPixel Ask about the system

OPEN-SOURCE.DIALOG

MERGED UPSTREAM · REACT · TYPESCRIPT · ACCESSIBILITY

Storybook accessibility contribution

Fixed Storybook's accessibility addon so selected tabs and highlight preferences persist when users navigate between Stories and Docs. Updated the surrounding state handling and regression tests; merged upstream.

View merged PR #32762

ABOUT // 02

Builder from the interface down

I like understanding the whole path from user action to operational result.

ABOUT-ME.TXT

I'm Johnny, a product-focused frontend and full-stack engineer. I take tangled real-world workflows like quoting, lead response, and approvals and turn them into software that feels obvious to use.

I started as a self-taught developer and am now pursuing an associate degree, with a bachelor's in computer science next. I built my first PC at 10 and never really stopped taking systems apart.

SYSTEM-PROPERTIES

Product + UI: TypeScript, React, Next.js, Tailwind CSS, Three.js
Backend + data: Node.js, Convex, Zod, Better Auth
Integrations: Twilio, Zoho, Stripe
Quality + delivery: Jest, Testing Library, Playwright, GitHub Actions, Vercel, Docker, Linux
Current mode: Building at FrontierPixel, improving agent-gate, and studying computer science.

ASCII-REACTOR.EXESIGNATURE PROCESS // ACTIVE

`^~:,-+"::~"^'^"~^,^~-^`.`'^:---~~"""~::~"~^'-;":~+"^^"~,^~:.`:^`,~^`,-^
'--,^";-^-":,^"":^:~~,..'^:^^,''',^-";"-:-"~,,"+~-;+:,~":,--`.^^`'-:`'-:
,-:':;~^^"~^^"+~:-"~,``,:^'``',,,,'',-;;~^-":':+;-~+~^-;~,:~' ,^``:-''--
:-,,~":,-":^~+;--;"^`'::,``,:~;;+;"~^,-++-^~~^,"+~-+;::;"^:~^.':'.^-'`-~
~:'^"~,^"~^:+*~-;+-',--,`':";;;;+=#@#+-"*+::"-,~*;-;+-:;;::~:.`:,.^-,`-~
~^'-":,-"-^"=+~"*"^^-~^',-"~--~+x@@@@@x*oo":~~^-*+-"+~:"+-:"-``:,`^~^'-"
~^,~~,,~":-*="~++-^~;-,^~":,^~x@@@@%x%#@@@*:~":-**~"+~:"+~:"~'':^`^~:'-"
~,:"-,:"~:"=*";*;:-;"::~":',~o@@#x#@o+=x@@#-~;--**~"+":"+~:"~''-:'^":,-;
-,-":,-;--+o;"**~:;*~:";:',-;x@=;";%@+*=%@@""+~-*=~"+":"+~:"",,-:':"-,~;
-^~"^,";-~==""*+-~*+-~+",'-";xxx##o=@*+oo@@*;*~~=*~"+~:"+-:"",,~-,:;-^~+
:^""^^;;-"o*";*"-;=;~;+:':"~o@@@%#@@@@oxx@@x**";o*-"+-:"+-:"~,^"-,-;-^"+
::;"^:;"-+o+~+*~-+=""*;^^"""@@@**#@@@@@x@@@@x*"*o;-;+-:;;::"~,:"-^~+-:;+
-~+;:~*;~*o;~++:-++~"+~,:;~;@@=;==@;o@@##x@@#*;=o"-;;^:;"^:"-,-;-:"+-:++
:~*":"*"~=o"~+;:-*;-;+-,~;~+@@+++*@@@@o=+o@@x+*o+-~;~^-;-,-"^,~;-:;+--++
:~*":"*""==~-+"^~*;-;+:^;;~*@#==+oo"@#==x@@@=*o=~:";:^~"^,--,,";:-+;:~*;
^~+":"*"~==~-;~^~+"-;;::;;~*xx@@*=o-*@@@@@@o*oo;:-;~,:"-',-:'^;":"*":"*"
^~+~:"*"~**--;~^-+":";::++~+=*@@#*o+"+x@@@#=oo;::""^,-"^`^-,`-;~:;*~:;+~
,-;~^"*"~**-:"~^-+~^~;:^;+~;*"*@@%x##%#@@@xo="::";:,:"-`':^`'~":-++--+;:
,:;~^~+"-+*-:"~^:+"^-":,"FRONTIER PIXEL STUDIO:";-,^~~,.,:'.^"-^~+":~+":
'^"~,-+"-;+-^~"^:;"^:":,-+"-";:^+%##%o=*;"-::~;;-,^-~^.'^,.`-~:^";-^";-^
',~-,:;":"+-,-":^";:^~-'^;;::"johnnyr.dev~~";+;-,^-~^``^^`.,~:,:;~^:;"^:
''--,^"":~+~,:"-^~+-,-~,'~;-^:~:,,~*oo==****+":^^~~:`.,:' `--,,~":,-;-^~
,`:-,'~"::;",^"~^-+"^^~:'^""^'^-:,,^~;****;"-^^-~~^``,:,..^-^':"-,^"~^^"
,`^-,`-":^";^,~"::;+-^-~,':"-,`,::^,^^:---:::-""~^``^:^`.^-:',-~,':":,-;

ENGINEERING-NOTES

BUILD LOGS · TECHNICAL DECISIONS · LESSONS

Latest writing

The useful parts, including the rebuilds and wrong turns.

Feb 16, 2026

I Built a Real-Time Booking System From Scratch — Then Rebuilt It Twice

110+ hours, two full rebuilds, and a stack migration from Medusa/Postgres/Redis to Convex. Here's every technical decision behind kenshincuts.com.

Browse all writing

CONTACT.EXEOPEN TO OPPORTUNITIES

ENGINEERING ROLES · COLLABORATION · PRODUCT WORK

Have a product problem worth untangling?

I'm open to full-stack and software engineering opportunities, plus selected client work.

Email Johnny FrontierPixel