The State of React Native

[@samuelgunter]

i think the state of react native is colorado because it seems cool but ive only been there once for a short period of time

[@Smongo412]

I've been there from 2016 to now and it's been great

[@codelabspro]

It’s more like Alaska coz hardly anyone wants to be there 😂

[@Sindoku]

@@codelabsprono, Alaska is more like Andorid on Java or iOS on Objective C, lol.

[@musamutetwi1948]

@Theo, lots of us use Axios in combination with Tanstack query. Reason behind this is that axios contains aspects like: 1. initial configs axios.create() - helps to configure props like backend url, authorization, timeouts which prevents rewrites on every request. 2. interceptors (works really well to catch requests & responses before sending/receiving the data) u'd be amazed 3. direct method calling helpers like axios.post, axios.put etc 4. (Not so important these days due to forced updates) but fallback to XHTTPRequest in browsers with no fetch api support In fetch api, u'd have to write all the above helpers by urself

[@saiphaneeshk.h.5482]

It just simplifies stuff.

[@amemeida]

The reason one uses axios is because otherwise you'd be rewriting a worse axios from scratch

[@Frexuz]

Cause Theo knows nothing about RN. Not sure why he's making a video about it like he knows it. He just used it many years ago and now juts Expo..

[@TalhaBalaj]

This comment needs to be pinned

[@bartek.igielski]

with interceptors it's super easy to retry requests, very useful on both client and server side, especially when used with stuff like "fly-replay" that lets route traffic to other geo region ​@@FrexuzBut Axios isn't RN exclusive, you will use it in web projects for the exact same reasons.

[@JamonsCodeQuests]

Thanks for the shoutout Theo! (Being technical - I didn’t create MobX-State-Tree, that was Michel Weststrate - but I maintain it now alongside Tyler Williams and chakrihacker.) One big reason MobX / MST has a cult following in the React Native community is because our starter kit Ignite includes it by default. However, we have a new version coming out soon that will make MST optional and allow you all to use your Zustand or whatever. (I still think MST is often the best experience, but we know folks want choices!)

[@TheSocialDeveloper]

Just started down the React Native rabbit hole after being on React for some years now. So far so good!

[@jacksonlevine9236]

HAHAHAHHAHAHAHAHA JUST YOU WAIT

[@TheSocialDeveloper]

@@jacksonlevine9236 🤣🤣🤣

[@BRP-Moto-Tips]

@@jacksonlevine9236 this guy is going to be really sad next week when he tries to start the project as usual and absolutely EVERY error possible streams through his console, don't ask me how I know lol

[@Amaraticando]

"if only you knew how bad things really are"

[@hazemmohamed7187]

man Come On don't be pessimistic XD @@Amaraticando

[@gergoradeczki]

13:28 It's so funny to see Theo getting outrageous because people use Axios. Just because something is old and is working doesn't mean we should move on to something else.

[@dawngunz]

Regarding Axios: All the tutorials and posts I saw when starting webdev were centered around Axios instead of just using fetch or something else. This was ~2 years-ish ago? That might be why there's such a large percentage.

[@JTWebMan]

I think you can't use the State of react Native survey to figure out if you are beating flutter or people thinking they are going in the wrong direction as I am willing to bet most if not everyone taking that survey is currently working on a react native project and not a flutter one. It is going to be bias towards the tech the survey is about.

[@nguyenvietbachz]

I had to use Jetpack Compose simply to implement an intent-based function for Bluetooth usage because it wasn't (still not) possible to use Bluetooth without ejecting from Expo. I must say Jetpack Compose just feels so familiar to React Native and learning it was just a matter of days.

[@zyph.]

We use Axios because of two main benefits: built-in timeout support and simple interceptors that make HTTP logging very easy. I am open to alternatives though. It is a bit of a love-hate relationship

[@aryanshmahato]

Axios: interceptors That's it! That's very very very important

[@nephis_2006]

Axios is just way more flexible than fetch imo Just the way you create http clients, interceptors...

[@bryangomez5951]

tldr(watch): Interesting, interesting, interesting...

[@kuhluhOG]

36:20 Another Alternative: Qt with QtQuick for GUI (for historical reasons, this framework has two GUI libraries inside of it, QtQuick and QtWidgets)

[@jonippolito]

I get that it's hard for a typical dev to understand the use case for React Native Snacks and Expo Go, but as a college prof they have made teaching a mobile apps class way easier. Snacks erase the implementation headache of dealing with CLI on students' different operating systems and make it trivial to share and debug code. And Expo Go is the only way for students with Windows laptops to test iOS apps-in fact any app can be immediately tested on all the devices in the room. It's a huge win for learners in a class setting.

[@mattmmilli8287]

I used to use RN for years. Happy to see it’s alive and kicking. I hope they cut down some of the INSANE Xcode/AS issues when upgrading versions and adding some modules 😂

[@smthngsmthngsmthngdarkside]

It hasn't. It's still fucking insane to get setup

[@ProfessorThock]

2:30 Theo I think part of what we’re seeing here is natural tendencies based on the buckets they provided. 51-100 is low and 500-1000 is low because people don’t think about those numbers. They think yeah I’m over 10, over 100, over 1000.

[@jessypouliot8374]

21:50 "Flipper is better than it was" Expo SDK 50: "We're deprecating Flipper" 🙃

[@zhasulanserikov9890]

Is it expo? I think react native itself not want it

[@hanro50]

The main reason Axios is prefered in the codebases I work on is just because it is standardised across everything, allowing for code to be reused easily. This isn't necessarily the case with fetch.

[@Sindoku]

I tried building a simple poc in expo this weekend. Apparently making a truly grayscale image on the client is impossible without ejecting to react native or just doing a pure native solution, which means I can no longer use the Expo Go app for emulation. I didn’t enjoy that experience, but otherwise it was fun. I’m a web developer and have lots of react experience for reference.

[@Tobi-ci3ns]

For anyone else looking for the podcast episode that was mentioned, it's "React Native’s Superpower with Theo Browne | Rocket Ship 027"

[@user-ys6ro4wi3f]

I've begun using react native couple months ago and it can really be a pain sometimes. But for the freedom it offers and all of it's nifty features I believe it is worth it. Most of the pain comes from packages that don't seem to work or need very specific configuration, and debugging. For example I had an issue with react-navigation using expo where the header style wouldn't work in the production build while it would in development, which made me go into a rabbit hole of using various alternative solutions until one of them worked. I feel like at least half of my time is spent on these issues, however it is probably just due to the fact that I'm unfamiliar with react native as a whole.

[@SeanCassiere]

I do have to ask, why is it a "painful number" of people using Redux for state management? I get that it's verbose in defining its config, but it's certainly good at creating a predictable flow for state updates with the reducer workflow. It is definitely not the best for async state management (Tanstack Query still remains king for that) but for complicated forms and other UI-level changes, it certainly works. Other options certainly do exist (and probably are better), but Redux certainly ain't bad. Edit: This is about the "state management" portion at 11:25 and does not have anything to do with the data fetching portion that follows.

[@andrewkosenko2757]

Global state, a lot of features that you don’t really need. Asynchronous stuff needs to be managed by yourself through thunks or other ways. So, unless you really need a lot of reduxs features, why should you use it?

[@SeanCassiere]

​@@andrewkosenko2757 As I said. "State management", not for async state or data fetching. As mentioned in the OP, for the async stuff, go for Tanstack Query or alternate. A predictable state machine certainly does have its place. From complex forms, to game states, shopping carts, to other long lived states that have predictable stages for its state (AKA a state machine).

[@andrewkosenko2757]

@@SeanCassiere yes, but using redux is too much for 99% of projects

[@SeanCassiere]

​@@andrewkosenko2757 I don't disagree with that sentiment, but that wasn't the remark made in the video. Plus you also have to take into the consideration that this survey was for mobile development. Unlike the web where a single view could obtain all the necessary user input with the freely available screen real-estate, on mobile its more likely for that view to be broken up into multiple. Mobile doesn't have the same utilities we use on the web for sharing state via a query param either. The mobile platform is one where the likelihood of requiring a state machine is higher than on web.... and React context with the useReducer hook is a poor substitute for a library designed to handle these predictable changes.

[@smthngsmthngsmthngdarkside]

Isn't Redux redundant? I mean what project doesn't use network? And so if so, why not use react query or Apollo client? Seriously, Redux is just pointless

[@zuma206]

definitely do a vid on the facebook messanger SQL situation, sounds insane

[@mohamedaminebenslama9483]

can you pls share a link to the topic? couldnt find anything on the web

[@juan-lukeklopper3922]

​@@mohamedaminebenslama9483 it is called Project LightSpeed, you can find it by searching "Project LightSpeed meta" and it should be the first link

[@Caellyan]

Rive is cool and all, but it's completely proprietary whereas Lottie has much more OSS tooling. I remember looking at Rive long time ago and there wasn't (still isn't) a way to use it without paying.

[@spkim0921]

wait, what exactly is wrong with axios? I use it all the time for all my full stack web apps

[@IsuruKusumal]

You should defintely do a video on Jetpack Compose

[@boredstudent9468]

"Some of the best ReactNative Devs started out with Android" Makes sense that many of the better ones started with native and actually know what they are doing with the platform, Frontend Dev's picking it up can easily (but not necessarily of course) have the "dump it in electron" phenomenon .

[@ashuvssut23]

reason why yarn is at top is yarn workspaces (i think). Setting up a monorepo is a pain in react native. Creating monorepo in yarn is easy because expo docs has guides for for it. Also, worth mentioning that Narwhal has also got their monorepo stuff working nicely ages ago before expo did. But i think setting up a monorepo using expo docs guides is easier to understand

[@comediehero]

I find it interesting you dislike flutter because it draws everything in a canvas, but for me thats it's best feature because it means my apps actually look and behave the same on all platforms.

[@KanadGodse]

I believe the problem is not that it draws in Canvas, but that the language used (Dart) and it's attempt to be "React like" than being it's own thing and not being either of those, I guess (I don't know much about Flutter, only from Fireship and a few other videos)

[@iDizzasTeR]

Man I suck at flutter the moment complicated forms come in play that don't take simple types 😢 It's so bad

[@comediehero]

@@KanadGodse can't say, I never used react.

[@And1997Ruz]

Regarding Axios As far as I'm concerned, you can't do upload progress with Fetch. That's why you use Axios (unless you want to work with Ajax)

[@pedrol6193]

Why does he not like Axios??

[@AvindraGoolcharan]

axios sucks

[@GamerSharp]

​@@AvindraGoolcharanwhy ?

[@Frexuz]

Cause everything that is used that he doesn't use himself is "terrifying" 🤷‍♂️ such a bad take being so negative on other's choices and the fact that the community is so large and have many different reasons for picking libs..

[@bossRODTV]

@@AvindraGoolcharanyeah why?

[@henriquematias1986]

He doesn’t like tests too, so whetever, take what you want from the video and Mariah Carey On

[@effeKtSVK]

I just have one question, what’s wrong with Apollo Client?

[@nubunto]

Started using React Native for a new project and it could not be more disappointing. It might be a skill issue from my part, but not being able to build an app locally (thanks Expo), and not being able to put the parts together for my app, even after following every single step-by-step tutorial I could find, I ended up just ditching it for Capacitor, which works out of the box and doesn't lock you up with any magic build tooling. again, I'm pretty sure it's a skill issue from my part, but it's just not a good developer experience AT ALL.

[@safalpiya2903]

Well you can make your life easier by building the app locally in docker.

[@schechtere]

Axios (and Fetch) both just pretty much work. Might be technical reasons to choose between them, but for many of us, its just whatever we started using first hasn't been a pain point, so we are not on the market for something new.

[@theangelofspace155]

Axios have nicer api for junior dev, easier to crate axios instance, not having to do res.json (I think that was it), and easier kill signal ( a least for junior dev lile myself). Error code do throw when they are supposed to (I think fetxh does not throw for 400 codes, I can remember what range ot was).

[@MrRetroDev]

I think the only reason Expo Router has shot up is because it's now the default for the Expo templates, replacing React Navigation

[@wezter96]

Big respect for you doing some RN content, love to see it! :D

[@tasmto]

Redux Toolkit with RTK query is not that bad imo...

[@lamhung4899]

​@@JEsterCW feel free to create "your own redux" 😂 , as long as it is accepted by your reviewer

[@Smongo412]

Been a react native dev since right after android support launched and i love it

[@kooraiber]

At least IMO, fetch is too anemic and kinda weird to use. Axios has much more useful features and is extremely simple to use.

[@atultiwaree6023]

What you guys use for caching, I use redx persist but it's slow is their anything alternative for caching data??

[@systematicpsychologic7321]

What I don't get is why is react-spring not on the list for animation choices? I was under the impression that was pretty popular. Npm installs and github stars seem to back that up.

[@michaelchen8910]

What's wrong with axios bro? Its easy to use. It works. Got some cool stuff like http interceptors to make it easier.

[@MrSofazocker]

14:07 TLDR Why using Axios in 2024 is still the GOAT: With all the different FetchAPIs (especially the one called fn fetch) you just have to hope they work the same on all platforms.. Which they don't. If you want to use the exact same fetch code you HAVE TO use axios still, since all others, especially the "built-in" fetch have so gosh darn many quirks and differences wherever you run it, it's just ridiculous. (Just as a real dumb example, the twitter fight over body-length and content-length, between deno and bun, and nodejs actually having a bug which threw an error, as an API maintainer you can't even have example code which works on all platforms and frameworks, its just weird af, and axios is the only sane thing that behaves) If you don't understand or never experienced this => Tell me you are a react-andy without telling me you are a react-andy. ( or quiche-eater)

[@omarjab]

I'm now curious and would like to try it again. I've already tried it in the past, i think it was more than a year ago

[@flamepal]

react-native-svg does not actually render svgs, it binds svg syntax to native code

[@ulrich-tonmoy]

How is react native compared to the Tauri Concept

[@henriquematias1986]

Good question not sure if it makes sense tough :D

[@benbowers3613]

Tauri is based around web views, i.e., your tauri app is essentially just a browser that is only capable of visiting your app. There are some performance drawbacks, but the dev experience on tauri is way better because you can use whatever web technologies you want. React Native uses actual native ui components and then controls those native components using JavaScript in a NON-NATIVE JS runtime that comes installed in your app. Each has pros and cons, but React Native is much more well established and has more documentation, forums, etc.

[@ulrich-tonmoy]

@@benbowers3613 yep but tauri also have rust ui framework to work with i dont know if they are web tech based? either way still single code 4 os

[@gadgetboyplaysmc]

Axios is pretty good. Why not use it? I also had a pain using just the fetch API once to support a progress indicator for a file upload. On axios it was pretty much just `onUploadProgress` lol. So easy.

[@ashuvssut23]

SwiftUI seems more Flutter like. I mean that how I used Flutter Widget. Widgets are used like Functions. and other widgets are passed in their parameters and so on.... its just like how SwiftUI does. I left flutter long ago though. JSX is so much easier to write

[@MrSN99]

do check kotlin multiplatform & jetpack compose

[@Vissie2]

I wonder how React Native compares to Jetpack Compose and Swift UI these days.

[@Gustavo-wh1rd]

am i missing something by using axios?

Thank you for the video. I like your videos. Personally I prefer to use vanilla js all the time with jsdocs . I dont like TS. That is why I started to learn C#/.net instead of dealing with non-sense Ts thing.....

[@BogdanTheGeek]

axios is used because fetch doesn't handle http (not s) on newer platforms

[@Grynjolf]

I would be so interested in a video about Messenger!

[@kapiqu2709]

Many of the community comments are from Poland. I'm proud.

[@henriquematias1986]

What’s that browser? Some alien new version of Safari?

[@byMagg1]

Somehow expo debugging just does work for me. Anyone having the same issues?

[@renejotas]

Whats wrong/What happened to redux? I never really liked it (and i really like recoil), but whats up with it?

[@mattmmilli8287]

It’s just way more complex than it needs to be. I was down the rabbit hole for so long with full on Sagas but Zustand is the way (: Redux def on its way out

[@_observer_-xk7hb]

Personally I don't like Tanstack Query. I find using hooks for querying and updating data to be ugly, and it gets really ugly when you start doing more complex things like optimistic updates and managing complex data dependencies. The caching functionality on TQ seems simple enough but in practice can get tricky. I prefer just using the fetch API with custom caching code, it's simple and elegant.

[@rand0mtv660]

vanilla fetch API is horrible to work with and not really usable on its own without some custom wrapper. You must create a wrapper for it in order to make it usable, so at that point why not just use axios? There literally is no point in not using axios unless your company banned it as a dependency or something.

[@ashuvssut23]

react native skottie is gonna help devs use lottie files in react native faster. Can provide any links comparing skottie & rive

[@kuhluhOG]

10:42 Naming a library about state management just "state", wow.

[@tmerb]

tailwind rn last commit was 2 years ago

[@Murv]

Tailwind is featurecomplete though, no ?

[@tmerb]

@@Murv nativewind works well for most part but tailwind-rn package hasnt been updated is all

[@RIP212]

Surprised you knew how to read/translate Szymon from Polish to English version of this name which is Simon :)

[@TheJames808]

Using over 5 years and it just gets better better, however I stumble on projects that are done by programmers who understand only react and React-Native has nothing to do with React exept peer dependency so if you want to do mobile apps its NOT WEB i repeat ITS NOT WEB it takes different approach and years of learning. Keep coding.

[@landsman737]

Axios is great! No reason to replace it.

[@elohimalves]

I really don't know why the name "Native". In lower capable phones, specifically on android, the performance of kotlin/java native app has better efficiency and performance than react, on Apple I've noticed no difference because Apple only make high-end phones. So many KZbinrs say that react is the future, but I think that before someone say that a tech is the future, they need to test it on lower affordable "cheaper" techs. Not everybody can buy an Iphone or Mac, or even get a decent Phone.

[@t3dotgg]

If you don't understand how React Native works, this might not be the best video to start lol. React Native calls the native UI layer for a given platform, so a renders a native button on iOS or Android. Many RN devs, myself included, go out of or ways to do dev work on older Android phones to make sure performance is good.

[@bilalnaeem166]

My primary testing devices are literally an Android 10 smartphone and an iPhone 6s. I do not think anyone in 2024 own a mobile device that's older than these ones.

[@elohimalves]

@@t3dotgg yeah, web dev is where I started my journey, but when I started to feel the diference in performance in large projects in older phones like Android 5/6 I moved to Kotlin/Switch. I'm not saying that react is bad, its a good tech for web. I've created many apps by the way. I'm just saying that Kotlin/Switch have better performance in mobile.

[@darrenzou2483]

I thought about using react native until i realize that apple and google takes 30% and i see my way out. Webapp all the way

[@sudityashrivastav]

USE DARK MODE.. IT JUST HURTS MY EYES

[@_____case]

Waiting for Apple to make SwiftUI cross platform.

[@mj-lc9db]

or kotlin multi platform

[@_____case]

​@@mj-lc9db Compose Multiplatform seems to be a promising technology, but I really want all of these frameworks to be cross platform, just to reduce the overall cost of development for every team.

[@ruslansergazin8239]

maybe axios configs and other features make it popular? fetch is too simple, and doesnt provide any other features

[@phlasc]

Gotta stop hating on flutter strictly because it is canvas rendered. Figma is canvas rendered. They both suck at ADA.

[@lcarv20]

Specially because the first thing users gonna do is open inspect tools to check.

[@weebslime]

isn't react native will be sun setted?

[@StiekemeHenk]

"Your dirty JavaScript" 😵‍💫

[@benardallotey]

I don’t use axios because I want http 2 pretty simple

[@greggleason8467]

I have made multiple react native apps. I have never touched typescript. I took one look at it and said no. I can write js, c#, c++, and I can read several other languages pretty well. I would not touch typescript and would really like to hear why I would even use it.

[@rand0mtv660]

If you work alone on a project, that's fine. If you work in a team, Typescript is invaluable in my opinion. Vanilla JS sucks to write long term and if multiple people contribute to a project.

[@samerhannah5530]

React native is my savior ❤

[@kacperkapusciak]

Thanks Theo!

[@gurgelio_]

Brazil mentioned 🇧🇷🎉🎊🇧🇷🇧🇷

[@xBiggs]

Would rather use native Fetch then add a useless dependency like Axios

[@pcnerd5994]

xamarin 14% in 2023 !? WTF

[@ToaOfs]

Rawr

[@notjustdev]

👀

[@angelcaru]

React naïve

[@codefactory3190]

This made me laugh hard 24:40

[@eng3d]

imho flutter wins in practically everything

[@kandiesky]

Not on being easy and familiar to use

[@TheTdg97]

@@kandiesky both of you are the example of how flutter and RN devs are so obnooxious, like, we get it, you prefer one, you would sell your entire family rather than touching flutter/ RN. Both have their pros and cons, and if you look for it, your probably going to find negative things about both, and btw, both flutter and RN are super easy to learn if you started with f'ing android with XML :b

[@gcash49]

not in pay

[@thespacejedi]

copium

[@saiphaneeshk.h.5482]

Not to be a sexist, but that gender graph made me laugh lol

[@Noritoshi-r8m]

Could you wrap the videos a bit? I have job and family, and would love to have time to watch :'D

[@rand0mtv660]

watch on 2x speed lol

[@Mr_Yeah]

For anyone who wants to pronounce Zustand correctly, try to say: "tsoo shunt" (ts like in that's, oo like in soon)

[@alexandrodisla6285]

Expo

[@mooraid]

First

[@t3dotgg]

You even beat the spam bots somehow, impressive

[@jaabel249]

Let's gooooo React Native is the shit!!

[@8-bit510]

nativeWind is slow af!.

[@Rustyshackleford20]

First 10!

[@greendsnow]

react native SUCKS.

[@thisweekinreact]

🫡 My favorite part is resources 😊