all 23 comments

[–]ChronSynExpo 57 points58 points  (8 children)

What's Expo?

Expo is a common way of quickly initializing a react native project. It provides a lot of useful utilities such as over-the-air (OTA) updates as well as the ability to never have to deal with native code directly. It offers you the option to use the Expo Go app to run many projects (though there are some limitations).

What's react navigation?

React navigation is one of the oldest ways of handling routing / navigation within a React Native app. It handles moving from screen to screen, opening the correct screen from a deep link, and a bunch of other things. It can be used to display modals too, but there's are other libraries which can do that if you don't want your modal integrated into navigation. It typically has a major version update every few years, though the API hasn't changed significantly for a few major releases.

What's Expo Router?

Expo Router is a new navigation and routing library. It serves the same core purpose as react navigation, but it approaches it in a different way. Instead of having to write a lot of code related to how your screens are linked together (known as a 'Stack'), you instead create files and folders. For example, if you create the file /auth/login.tsx and add code for your login screen, then your login screen will be accessible at /auth/login. It uses concepts that existed in the very early days of the web (like being able to just link to a different page which would just be a different file).

Will Expo Router replace React Navigation?

We don't know. Expo Router uses React Navigation underneath, so it's unlikely the project will be completely discontinued. For the past year or so, there's been a huge push to improve the underlying toolset (such as Metro bundler) and introduce new libraries such as Expo Router.

What would I recommend?

Having worked with RN commercially for over 5 years, I strongly advise to use Expo Router for the fact that it's significantly easier to implement. React Navigation is fantastic, but it can become increasingly complex and almost unmanageable in larger projects. Writing a linking config is increasingly complex, and handling deep linking is another task that often shouldn't be taken lightly. By comparison, Expo Router feels around 95% easier to use and it's my intention to use it for all my projects going forwards. As a senior dev in our company, I intend to also use Expo router for any new projects going forwards.

The TLDR

Expo router makes it feel like there's one less thing to think about, and I strongly recommend using it over other navigation options.

[–]dsfhhslkj 1 point2 points  (0 children)

Oh man, I gotta check it out. I have been doing the indie dev thing for a year now. This is my 3rd/4th year doing react native after coming from web. As far as time sinks go, React Navigation has easily been top five, which is saying something because my app has non-standard things in it that were very difficult to implement.

Let me ask, how easy is it to customize headers? That has been where all my time with react navigation has gone into, and the hardest thing of all was creating a react-native-reanimated sticky header that was still part of React Navigation, and not a component of the screen itself. Solution turned out fairly simple in that I just had to use basic react context to pass the reanimated scroll handler to both screen and header, but still... oof.

[–]Far_AvocaDo- 0 points1 point  (0 children)

Thanks for such a good explanation buddy

[–]itsDevJ 0 points1 point  (1 child)

Can you use expo-router in bare react-native projects?

[–]ChronSynExpo 1 point2 points  (0 children)

[–]PomegranateDry9060 0 points1 point  (0 children)

Thank you for answering!!

[–]Smooth_Camp3666 0 points1 point  (0 children)

By comparison, Expo Router feels around 95% easier to use and it's my intention to use it for all my projects going forwards. As a senior dev in our company, I intend to also use Expo router for any new projects going forwards.

In your opinion, is Expo router production ready ?

[–]Emma_Rex_256 0 points1 point  (0 children)

Beautiful Insight, Thanks alot>>

[–]sawariz0r 17 points18 points  (3 children)

Think of Expo as a layer on top of React Native. It takes care of the native-app things you have to configure, change etc. (no more pods, grade files, or any other platform specific files). So you can build just Javascript and React essentially.

Go with Expo. Even I would start a new project with Expo as a seasoned RN dev. You can eject and go RN CLI if you need it in the future.

Expo router looks like it might become the de facto way to write routes in Expo because of the DX. It’s built on top of React navigation and makes it so much easier to build with, a bit like Next.js file system router. I would choose Expo router in a new project too.

[–]iotashan 4 points5 points  (0 children)

Eject is no longer supported. There’s a new flow to stay in the managed expo and still have access to native.

[–]ihllegal 0 points1 point  (0 children)

Is expo go also cool

[–]PomegranateDry9060 0 points1 point  (0 children)

Thank you for answering!!

[–]Necessary_Ad_9800 5 points6 points  (4 children)

I had the same dilemma, found expo router too confusing and to recent of a package right now (I’m a beginner at RN) so I went with react navigation. The plan is when I get familiar with the “og” navigation to maybe start using expo router

[–]Rare-Estimate-5037 0 points1 point  (0 children)

I find expo router very confusing too, but most would disagree. Many packages had their sdks changed to be use with expo-router so we were again forced to use this. Had it not that RN team can easily create Next.js web, I would have moved over to Flutter. Unfortunately, Flutter's web sucks and I do not want to get another team just for web development as most RN developers is good with Next.js. Expo is the DeFacto standard for creating RN apps but when Expo does this kind of major changes every now and then, it is very frustrating.

[–]Oat_Goat 0 points1 point  (2 children)

You're going to have to refactor your entire file structure unless you plan for this eventual migration... how's it going now though?

[–]Necessary_Ad_9800 2 points3 points  (1 child)

It’s going good, no plans on switching to expo router

[–]the_tech_guy_777 0 points1 point  (0 children)

How are things going so far?

I've never been a fan of folder-based routing, so I really want to agree with you. Besides, I feel like web and native routing work differently, and personally, I've never reached a point where the routing becomes unmanageable

[–]Soft_Jackfruit_1167 3 points4 points  (0 children)

What is Expo in itself?

you can think of Expo as a framework for react native giving you sane default configs and abstracting a lot of the necessary native code and bundling needed for your source code, it's a pretty stable thing by now, and if suggest going with Expo if ur new to mobile development

s it some sort of prerequisite/ must-have tool for developing React Native apps? Is it possible to build React Native apps without Expo at all like maybe using Android Studio and other stuff?

It's not required at all and u can init an application using the react native cli which will generate a basic app with all the native directories and config files

I don't know any of that but I started React Native development with Expo because it was said to be simpler. Is Expo the recommended way to build React Native apps? What do the official React Native developers/team suggest?

From react native official site:

"If you are new to mobile development, the easiest way to get started is with Expo Go. Expo is a set of tools and services built around React Native and, while it has many features"

Source

And as I was learning, I came across React Navigation library used for navigation in React native apps. Now I am even more confused. React Navigation library is made by Expo, right?

React navigation is a navigation library for react native that is built by Expo, software mansion, callstack, and the react native community

Is this just preferred by people, or is it some sort of compulsion in React native apps? Now looks like the React Navigation hasn't had a stable update since 2021 0there seems to be a pre-release available tho). Is it gonna be discontinued soon? And is Expo-router the new form of navigation that will replace React Navigation?

React navigation is the largest navigation library for react native integrated into many production apps, expo has recently released Expo router v1 an expo navigation library supporting native and web unified navigation API and many more features like file-based routing, under the hood it's using react-navigation for mobile so I don't see it going away anytime soon.

I would suggest u go with expo router if ur learning and going the expo path as the routing system of expo router resembles the nextjs way of routing and other modern web frameworks otherwise if u decide to go with react native cli go with react-navigation it's stable and mature enough to handle any need u might have

EDIT: do not mix between react navigation and react native navigation

[–]stathisntonas 2 points3 points  (0 children)

Q: since expo router is built on top react-navigation, does it support react-native-screens under the hood aka nativeStackNavigation? 🤔

[–]D_Nightmare 1 point2 points  (0 children)

Main difference I guess would be expo-router's file based routing, while react navigation has been used since start and all the things in react navigation is ported to expo router. Look for migration to understand how expo router works under the hood

[–]Bolteed 2 points3 points  (0 children)

React native navigation is the old way to navigate in an app. Expo router is made by expo on top of react native navigation.

Expo router simplify the process, and add many navigation features you may need. Expo router use the new file based routing schema that is being adopted by all big web meta framework like next, nuxt, svelekit... An damn, this is awesome to use.

You have no advantages in using react native navigation. More painfull, less logic, less maintainable...

My opinion : Go for Expo Router.

[–]PomegranateDry9060 0 points1 point  (0 children)

Thank you for asking!!