# React

> How larch uses React: the interfaces of Hiki and Scout on React 19 and Next.js, and Bridddge, a macOS app with one React app per feature.

URL: https://larch.ee/technologies/react/

larch builds product interfaces in React, on the web and on the desktop. Hiki and Scout run React 19 inside Next.js 15, and Bridddge, our LinkedIn app for macOS, runs React inside Electron.

- Products built: 3
- On the web: React 19
- On the desktop: Electron
- Components: shadcn/ui
- Bridddge builds with: Vite

## Built with React

Three products, three interfaces. A manga catalog, a LinkedIn app for macOS and the control room for an AI sales agent. Each interface is React, and each product is one we designed, built and shipped.

### [Hiki](https://larch.ee/work/hiki/)

React 19 renders a catalog readers filter by 21 genres, 100+ tags, price, discount, stock and store, on shadcn/ui components in Hiki’s Neubrutalism style.

- Year: 2025
- Stack: Next.js, React, TypeScript, Tailwind CSS, Kotlin, Jetpack Compose, FastAPI, Python, MongoDB, Firebase, Google Cloud
- Live product: https://hiki.world

### [Bridddge](https://larch.ee/work/bridddge/)

Each feature is its own React app in a multi-page Vite build: dashboard, CRM, SSI analytics, scheduler and automations, themed with shadcn/ui.

- Year: 2025
- Stack: Electron, React, TypeScript, shadcn/ui, Tailwind CSS, SQLite, MCP, Claude AI
- Live product: https://bridddge.com

### [Scout](https://larch.ee/work/scout/)

React 19 draws the drag-and-drop Kanban pipeline, the analytics dashboard and the activity log, and updates them live while the agent runs.

- Year: 2025
- Stack: Next.js, React, TypeScript, Tailwind CSS, SQLite, Playwright, AI agents

## Related service

### [Web platform development](https://larch.ee/services/web-platform-development/)

Fast, resilient platforms that grow with your business, not against it.

What you get:

- **SaaS platforms, real-time dashboards and multilingual apps**: Scout’s dashboard updates live during agent runs; Hiki’s interface is translated down to genre and tag names.
- **The entire stack, from front end to database**: Behind Hiki’s React front end sit a FastAPI back end and MongoDB, built by one team.
- **Deployed, monitored and scaled, not just built**: Hiki ships to Cloud Run through Cloud Build on every push to main.

## How we use React

Interfaces people work in. In all three products React draws the screens people spend their time in: a catalog to browse, a LinkedIn workflow to run and a sales pipeline to manage.

### Hiki: a catalog you can filter

Hiki’s interface is React 19 inside Next.js 15 with the App Router. It turns a daily scrape of several bookstores into one catalog. Readers filter by 21 genres, 100+ tags, price range, discount, stock and source store, and full-text search covers product names in every supported language. next-intl translates the interface, the genre names and the tags, so the same React components render every locale.

The look is a Neubrutalism design system: bold 2px borders, offset shadows and a manga-inspired style set in the Lacquer and Pangolin fonts. The components are shadcn/ui, customized with the Neubrutalism theme rather than drawn from scratch.

### Bridddge: one React app per feature

Bridddge is a macOS app built with Electron and React. An embedded Chromium browser handles LinkedIn itself, and React draws the tools around it. A multi-page Vite build gives every feature a separate React app: the dashboard, the CRM, Social Selling Index analytics, the post scheduler and the automations. The CRM tracks every connection with its status, notes and action history. The screens use shadcn/ui with a custom theme called Lyra, which has a blue primary color and sharp edges.

### Scout: an interface for an agent

Scout also runs React 19 in Next.js 15. An AI agent does the sales work, and the React interface is where the user sets it up and follows it. A seven-step setup wizard goes from the ideal customer profile to the first batch of leads. Leads move across a drag-and-drop Kanban board from Qualified to Contacted, Replied, Meeting, and Won or Lost. The analytics dashboard shows pipeline health, the conversion funnel, source performance and outreach metrics, and the activity log records every action the agent takes. While the agent runs, the interface updates live.

## Other technologies

Used alongside it. React runs inside Next.js in Hiki and Scout, and inside Electron in Bridddge. See what we built with each.

- [Next.js](https://larch.ee/technologies/nextjs/): Hiki’s multilingual catalog front end and the Scout web app, both on Next.js 15 with the App Router.
- [Electron](https://larch.ee/technologies/electron/): Bridddge, a native macOS app with its own embedded browser, running locally.
- [All technologies](https://larch.ee/technologies/): Seven technologies, each one running in a product we shipped.

## How to start

Tell us what you want to ship. Bring the idea. We’ll tell you how we’d build it and what it takes.

- Book a 30-minute call: https://calendly.com/nicholas-stackwise/30min
- Email: hello@larch.ee