Migrating from React Navigation to Expo Router

Поделиться
HTML-код
  • Опубликовано: 29 ноя 2024

Комментарии • 43

  • @galaxies_dev
    @galaxies_dev  9 месяцев назад +2

    Join Galaxies.dev today - the Home of the Best React Native content🚀

  • @ahmadaccino
    @ahmadaccino 9 месяцев назад +9

    glad expo router didn't try to reinvent wheel when it comes to those navigation components even in v2. the best thing a framework can do for adoption is to make the api familiar

    • @galaxies_dev
      @galaxies_dev  9 месяцев назад

      Agree, the transition should feel smooth

  • @storyblocks-m5p
    @storyblocks-m5p 9 месяцев назад +8

    expo router is a game changer thank you Simon

  • @ShortCodeDev
    @ShortCodeDev 9 месяцев назад +2

    🎯 Key Takeaways for quick navigation:
    00:00 *🚀 Expo Router version 3 is discussed for migrating React Navigation applications.*
    01:08 *🛠️ Manual installation of Expo Router involves adding packages and removing unnecessary ones like bottom tabs and Native stack.*
    02:14 *📝 Configuration steps include updating the package.json, setting up an entry point, and modifying the Babel config.*
    03:09 *🔄 Code cleanup involves removing unnecessary files and creating a new index.tsx file as the entry point.*
    05:20 *📊 Creating a tab bar using Expo Router involves creating a layout file and adjusting the code for TS screens.*
    07:46 *🚧 Nested layouts and headers are managed to resolve display issues.*
    09:26 *🧩 Leveraging Expo Router's typed routes involves enabling type routes in app.json for improved code suggestions.*
    16:52 *🌐 Navigation options include using the Link component or the router's push method with specified parameters.*
    19:01 *🔄 Migrating from React Navigation to Expo Router offers benefits like type routes, bundle splitting, and simplified code structure.*

  • @rahulkathayat8542
    @rahulkathayat8542 9 месяцев назад +4

    Hey simon , can you please make a video on how to handle native modules in expo with expo-dev-client and how expo tackles the problem it used to face back in the day with native stuff

    • @galaxies_dev
      @galaxies_dev  9 месяцев назад

      Sure can talk about that - also have a full course on it on Galaxies: galaxies.dev/course/expo-modules

  • @samirtagizade703
    @samirtagizade703 9 месяцев назад +3

    Great one Simon! expo router definetely looks like a go to navigation solution, I wanna try it on one of my projects now, lol

    • @galaxies_dev
      @galaxies_dev  9 месяцев назад

      Yeah give it a try in new apps!

  • @uiuxengineer
    @uiuxengineer 9 месяцев назад +3

    Thank you so much Simon! Great work

  • @FaysalBDev
    @FaysalBDev 8 месяцев назад +2

    super amazing... hope it goes smooth :D

  • @eliecersmora5931
    @eliecersmora5931 3 месяца назад +1

    Thank you brother. Now I undertand how to do it

  • @ricko13
    @ricko13 Месяц назад +1

    yeah all those _layouts and folders are kinda confusing

    • @galaxies_dev
      @galaxies_dev  Месяц назад

      It takes some time to get used to it, yeah :/

  • @willyrosahuanca5884
    @willyrosahuanca5884 9 месяцев назад +2

    Can u share the react navigation video about this so I can start from that.

    • @galaxies_dev
      @galaxies_dev  9 месяцев назад

      I think it was this stream: ruclips.net/video/IhzrgITqOWE/видео.html

  • @ytlagu2010
    @ytlagu2010 5 месяцев назад

    Hey Simon, great video, one quick qn: that cool trick where you draw stuff on the screen, how do you do it? See timeline 13: 36

  • @YashNandha
    @YashNandha 9 месяцев назад +2

    Do we use the Expo router in traditional react native applications ( not expo )

    • @K.Huynh.
      @K.Huynh. 9 месяцев назад

      I have the same question

    • @galaxies_dev
      @galaxies_dev  9 месяцев назад

      I think right now Expo Router only works within Expo projects

  • @praweewongsa
    @praweewongsa 9 месяцев назад +4

    thank you bro

  • @msrajawat298
    @msrajawat298 7 месяцев назад

    Hi Simon, I really liked your video.
    Could help me here ?
    I am working on expo router trying to develop android application. During development I Observe that if I am creating any new file it is showing in menu, like if I am using tab navigation using expo router and created a new file which is showing as menu in bottom tab. Similarly in drawer menu also.
    Can anyone help me how I can fix that issue ?
    However maybe it is default behaviour of expo router but I don't want to show each file in menu.

  • @mhraihan7422
    @mhraihan7422 9 месяцев назад

    can YOU make a vide how to implement native wind with the expo router, please?

    • @galaxies_dev
      @galaxies_dev  9 месяцев назад

      Yes!

    • @mhraihan7422
      @mhraihan7422 9 месяцев назад

      @@galaxies_dev it will be Very much helpful. I tried but could not configured.

    • @-uca--qe7ql
      @-uca--qe7ql 8 месяцев назад

      Same issue, styles are not working with v4

    • @tayoadel5161
      @tayoadel5161 5 месяцев назад

      Still facing issues with this.

  • @olimpioadolfo7498
    @olimpioadolfo7498 9 месяцев назад

    Why expo router is so confusing. Is it possible to use the Stack, Drawer and Tabs navigation on a single app using Expo router?
    It is very possible using React Navigation but with expo router is so confusing

    • @galaxies_dev
      @galaxies_dev  9 месяцев назад

      Sure, you just need multiple _layout files

  • @nikihl-s2k
    @nikihl-s2k 8 месяцев назад

    Expo av video player, how can i achieve landscape mode ?

    • @Mr_Zeal1001
      @Mr_Zeal1001 8 месяцев назад

      Yaa same problem, give me solution Simon

  • @khalilbugti4079
    @khalilbugti4079 9 месяцев назад

    React native cli or expo i am so confused any detail explain please.

    • @galaxies_dev
      @galaxies_dev  9 месяцев назад +1

      Expo, see why here: ruclips.net/video/q-sKCsscIsc/видео.html

  • @bladbimer
    @bladbimer 9 месяцев назад

    Hi everyone, does anyone have an idea on how to cleanly resest the history using this ? I just want to ensure the user can't click on back button mostly during authentication phase such as account creation and logout. Thanks for your help :) if anyone knows.

    • @galaxies_dev
      @galaxies_dev  8 месяцев назад

      Usually you should be fine with "router.replace" as it resets the view stack!

    • @bladbimer
      @bladbimer 8 месяцев назад

      ​​@galaxies_dev thank you for your reply. Well my understsnding of replace was that it replaces the current page history but it maintained the previous history. I did find a way potentially using something like:
      import { Router } from 'expo-router';
      export const clearHistory = (router: Router) => {
      while (router.canGoBack()) {
      router.back();
      }
      };

  • @ExpoDev_Dash
    @ExpoDev_Dash 5 месяцев назад

    couldnt see the tab entire video, your face was not that important