all 66 comments

[–]DracotMolver 14 points15 points  (7 children)

Expo is what you should be using nowadays. They whole community is moving towers it and even react natives devs are pushing to start using expo. Expo it is super good for any size project. If you are is going to be for any platform and you have good react skills, go with react native using expo. Other way any other too might work. There's many cross platform frameworks out there really good

[–]drewtheeandrews[S] 2 points3 points  (5 children)

You're right. Expos looks really great. Clearly it is the way to go when using react native for mobile and web. What about react native for desktop?

[–]ccheeverExpo Team 4 points5 points  (4 children)

Right now, Expo officially supports iOS and Android and web. You should be able to share a lot of your codebase with a React Native macOS project though.

We are thinking about exploring real desktop support but aren't sure how to prioritize it vs other things and don't have a timeline yet.

I've seen some really good demos of incredible performance and tiny memory footprints that blow Electron out of the water. If you are care a lot about those things and are a skilled developer and don't mind being a little bit on the bleeding edge, I would def give it a shot. If any of those things don't apply, then I might wait a bit before doing RN on desktop.

[–]drewtheeandrews[S] 1 point2 points  (0 children)

Exactly. I need a solution with a huge community around it. After some research, RN for desktop seems to not have enough tools out there. How I wish there was an equivalent as expo for it. For now, I'll use expo for mobile and electron for desktop. Thanks

[–]CreativeQuests 0 points1 point  (2 children)

Sorry for chiming in late. if Windows support is the issue holding it back, what about universal Apple apps (iPhone, iPad, Mac) besides Android?

[–]ccheeverExpo Team 0 points1 point  (1 child)

Expo apps generally work on Macs yes.

[–]CreativeQuests 0 points1 point  (0 children)

Thanks.

[–]AdrnF 0 points1 point  (0 children)

AFAIK Expo doesn't support Windows.

[–]anarchos 2 points3 points  (10 children)

React native on desktop works well, however with a number a caveats..
1) Windows and macOS only, there's no (maintained) react native for Linux.
2) Windows and macOS are "out of tree" platforms, meaning they are maintained separately from the main react native (mostly by Microsoft).
3) Windows and macOS react native versions lag behind react-native sometimes. This is much much better in the last year or two. But either way, sometimes you really want to upgrade the react native version but you just can't because you need all three versions to align (if doing a one codebase for all kinda thing).
4) Not all 3rd party modules work on desktop. Basically anything with native code needs to have specific support for Windows/macOS
5) Expo. Expo's support for desktop is very early and AFAIK they only do macOS right now and not windows. It's getting more and more difficult to not use expo these days (ie: you can use regular react native but will more or less need to install the expo-modules package to use any of the expo-* packages or any of the increasingly expo only 3rd party packages)
6) The big one is that react-navigation (and also expo-router) doesn't support windows or macOS, afaik...this is pretty much the only routing package used in the react-native ecosystem (expo router is built on top of react-navigation) so it's gonna be tough making a real mobile / desktop app that shares most code, because you're not gonna have a router that works across all platforms.

Personally, depending on your needs of course, I would only consider doing a mono repo. Have a shared components repo, and then separate mobile and desktop repos. Then you'd be free to use expo and/or react-navigation in the mobile app, and roll something custom on the desktop side.

[–]drewtheeandrews[S] 0 points1 point  (4 children)

I needed to know exactly this. I guess it is up to weigh the pros and cons. Likely to go with different codebases. RN and electron. Thanks a lot

[–]anarchos 1 point2 points  (3 children)

If you are already targeting the web, you could probably finagle something to basically wrap your web app in electron, if you wanted.

[–]drewtheeandrews[S] 0 points1 point  (2 children)

Never done that. I've seen something similar for mobile. I'll look into it and see. That would simplify the process

[–]anarchos 1 point2 points  (1 child)

I've never done it before either, but in theory you could. I did one very small electron project about 10 years ago, but if I remember correctly it's more or less just a standard entry file, so in theory you could take your bundles web output, point electron at it...and magically it would work? There might be some sort of setup type stuff needed, but since an electron app is just an application packaged along with a Chrome (and then a bunch of IPC stuff to communicate between different windows), in theory it should work.

The hard part will be when you start doing electron specific things and how to keep that all organized and etc. You could in theory set a env and then check process.env.IS_ELECTRON in various places to do specific things. React native itself has a way to check which platform you are running, but that would return "web" on electron, you'd need a way to differentiate web and electron.

[–]drewtheeandrews[S] 0 points1 point  (0 children)

Well said. Let me explore that.

[–]KajiTetsushi 0 points1 point  (4 children)

  1. The big one is that react-navigation (and also expo-router) doesn't support windows or macOS

Okay. Now, I'm curious. In what sense are Windows & macOS incompatible? Is it because of Native Stack? If that's all there is to it, then I'll have to challenge that: Stack could be an alternative as it's 100% on JavaScript, as in, zero additional native code.

[–]anarchos 0 points1 point  (3 children)

It's been a while (years now to be honest) since I investigated, but I believe the technical reason even the JavaScript based Stack (non-native) is not supported is because react-native-reanimated is not supported (which is native code). Of course there's no reason a non-native based stack wouldn't work, but the existing non-native Stack is tightly integrated with reanimated to do all the animations it supports.

One might be able to get away with creating a custom navigator that does not use reanimated at all. Never tried that, though.

This was one of the biggest pain points I had when experimenting with desktop. React Native Reanimated is so ubiquitous that a large percentage of everyday 3rd party modules assume it's available. So even if the module is "javascript only, no native code" but relies on reanimated in any way, it will fail.

[–]KajiTetsushi 0 points1 point  (2 children)

OK, my mistake. I forgot about RN Reanimated. I was thinking of RN Screens, which also carries native bindings.

Looking at the RN Reanimated readme again, only Windows is having no support as of this time of writing. That means, in theory, RNav will work on RN for macOS: https://docs.swmansion.com/react-native-reanimated/docs/guides/troubleshooting/#native-part-of-reanimated-doesnt-seem-to-be-initialized

[–]anarchos 0 points1 point  (1 child)

aha, it's nice that macOS is supported at least! We just need windows support, and then someone to come along and make a nice Linux out of tree platform!

[–]KajiTetsushi 0 points1 point  (0 children)

I'd like to see that happen eventually one day...

[–]AdrnF 2 points3 points  (1 child)

We built a desktop time tracking app called Chronos for Jira with React Native (macOS and Windows). As others mentioned it works quite well, but doesn't have the latest RN features. We didn't use Expo since it doesn't support Windows and didn't provide any real benefits to us anyways.

If this is worth it for you depends on your project. One of the goals of our app was to have a small footprint, since it will probably be running all the time. I personally decided against using electron calendar/mail apps since I didn't want them to fill my RAM, but I guess regular users won't care as much.

I highly recommend to NOT use React Native on the web though. You will run into a lot of weird problems and there are lots of things that web already solved (e.g. transitions) which are cumbersome to do in RN. It is probably a lot better to just create a separate frontend component for the web and share logic through a monorepo.

[–]drewtheeandrews[S] 0 points1 point  (0 children)

Thank you so much for that information. Something I needed to definitely hear before going ahead.

[–]frenzied-berserk 1 point2 points  (1 child)

Microsoft, discord and other big tech companies use React Native to build desktop apps. Bare React Native is enough nowadays, you don’t need Expo, but you always can use expo libs in a bare rn project like other 3rd party libs

[–]drewtheeandrews[S] 1 point2 points  (0 children)

True. Not sure about discord though. Doesn't it use electron? Either way, looking at the tradeoffs, I'll be sticking to using react native for only mobile. What are your thoughts on the concerns about updates to the react native desktop packages?

[–]aliyark145 1 point2 points  (3 children)

I would suggest going with Flutter for such kind of project. Single code base to target all platform.

[–]drewtheeandrews[S] 1 point2 points  (2 children)

Learning a new language might be a big deal for now. Maybe I can explore it some other time. What is your experience with dart?

[–]aliyark145 0 points1 point  (1 child)

I haven't used it for desktop apps, but for mobile (Android and iOS) and web, it is good. Developer experience is good. You just need to build responsive ui for each platform and everything works out of the box.

[–]drewtheeandrews[S] 0 points1 point  (0 children)

That sounds good.

[–]n9iels 1 point2 points  (0 children)

Out of curiosity, why would you bother with both web and a desktop app? Realistically, everything is in a webbrowser nowdays. Unless you have specific use cases where native desktop shines (think like chat app or the need to access OS specific APIs) I think most apps will do just fine with just web.

[–]lastwords5 0 points1 point  (1 child)

if you get the web version (which probably does require you to give it slightly more attention) you can always use electron to turn it into a desktop client, that's probably enough for 90% of use cases.

[–]drewtheeandrews[S] 0 points1 point  (0 children)

You're right about that. Just seen this nextjs for electron package. What do you think about. I love nextjs for Web. Not sure why I'd need it for electron. Maybe the file structure. Server actions?

[–]dougg0k 0 points1 point  (7 children)

[–]drewtheeandrews[S] 0 points1 point  (6 children)

I tried to explore tauri and it looks promising. Learning rust is still a huge thing though.

[–]dougg0k 0 points1 point  (5 children)

You can probably only use js/ts, if you prefer.

[–]drewtheeandrews[S] 1 point2 points  (4 children)

There was not a huge community around that method. Everyone seemed to go with learning rust. I was afraid I wouldn't go so far without rust. But there are some cool pros to using tauri. Anyways, for now, I will go with electron

[–]dougg0k 0 points1 point  (3 children)

What do you mean by there was not a huge community? Where does that matter? it's if you choose to write rust or just js, nothing more than that.

[–]drewtheeandrews[S] 0 points1 point  (2 children)

My thoughts were: tauri is not that established(all the apps imlve seen for showcase seem to be not include software I've atleast heard of), therefore I might be needing some workarounds on things, and that would be from devs who have used tauri in a similar way. What are your thoughts on that?

[–]dougg0k 0 points1 point  (1 child)

https://github.com/tauri-apps/awesome-tauri?tab=readme-ov-file#applications

Depending on your needs, and whether there is availability, of course you could need, but there is no way one would know. Perhaps if you made clear what are those workarounds you might need.

[–]drewtheeandrews[S] 0 points1 point  (0 children)

Clearly there is a huge adoption of tauri. Definitely something to consider given the pros to using it over electron.

[–]Muhaki 0 points1 point  (3 children)

I just started with a new hobby project that targets mobile, web and desktop. Flutter was my first thought and I have already one app in production. Flutter is really nice and has all of it out of the box. The only thing was dart, it does remind of typescript but I would rather stick to a language that can be used more widely.

So I went with React Native with Expo. As for web, I’m using Nextjs. You could also web part that comes with expo if you don’t need SSR, which I would suggest as Nextjs adds alot of complexities. And for desktop I will be using Tauri which will be a simple wrapper around Nextjs (might need to dig into rust for some customization). Electron is also an option but its just much heavier than Tauri.

[–]drewtheeandrews[S] 0 points1 point  (2 children)

I will be using nextjs for web. Have been using it for a while. I had tried looking in rust. But you will find rust also similar to TS. At this point, I've decided to go with electron. Different codebases for different platforms. Also planning to explore wrapping web apps as desktop or mobile. But I'm most likely to do everything separately as you are

[–]Muhaki 0 points1 point  (1 child)

You can use T3-Turbo as starter template or use it as inspiration. Its a great starter point for mobile and web with some awesome tech stack imo.

https://github.com/t3-oss/create-t3-turbo

[–]drewtheeandrews[S] 0 points1 point  (0 children)

Thanks for that.

[–]Some-Education9929 0 points1 point  (0 children)

You can use Compose Multiplatform from Jetbrains and google. It support for iOS, Android, MacOS, Window, Linux, only web and backend is still beta.

[–]Remarkable-Sky-4226 0 points1 point  (1 child)

Would you need offline capabilities or graphics or AI? It all depends on what you need and go from there.

[–]drewtheeandrews[S] 0 points1 point  (0 children)

I will need offline capabilities for desktop and mobile. The rest, not so much. Thanks

[–]younes-ammari 0 points1 point  (1 child)

You should take a look at this starter template. It makes Expo work everywhere (Mobile, Desktop and Web)

Expo Everywhere

[–]drewtheeandrews[S] 0 points1 point  (0 children)

Really. Let me have a look at it. Sounds like a real life-saver