React Native Web: One Codebase, Two Brands

React Native Web: One Codebase, Two Brands

React native web renders React Native components in a browser. Expo web builds that same project into a site you can host. One codebase can carry two brands when the theme changes and the screens do not. A $3.4M React Native engagement used Expo and Expo Router on the web so at.tv and DirecTV shipped from one codebase.

I write this for the operator who already paid for a React Native app and is about to fund a second website for a second brand.

The file I will actually stand on is small. A $3.4M React Native engagement. Expo plus Expo Router on the web. at.tv and DirecTV shipped from one codebase. I will not add a headcount, a timeline, a quote, or a savings number I do not have.

What is react native web?

React Native Web is a library. It maps the primitives you already write onto the DOM. A View becomes a div. Text becomes a span. Image and ScrollView follow. StyleSheet becomes CSS. The component you wrote for a phone can render in a browser without a second implementation of that screen.

People type react native web when they mean that library. The package name is react-native-web. The job is the same either way. One component tree. Two hosts.

This is a library fact. It is not a client metric. I am explaining the mechanism before I attach it to a file.

You still have web work. A screen that only knows a phone will not grow a document title, a real URL, or a hover state by magic. Platform.OS can be web, and that branch is where the browser-only piece lives. The point of the library is that the branch is a branch, not a second app.

How to choose a React Native development company is the vendor test. What a React Native app development company must prove is the live-bet test. This page is the web question those guides leave open. Can the same repo be the site.

How does Expo web build the same app?

Expo web is the toolchain around that library. You already have an Expo project for the phones. Expo web adds a web target so the dev server and a production web export come from the same app config, the same components, and the same navigation tree.

Expo Router is file-based routing. On a phone, a file is a screen. On the web, the same file can be a URL. That is why a team that already lives in Expo does not start a second router for the site. The route file is the route.

I am describing the tool. I am not describing a performance chart. Static rendering, a CDN, and a web-only module stub are all normal parts of this setup. They are not results I am assigning to this file.

The client fact on this mechanism is the one I already named. A $3.4M React Native engagement. Expo plus Expo Router on the web. That is the whole sentence. I will not narrate a migration calendar or a team size.

A Next.js development agency is the right read when the website is its own product. A portal. A storefront that was never a phone app. Server-rendered pages with an information architecture the app does not have. Expo web is the right read when the phone app is the product and the site should be that product.

Can one codebase run two brands?

Yes, when the screens are shared and the brand is data.

The general pattern is theme tokens. Color, wordmark, type, and a few layout flags live in a theme object. The screen reads the theme. It does not fork into two screen files that drift a week later. Something at startup selects the theme. A hostname. A build flag. A config value. One host loads one theme. The other host loads the other. The component file is the same file.

I will say that as engineering, then I will stop. I will not invent a token count, a screen count, or a design-system score and call it a result.

The client fact is the outcome of that pattern, not a tour of the repo. at.tv and DirecTV shipped from one codebase.

Two brands. One tree. The thing that changes is the theme. The thing that does not change is the screen you already paid to write inside the $3.4M React Native engagement.

If the brands do not share screens, you do not have one codebase. You have two products in one repository. A theme cannot paper over a different product. I would rather you fund the second product honestly than pretend a shared folder is a shared app.

When is React Native Web the wrong choice?

It is the wrong choice when the website is not the app.

A marketing site with a different information architecture, a logged-in portal that has no mobile twin, or a page that depends on document layout and long-form reading will fight the React Native primitive set. You will spend the engagement teaching View to behave like an article. That is a Next.js job. The agency guide above is the page for that job.

It is also the wrong choice when a screen needs a native API that has no web equivalent and you will not draw a boundary. A store billing sheet. A background mode. A device radio. On the web that call needs a stub or a different module. If most of the product is those calls, you do not have one codebase. You have a native app and a pile of stubs.

I do not use this file to claim a speed number. I do not claim a team reduction. If someone hands you a spreadsheet of annual savings from this engagement, that spreadsheet is not this page.

What do I take into the next operating meeting?

I take four checks. Then I stop.

• Is the product already a React Native app, or are you about to fund a second website beside it
• Can Expo web build that same project, including the router you already ship
• Are the two brands a theme swap, or two products pretending to share a repo
• Is the website actually the app, or a document that should be Next.js

The file I can stand behind is the $3.4M React Native engagement, Expo plus Expo Router on the web, and at.tv and DirecTV shipped from one codebase.

If you already have the app and someone is pricing a second site, start in chat. Bring the repo and the two brand names. I will sit with both. Seats that need the longer motion can read engagements.

The diagram is the finding. One engagement. Expo on the web. Two brands out of one codebase.

Related reading

• What a React Native App Development Company Must Prove
• How to Choose a React Native Development Company
• How to Choose a Next.js Development Agency