TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

Solito – React Native and Next.js unified

216 pointsby reimertzabout 3 years ago

16 comments

fernandorojoabout 3 years ago
Creator of Solito here. I&#x27;ve built a number of React Native libraries (Moti, Dripsy, etc). Happy to answer any questions. I originally gave a talk at Next.js Conf about how&#x2F;why we use Next.js with React Native: <a href="https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=0lnbdRweJtA" rel="nofollow">https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=0lnbdRweJtA</a><p>Navigation is the hardest piece of sharing code across platforms. Web has plain URLs for navigation state, whereas apps have complex sets of nested navigation patterns (stacks, tabs, modals, drawers). By combining the approaches into a single mental model and API, devs can build for Web and Mobile with ease. This is touched on at length in the &quot;Methodology&quot; and &quot;Gradual Adoption&quot; sections of the Solito docs.<p>The gap between web devs and native devs is shrinking. This stack enables you to ship native apps and websites with a single codebase. I&#x27;m the only frontend engineer at our startup, and I was able to do just that as we scaled to thousands of users (see <a href="https:&#x2F;&#x2F;beatgig.com" rel="nofollow">https:&#x2F;&#x2F;beatgig.com</a>). My goal with Solito is to 1) provide the code to let others do it, and 2) perhaps more importantly, document clear patterns to deal with platform differences.
评论 #30680397 未加载
评论 #30680967 未加载
评论 #30683951 未加载
yesimahumanabout 3 years ago
This looks cool, nice work! As an alternative, if you’d like to have a single web-based codebase for iOS&#x2F;android&#x2F;pwa&#x2F;etc using Next.js then you might like this approach using Capacitor: <a href="https:&#x2F;&#x2F;github.com&#x2F;mlynch&#x2F;nextjs-tailwind-ionic-capacitor-starter" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;mlynch&#x2F;nextjs-tailwind-ionic-capacitor-st...</a><p>The benefit over using RN for this is being able to use libraries like Tailwind on all platforms and having a true single codebase.
评论 #30681232 未加载
评论 #30680942 未加载
评论 #30684761 未加载
reimertzabout 3 years ago
For anyone interested, here is the keynote introducing Solito from Next.js Conf 2021 by it&#x27;s creator Fernando Rojo.<p><a href="https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=0lnbdRweJtA" rel="nofollow">https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=0lnbdRweJtA</a>
crooked-vabout 3 years ago
I suspect I&#x27;ll end up using this ASAP just for the useParam hook, as it&#x27;s a pattern I like quite a lot (page state as query params) and is a big ol&#x27; pain to maintain and deal with edge cases.
hokumguruabout 3 years ago
Applause to Fernando for this. His work on react native open source has been incredible. Definitely check out his other projects Dripsy and Moti as well!
hunterb123about 3 years ago
Wouldn&#x27;t Remix be a better fit? It&#x27;s easier to run in more client-orientated environments.<p>Currently, I like to have the API and web pages (signup, marketing, policies, etc.) made with Remix.<p>Then, the cross-platform app (native &amp; web) can be made with React Native &#x2F; React Native Web using React Navigation as the router.<p>I can certainly see being able to combine those two into one as a plus, but React Router &#x2F; Next Router and React Navigation conflict. React Navigation is needed for a nice app experience.
评论 #30679968 未加载
评论 #30679027 未加载
artdigitalabout 3 years ago
&quot;React Native and Next.js&quot; sounded to me like you were trying to do server-side rendering for react native apps, it&#x27;s the first thing I associated with &#x27;next.js&#x27;<p>But this is more about navigation if I see this correct? So more in the direction of react-router
评论 #30686305 未加载
评论 #30680822 未加载
评论 #30682224 未加载
kallabout 3 years ago
It&#x27;s great that this is as much a library as it is documentation on good patterns for this.<p>I don&#x27;t use react-navigation, so I won&#x27;t be able to use the library. I actually arrived at a very similar setup of a Link component that is a different implementation per platform. I think it will become even more similar after learning from this code and documentation.
chrisabramsabout 3 years ago
I didn&#x27;t know React Native + Next.js was a thing? What is the goal of doing that? I don&#x27;t know what problem Solito is solving, some helpful context would be nice for those of us who are foreign to the problem.
评论 #30678906 未加载
Benjamin_Dobellabout 3 years ago
React Native + Next.js definitely has appeal to me. However, I&#x27;m not sure how future proof this API is. Unless I&#x27;m missing something, it looks like it locks you into data fetching at component render time. Facebook have been working hard in recent years to move away from that (&lt;Suspense &#x2F;&gt;) and routing libraries like React Location (<a href="https:&#x2F;&#x2F;react-location.tanstack.com&#x2F;" rel="nofollow">https:&#x2F;&#x2F;react-location.tanstack.com&#x2F;</a>) offering asynchronous routing APIs seem like more promising approaches long-term.
评论 #30681071 未加载
评论 #30680743 未加载
Graffurabout 3 years ago
&quot;Solito is the missing piece for using React Native with Next.js to build powerful cross-platform apps.&quot;<p>What was missing though?
评论 #30679009 未加载
merrvkabout 3 years ago
This will help open a lot of doors for us. Very interesting project.
fn1about 3 years ago
I don&#x27;t get this. Isn&#x27;t the main benefit of next.js proper splitting of server&#x2F;client code, prerendering and such?<p>None of that is needed on a native platform.
评论 #30698663 未加载
redbar0nabout 3 years ago
mad props to Fernando Rojo for not only creating these libraries, but also for solidly documenting them (including his journey and rationale)!
_scottpaulinabout 3 years ago
This looks super cool.<p>Rookie question from a Web dev here - what functionality does react native provide that isn&#x27;t available on Web?
评论 #30678865 未加载
评论 #30679853 未加载
评论 #30679074 未加载
评论 #30678744 未加载
评论 #30678725 未加载
faldoreabout 3 years ago
is there an analog for NativeScript?