Settings

Theme

How we built the v0 iOS app

vercel.com

34 points by MaxLeiter 19 days ago · 50 comments

Reader

_fzslm 18 days ago

This looks like a solidly built app, but having used React Native to ship production apps I really don't think its the way forward – nor spending development effort on making apps "look native" with Liquid Glass and the like. It's so much more brittle than building a web app, even with the impressive steps taken with e.g. the New Architecture.

When nearly everything today is a walled garden, I find it really hard to understand why we'd want to fortify those walls with any more platform-specific code. Though it's imperfect and still in development, I see much more of a future in the open web platform and wasm.

  • sunaookami 12 days ago

    Updating React Native every few months with breaking changes, no official upgrade path but "diff the two versions and copy everything over", having to update something every few months because Google introduces some new bullshit (API level updates that break everything! 16 KB page size! no orientation lock for tablets! yay!), using dependencies that get deprecated because React Native comes with no batteries included (Expo seems better but it's 1) another vendor lock-in 2) difficult to use with third party SDKs and 3) was not in the state it's now when the development of our app was started)... man I hate React Native and mobile development with a passion. Sadly I'm stuck with it for now...

    • satvikpendem 11 days ago

      I use Flutter with seems to fix many of these issues, primarily because it's not in the npm ecosystem so I don't have random breakages everywhere, because like you I also was tired of React Native.

gitpusher 18 days ago

Man. I looked at their landing page. Skimmed the "how we did it" article. And I still have no idea what this app does – seems like chat of some sort?

Edit: Ah. If you go to the iOS Store, they reveal that it is an AI app. How mysterious. Why not just say that on your landing page

  • jama211 18 days ago

    Yeah I can’t find a reason why but I’m put off and uneasy reading all this for some reason . Also the detail in this “how we built the app” article is basically… too detailed? Like a new developer who comments every line of logic in their code. Perhaps it was also generated with AI with a prompt that was looking at the codebase?

    I wish them all the best but perhaps this just isn’t for me.

    • MaxLeiterOP 18 days ago

      A lot of react native apps do not feel native. Even more are just low quality. Many v0 users were asking us how exactly we did X or Y to make it feel so good, which is what this post is for.

      • tennex 12 days ago

        I like it. This post is the perfect level of detail for people obsessed about UX minutiae.

        Personally, I'm not a huge Vercel fan (IMO: lots of hype, business model encourages developer ecosystem lock-in), but this post gave me more trust in the design/UX care that goes into their products (which is a core Vercel strength).

        • MaxLeiterOP 12 days ago

          I am obviously bias as a Vercel employee, but I think we actually do a lot to avoid locking our users in. You can read more about our approach here: https://vercel.com/blog/vercel-the-anti-vendor-lock-in-cloud

          If that doesn't alleviate your concerns or you disagree, I'd love to hear your thoughts about how we can improve

          • tacker2000 12 days ago

            Are you serious? Your whole business model is built on locking in users and then selling them expensive hosting.

            • MaxLeiterOP 12 days ago

              If you can point out how we actually lock you in, that would be more constructive than blanket accusations. I recommend reading the linked post

              • 9dev 12 days ago

                You accumulate web frameworks and maintainers similar to the winning strategy at Monopoly, until you have implicit control over entire ecosystems. Whether you actually seize that control or not doesn’t even matter, because you are in a position to do so—by strategic neglect, or increased attention to whatever project supports your current business goals best.

                No single entity should have that much power, especially no venture-capital backed one.

              • tacker2000 12 days ago

                No sorry, I'm not going to read your PR fluff.

                You might want to look at the comments in this thread [1], to get a feeling of the "accusations", as you want to call it... I'm not "accusing" anything, I really couldn't care less, I don't use Vercel/Next.js and never will, but maybe you should read the linked thread, too see how people (at least on HN) see your company.

                [1] https://news.ycombinator.com/item?id=45099922

              • davidsainez 12 days ago

                I find the existence of opennext convincing proof of lock-in: https://blog.logrocket.com/opennext-next-js-portability/

                Personally, I don’t bother with nextjs at all.

                • MaxLeiterOP 12 days ago

                  I think the fact that OpenNext can exist speaks to the opposite

                  A Next.js project can be deployed to a Docker image very easily [1]. If you want to use a provider that has their own infrastructure setup, then yes you need to do some work (that OpenNext does for you). But that's true of practically any framework deploying to a host that does more than just serve the docker container.

                  [1]: https://nextjs.org/docs/app/getting-started/deploying

      • satvikpendem 12 days ago

        Looks good, I appreciate the level of detail especially as bad UX can cause churn on mobile. Since it's React Native, are there plans for an Android version? I guess you guys wanted to get an iOS version out first instead of releasing both in parallel, for bug testing, improvements etc?

        • fernandorojo 12 days ago

          Overall, our focus right now is iOS, but we want to do Android at some point. Even though we used React Native, we also wrote a good amount of native Swift code under the hood to power native modules.

      • jama211 15 days ago

        Ok, well good luck

  • viccis 12 days ago

    I clicked through to the app's website, linked immediately in the writeup [1]. It slowed my browser (Firefox) to a crawl for 10 seconds but ultimately had no information whatsoever. Clicked the FAQ at the bottom, where the first question is "What is this?", which seems silly to have to address in a FAQ. But to answer you: It's a coding copilot app. No idea why you'd use your phone for this.

    1: https://v0.app/ios

  • satvikpendem 12 days ago

    It makes more sense if you go to the main landing page: https://v0.app/

    Basically like Figma Make or Lovable, a vibe coding app, except now also on mobile, which is cool.

  • alwa 12 days ago

    I tried to look at the landing page and it crashed Mobile Safari... relaunched it, scrolled a bit down, scrolling smeared rows of pixels up my viewport rather than text. It eventually redrew and reset the viewport, I scrolled some more, then it crashed Safari again.

    In the spirit of not just grumping emptily, I did just get TFA to load on desktop. I'm grateful, Fernando, for the detailed dev-to-dev style here—and I admire your commitment to a high level of polish!

    I wonder, though: you point out in the article—

    > Achieving native feel in this area was tedious and challenging with React Native. When v0 iOS was in public beta, Apple released iOS 26. Every time a new iOS beta version came out, our chat seemingly broke entirely. Each iOS release turned into a game of cat-and-mouse of reproducing tiny discrepancies and jitters.

    This feels like a treadmill of tiny rough edges that won't be going away anytime soon, especially with your (rightfully) world-class standards. And on Apple's timetable, too: it seems like each iOS evolution will likely introduce new elements of roughness, and they'll be iterating the OS through its release cycle without regard to how it interacts with your needs or workarounds. (A mental image of the winter sport of curling comes to mind)

    If you were to do it all over again, would you think about building on native technologies instead? Or do the React Native benefits outweigh the native iOS UI polish, even though "we decided to share types and helper functions, but not UI or state management"?

    • fernandorojo 12 days ago

      > If you were to do it all over again, would you think about building on native technologies instead?

      Although it took a lot of effort, it was a new set of UI patterns for React Native, and it hadn't really been done well yet.

      Where most RN teams go wrong is they never dip to native code. On the contrary, we wrote a lot of native code, both for our own packages and for updating RN core itself.

      The benefits with React Native's composition model are hard to beat. For example, thanks to React's composition with hooks and components, we will likely be able to open source most of the problems we solved into an easy-to-consume library. Or at least that's the hope!

  • cadamsdotcom 18 days ago

    If you have to ask what it is, you aren’t the target audience :-)

    • jama211 11 days ago

      This sounds profound but really isn’t, how about if we have to ask what it is _in a forum already specialised to those who could be interested_ then it demonstrates a serious communication issue?

  • MaxLeiterOP 12 days ago

    We changed the link in the post to go direct to the app store, which has more info. Thanks for the feedback

Insensitivity 12 days ago

I'm not sure if React Native is much different from React itself, but a few things that made me give a side eye, when looking at this write up:

1. The instant 5 levels of providers (and additional one later) seems excessive.

2. The usage of useAnimatedReaction which seems almost like a "useEffect" kind of hook, which was sprinkled in almost every code block.

3. The imperative size calculations, does React Native not support any responsive like constructs? I recall solving the same problem by separating "history" and "tail" and having a "grower" component, without having to use any JS (purely html & css), albeit it being web and not native.

4. Personally, when I see something like the scroll code, where you have to call scroll, wait a frame, call scroll again, set a timeout, scroll again- I would have raised my eyebrows about the architecture / code flow way before that.

5. the amount of "floating" hook calls like useKeyboardAwareMessageList() useScrollMessageListFromComposerSizeUpdates() useUpdateLastMessageIndex()

that don't return anything, always makes me raise an eyebrow, usually in React Web codebases, where the users just spam useEffects and effect chains.

Not sure if it's just my ignorance in React Native, but if I had seen the equivalent in a React Web app, I would've been baffled

pkamb 12 days ago

> Our goal was to build an app worthy of an Apple Design Award [...] After weeks of experimentation, we landed on React Native with Expo to achieve this.

Has a non-native app ever won an ADA?

  • tl 12 days ago

    Balatro and a number of other games have. But react-native? I can't think of an example and the framework wouldn't be my choice for "award winning" design.

    Watch Duty won with a Cordova app in the "Social Impact" category, so it's not impossible.

  • fernandorojo 12 days ago

    Imagine being the first one!

rumori 18 days ago

I tried the app and dragging down on the content doesn’t dismiss the keyboard interactively like Messages, Safari or even ChatGPT does. That is usually the telltale sign that an app is not fully native, I haven’t see any cross platform framework succeeding with this particular behavior. Not the end of the world but still expected in Design Award runner ups.

  • fernandorojo 17 days ago

    Interesting, that actually should work.

    Are you on iOS 26.2 by chance? I'm currently investigating a regression on interactive keyboard dismissal specific to iOS 26.2.

    • busymom0 12 days ago

      Note sure about 26.2 but on 26.1, setting the following on a native UITextView makes it work:

          textView.keyboardDismissMode = .interactive
      
      Should be doable via react native too.
      • fernandorojo 12 days ago

        Yeah that's what we use (and we showed it in the patch in the blog post).

        There was a bug on a particular iOS 26.2 beta, but it looks like it's already fixed

tevon 18 days ago

Their bottom control buttons here feels like the perfect use-case for liquid glass. Really enjoying this new UI from Apple.

samschooler 12 days ago

This is an incredible write up and touches on a bunch of headaches I'm sure we've all hit with RN, so thanks.

I'm interested in how you're dealing with the live activity and share sheet. I always drop down to native code, but am wondering if you built those with RN as well?

  • fernandorojo 12 days ago

    For the live activities, we used expo-apple-targets. That helps bootstrap it, link assets, etc. The UI itself is SwiftUI. The hard part here was actually the server-driven events for the activities during the stream. Live activities can be annoying to work with using APNs.

    You can just use Share.share() from react-native directly for the share sheet.

    • samschooler 12 days ago

      Sweet, didn't know about expo-apple-targets. I think that answers both. By share sheet I meant external, so a safari -> share sheet -> v0.dev -> your custom share view external to the app. But I'm sure it's the same flow with expo-apple-targets.

kundi 12 days ago

I have tried the app but the experience is quite bad. The output broke half-way with a red message, the produced design was subpar

patternMachine 12 days ago

This reads more like a portfolio case study than a blog post for a company. Who is the audience of this post? Isn't one of the main value props of Vercel that you don't need to know technical details like this to launch a product?

  • satvikpendem 12 days ago

    By OP:

    > A lot of react native apps do not feel native. Even more are just low quality. Many v0 users were asking us how exactly we did X or Y to make it feel so good, which is what this post is for.

    https://news.ycombinator.com/item?id=46049137

    ---

    And I mean, what's wrong with giving more detail on how to make good UX, for other developers to learn from too? I appreciated the level of detail in this post rather than many which skim over it.

fernandorojo 18 days ago

Author of the blog post here. Happy to answer any questions.

  • maderalabs 12 days ago

    I'm curious how much y'all used AI in the development process of the app. Definitely a lot of thought put into the architecture as shown in the post here, what was the split of human written vs. AI-written code? Especially curious given v0 is intended for building with AI.

    Really great writeup, super thoughtful! Been a v0 user and fan for awhile now, excited to give this a shot!

    • fernandorojo 12 days ago

      Our biggest usage of AI was actually a code review bot which lives on GitHub PRs. It reviews our code on every commit. It was originally an internal tool, but it's now Vercel Agent.

      We also used v0 for prototyping ideas and designs for the native app.

  • internetter 12 days ago

    Why did you decide against SwiftUI?

    • fernandorojo 12 days ago

      I ultimately prefer React Native's composition model over SwiftUI.

      Something that attracts me to RN is that it's easy to drop down to native. We use SwiftUI for a number of components under the hood. But for a full app, React Native felt better.

rumori 18 days ago

After signing up with Apple sign-in, the app fails to load favorites, chats, fails to upload images and fails to submit issues. Something to look into.

  • fernandorojo 17 days ago

    Thanks for sharing, sorry about that. We had an issue on the backend with Apple sign in that we just fixed today. Mind signing out and back in to see if it's fixed?

Keyboard Shortcuts

j
Next item
k
Previous item
o / Enter
Open selected item
?
Show this help
Esc
Close modal / clear selection