Video není dostupné.
Omlouváme se.

React Native Tutorial #21 - Navigating Around

Sdílet
Vložit
  • čas přidán 7. 08. 2024
  • Hey gang, in this React Native tutorial we'll see how we can use our stack navigator to navigate around our app from screen to screen.
    ----------------------------------------
    🐱‍💻 🐱‍💻 Course Links:
    Course files - github.com/iamshaunjp/react-n...
    🐱‍💻 🐱‍💻 Other Related Courses:
    + Complete React Tutorial - • Complete React Tutoria...
    + React Hooks & Context Tutorial - • React Context & Hooks ...
    + Modern JavaScript Tutorial - • Modern JavaScript Tuto...

Komentáře • 80

  • @stunthumb
    @stunthumb Před 5 měsíci

    Ahah! - finally some actual results... I've been through a few tutorials and forum posts and still couldn't get a stack navigator to work how I want. These videos make it clear and you present them perfectly. Thank you!

  • @vehementvenerableviking9504

    Dude, you are A.M.A.Z.I.N.G!!! Thank you

  • @gibber1sh-c6w
    @gibber1sh-c6w Před rokem +5

    I'm tapping out. Nothing works with the newer version of React Native. It's a shame because it was brilliant up to this point.

    • @kasje
      @kasje Před rokem

      Same.. so frustrating

    • @johnsonlive9173
      @johnsonlive9173 Před 8 měsíci

      this tutorial works in react-navigation 4 but current version uses react-navigation 5

  • @anhquannguyen5111
    @anhquannguyen5111 Před 4 lety

    great video. thank you Ninja ! Merry Christmas !

  • @luke18495
    @luke18495 Před 9 měsíci

    Thank you for this (and the past couple of other ones)... I had already learnt the very basics from another tuturoial however it didn't cover navigation and now I am trying to build my own application I needed to navigate between screens... Lots of other tutorials didn't help me but the way you explained this made it so simple to understand what a stack was and how to use it - thank you!

    • @NetNinja
      @NetNinja  Před 9 měsíci +1

      That's awesome to hear, thanks Luke! :)

  • @kallbacks9677
    @kallbacks9677 Před 4 lety +1

    Very informative video, nice one.

  • @harfangful
    @harfangful Před 3 lety +1

    I love you , you are helping me so much

  • @gabrielmoraes4516
    @gabrielmoraes4516 Před rokem

    Awesome video! thank you!

  • @somench3f
    @somench3f Před 4 lety +1

    Hi, love the content, but I jumped in on the navigation part and was wondering in which video in this series u are talking about the globalstyles and the fontstuff on ur App.js

  • @gulsherkhan5206
    @gulsherkhan5206 Před 4 lety

    very helpful video....thnku Sooo much

  • @visualproject3605
    @visualproject3605 Před 4 lety +4

    Bro you are so good! This lesson is very important , thank you! But if I want to make a button that change screens on a child component, what I have to do? Thank you!

  • @guymross
    @guymross Před 3 lety

    Thank you so much!

  • @rodss3504
    @rodss3504 Před 3 lety +1

    TE MAMASTE, ES EXACTAMENTE LO QUE BUSCABA, GRACIAS!!!!

  • @afro_habesha
    @afro_habesha Před rokem +2

    your teaching method is spectacular

    • @NetNinja
      @NetNinja  Před rokem +1

      Thank you :) that means a lot!

  • @LotfiORouis
    @LotfiORouis Před 2 lety

    Wonderful! Amazing!!!!!!!!

  • @silveiratalita
    @silveiratalita Před 4 lety

    You are the best!

  • @SuperCodepk
    @SuperCodepk Před 4 lety

    Bravo man❤️

  • @md.sahilansari5596
    @md.sahilansari5596 Před 3 lety

    Worthy video 👌

  • @MIDNightPT4
    @MIDNightPT4 Před 2 lety

    AMAZINGGHH TY MAN

  • @hananchehaitly6137
    @hananchehaitly6137 Před 2 lety

    THANK YOUUU

  • @udayjain3985
    @udayjain3985 Před 4 lety +4

    Man the number of things you teach here!! It must take so much effort to first get them down yourself.

  • @arsalanyousaf2759
    @arsalanyousaf2759 Před 4 lety

    love you efforts from pakistan

  • @trk897
    @trk897 Před 3 lety

    thank you

  • @dzlifestyle1434
    @dzlifestyle1434 Před 3 lety +1

    hahaha

  • @anasyousuf485
    @anasyousuf485 Před 3 lety

    ok i tried many times but the variable or function that you made named pressHandler didn't work for me... so i wrote the navigate statement direct to onPress and that worked.

  • @jamalxd5647
    @jamalxd5647 Před rokem

    7:05 so that why we got destucturing{navigation} on every component.. because we have assign them on HomeStack.js is right?

  • @manoj-k
    @manoj-k Před 2 lety

    🔥🔥🔥

  • @user-qc1vj4wk3e
    @user-qc1vj4wk3e Před 4 lety

    Amazing videos. I have one problem, when i try to add a button i can see only the title but not the button it self. I've tried to do npm install react-native-button but it dint 't work.

    • @artursmit5584
      @artursmit5584 Před 4 lety

      Check your operation system, on ios, you will only have clickable text

  • @m2tdev
    @m2tdev Před 3 lety +1

    It seems pretty easy so far. Maybe It is just because you know what you are teaching

  • @phuochoangminhnguyen3031

    I have a problem: I want to navigate from Screen 1 to Screen 2 to Screen 3. So I called:
    + this.props.navigation.navigate("Screen 2") in Screen 1, and
    + this.props.navigation.navigate("Screen 3") in Screen 2.
    And for some reason, it just comes straight from Screen 1 to 3, skipping screen 2. It may be because of the "navigate" command in Screen 2 overlap the one in Screen 1.
    How can I change? Please help.

  • @noraallen5036
    @noraallen5036 Před 3 lety

    i am stuck with this error when i do this
    Invariant Violation: Tried to register two views with the same name RNCSafeAreaProvider
    Can someone help me out?

  • @_BL4CKGaming
    @_BL4CKGaming Před rokem

    Help, undefined navigation, I tried to console.log the navigation

  • @pasindupriyashan385
    @pasindupriyashan385 Před 2 lety

    Sir how i can hide header for somescreens

  • @ItsJustFil
    @ItsJustFil Před 3 lety

    When doing this on the iOS simulator it's not showing a navigation bar with a back button. Is that normal?

    • @ehclipse8764
      @ehclipse8764 Před 3 lety

      I'm doing this on a physical iphone xr and I also don't have a back button.
      EDIT: Nevermind I had headerMode="none" on the "Navigator" tag

  • @komalgardi2406
    @komalgardi2406 Před 3 lety +2

    Hello sir I watch this video and previous one also, according to the instructions i did all steps but i am getting error like "Unable to resolve "react-navigation" from "routes\homeStack.js"" please suggest something

    • @TheAdel136
      @TheAdel136 Před 3 lety +2

      hello komal this is probably due to the React navigator version 5 ... just uninstal all your packages and dependencies and install the new ones like this :
      1- npm install @react-navigation/native
      2- then you install the second package for expo like this =>
      expo install react-native-gesture-handler react-native-reanimated react-native-screens react-native-safe-area-context @react-native-community/masked-view
      3- then type =>
      npm install react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context @react-native-community/masked-view
      4- finally import react native gesture handlebar on the top of your App.js (make sure that it is on the top and nothing else is before it ) like this for exemple :
      import 'react-native-gesture-handler'
      import * as React from 'react';
      import { View, Text } from 'react-native';
      ... etc !!
      now you can safely do the job ;) hope that it will give you the needed help bro

    • @komalgardi2406
      @komalgardi2406 Před 3 lety +2

      @@TheAdel136 Thanks a lot sir for giving your precious time to answer my query. Your solutios and rest of the vedios on navigation really helps for me.
      Thanks a lot again sir.

    • @TheAdel136
      @TheAdel136 Před 3 lety +1

      @@komalgardi2406 i'am glad that it was helpful for you !! lot of love

  • @ahmedkayali4285
    @ahmedkayali4285 Před 4 lety +5

    very powerful tutorial but unfortunately the navigation 5 is different. Hope to see new tutorials in navigation 5

    • @maximebarber3780
      @maximebarber3780 Před 4 lety +2

      I've shared the code to implement react-navigation 5 here: github.com/maximebarber/reviews-app/tree/react-navigation-5

    • @perezcpt
      @perezcpt Před 4 lety

      @@maximebarber3780Wow!! Thank you so much. You got a subscriber and a follower on github!!

    • @sarahismail-ob4is
      @sarahismail-ob4is Před 4 lety

      @@maximebarber3780 hai, my 'Home' can't seem to accept ({navigation}). Can you help me with this ? Thanks !

  • @songwright
    @songwright Před 2 lety

    This didn't work for me. I had to work from the documentation at hello react navigation.

  • @anuragbhalekar4315
    @anuragbhalekar4315 Před 3 lety

    This was a function, but how to do it with a class?
    Ans: this.props.navigation.navigate('class_name');

  • @msvmanikantasrivishnu7788

    1st comment

  • @alexc7095
    @alexc7095 Před 4 lety

    If you are sick and tired of youtube's ads like and share and spread this message. Enough ads !

    • @wilsonb4175
      @wilsonb4175 Před 4 lety +2

      buy a youtube plan and will not see any ads.

    • @alexc7095
      @alexc7095 Před 4 lety

      @@wilsonb4175 dude get lost. The internet was originally made for the military and to share research data not so that some moron tells us to buy "no-ads" because how i see it... some people pay to shove ads down your throat and other people should pay not to have ads shoved down their throats..

    • @NetNinja
      @NetNinja  Před 4 lety +13

      The only way I make money off CZcams is via the ads, without them, I wouldn't be able to keep doing tutorials for free.

    • @paristar3079
      @paristar3079 Před 4 lety +5

      @@NetNinja You are doing great. Other charges hundreds of dollars for React or other courses.

  • @bilelrahmouni01
    @bilelrahmouni01 Před 3 lety

    thank you