Context API in React JS in Hindi in 2020 #51

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

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

  • @ThapaTechnical
    @ThapaTechnical  4 года назад +55

    Guys, Finally video after 2 long days :) everything is fine now... Hope you like the video :)

    • @tarunjoshi1106
      @tarunjoshi1106 4 года назад

      Sir COVID 19 india ke api ka use krke React Js mai bhi bnao 👌☺️
      Jo data ko display kre properly 😋👌

    • @tarunjoshi1106
      @tarunjoshi1106 4 года назад

      🤣🤣🤣 wtf I was doing 2 months ago.

    • @letsknowthis1862
      @letsknowthis1862 4 года назад +1

      hii vinod your doing very good job we are fallowing your tutorial but it is not good to ask money in the middle of the cousre for code you can do live coding we will super chat you..hope you understand

    • @mananbari4725
      @mananbari4725 4 года назад

      @Thapa%Technical Can you please make a video for Global state Context and Hooks

    • @sallbro786
      @sallbro786 3 года назад

      const Firstname= useContext ();
      when I am exporting Firstname
      Showing:-
      Export 'Firstname' is not defined

  • @ayyasudeen3118
    @ayyasudeen3118 4 года назад +47

    Bhai, I am a Tamil. My Hindi is average but I am able to understand your tutorials very well. You are an amazing teacher! Thank you very much!

    • @entertainmentcreations7661
      @entertainmentcreations7661 Год назад +2

      You need to learn Hindi bro

    • @raviiirathore9984
      @raviiirathore9984 Год назад +1

      ​@@entertainmentcreations7661
      Why he should learn Hindi ?

    • @pradattaaryal3523
      @pradattaaryal3523 Год назад

      @@raviiirathore9984vinod is from nepal pokhara

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

      @@raviiirathore9984 bcz i am in karnataka they are forcing me to learn kannada so he need to learn HINDI.

    • @0254Manoj
      @0254Manoj Месяц назад

      @@entertainmentcreations7661 Just like you he is a Tamil, Vinod is a Nepali/North East

  • @islamicbeautifulvibes454
    @islamicbeautifulvibes454 Год назад +2

    your method is very amazing thank you so much dill kya aj comment krny ko you are best teacher Allah apko hmsha slamat rkhy FROM PAKISTAN

  • @sugandhasharma5484
    @sugandhasharma5484 3 года назад +2

    Excellent!!! bade bade Technical youtubers fail hain aapke saamne Sir.

  • @LearnerAbhi21
    @LearnerAbhi21 4 месяца назад +2

    4 year ago on same date, this video uploaded, 12june2020, i was studying chem mcq, for cet exam, and now, on same date 12june 2024, i am studying reactjs, after 4 years, how time flies i surprise, idk may be on same date after 4 years, i may be in top mnc employee,, or may be businessman of startup, who know what happens, life is really really random unpredictable.

  • @ErYash6
    @ErYash6 3 года назад +2

    Finally Confusion got clear .Thanks for Making such types of videos...

  • @Uk_mandiii
    @Uk_mandiii 3 года назад +1

    Kamal ka technical methode bro learn only in this video context api

  • @tejendrarajawat4054
    @tejendrarajawat4054 3 года назад +12

    Your lectures are very underrated 👍

  • @fayeazahmedrhythm7460
    @fayeazahmedrhythm7460 4 года назад +4

    Vai, amazing. I just got to context api two days ago, watched some videos, and was confused. A lot of things got cleared after watching this video, waiting eagerly for the video on useContext. Thank you!

  • @knowledgeera3210
    @knowledgeera3210 3 года назад +3

    why we are passing in Context as we are not using that in cosumner

  • @raunak0811
    @raunak0811 Год назад

    best explanation i got after watching 20 videos

  • @soniapadhi7471
    @soniapadhi7471 6 месяцев назад

    You are an amazing teacher! Thank you very much!

  • @aniketmasram6500
    @aniketmasram6500 3 года назад +1

    Thank you soo much bhaiya, you are the real provider ❤️🙏🏻

  • @electroviper5931
    @electroviper5931 3 года назад +1

    2:11 most funniest part of this tutorial so far 😆

  • @gmmkeshav
    @gmmkeshav Год назад

    Wa Vinod bhai you killed it

  • @pratikfulkar4335
    @pratikfulkar4335 3 года назад +1

    bhai bhai jabardast
    maza hi aa gaya

  • @akashvenu359
    @akashvenu359 2 года назад +1

    I like the part when you say "boom guys"..Thank you for the superb content

  • @debopamseal1072
    @debopamseal1072 3 года назад

    Ghanto waste hone se bacha diya. Succinct and informative!

  • @rajat-s-kale1771
    @rajat-s-kale1771 Год назад

    Your teaching is awesome bro

  • @deepaksharma69
    @deepaksharma69 Год назад

    14:15 We have already export default App then why we need to export the FirstName again?

  • @binodkhatri7738
    @binodkhatri7738 2 года назад

    Thankyou ,,awesome video, easy to understand, keep providing this kind of video❤

  • @deepikakapoor9607
    @deepikakapoor9607 4 года назад +2

    Thank you so much ☺️ n voice ko edit kiya hai na apne.. bold acha lag rha hai

  • @major7055
    @major7055 2 года назад

    that was very simple and easy to undestand, thankyou

  • @sweekardahal9811
    @sweekardahal9811 3 года назад

    You're a great teacher . I really appreciate your videos .

  • @Niteshmaurya1234
    @Niteshmaurya1234 10 месяцев назад

    bhai mast video thi ek dam samjh a gaya

  • @zakiasultana1234
    @zakiasultana1234 2 года назад +2

    U made everything easy.Lots of thanks and respect.No doubt u r the best of best.

  • @webdeveshverma3214
    @webdeveshverma3214 2 года назад

    love u sir ji maja aagya topic clear

  • @periodictech4248
    @periodictech4248 3 года назад

    Bhot easy explanation kia h.. Thanks

  • @abdullahanwar8064
    @abdullahanwar8064 4 года назад +2

    sir 1 confusion ha kay jab app.jsx main saye data export ho kar component C main show ho raha tho ap nay firsname context kay ndr compA ko kun rakha is matlab data tho link ha dubara hum agar

  • @AdityaG.
    @AdityaG. Год назад

    "Context Hell" could be the perfect word... BTW great video..thanks

  • @prateek4524
    @prateek4524 4 года назад +1

    amazing explanation thankyou so much..🔥💪💪

  • @buildleadinnovate24
    @buildleadinnovate24 4 года назад +2

    Difference between redux and context api??
    there is no App.jsx file in my react app

    • @shibinraja
      @shibinraja 4 года назад +1

      it might be named app.js , js is a defined term for javascript xml . either of this is perfect. Redux is a global state management which store the data in the store and we can retrieve the values in the component where it is needed in spite of the parent / children component. Context api also does the same but not meant for large scale . In company projects ots used to maintain theme , small arc in it which can be changed when needed but not frequently.

  • @irushabasukala871
    @irushabasukala871 3 года назад

    hellooo,Thapa technical!! you have explained so simply ,Thank youu and btw,your name seems to be Nepali?

  • @LearningWithNaveen
    @LearningWithNaveen 3 года назад

    Consumer mai jo function bnaya hua hai, with name ka function hai, waise aise function ko kya bolte hai..... bhai ye muje smj nhi aa rha hai.

  • @sumitkawale9878
    @sumitkawale9878 2 года назад +1

    we can create a variable with value and export it and directly access it in any component, then why we need this. In both cases exporting and importing is required. ulta simpla variable se code kam ho jayega..

  • @rahulpanchal6399
    @rahulpanchal6399 3 года назад +9

    Hi, can u please arrange a tutorial for persisting redux state with multiple reducers. Thanks in advance.

  • @nicetomeetugaming7024
    @nicetomeetugaming7024 2 года назад

    Amazing video boss!

  • @sushantrahane4512
    @sushantrahane4512 3 года назад +1

    You can pass value by export import method also then why we use context api is it necessary?

    • @anonymous2982
      @anonymous2982 3 года назад

      Yes i have this doubt too

    • @kushalthapa3548
      @kushalthapa3548 3 года назад

      3 2 1 and boom guys. !!

    • @shehrozetalat2617
      @shehrozetalat2617 3 года назад

      hard coded constant data yes, can be used via exports. But using context we can pass in states and setState method which constantly update.

  • @dishashah4197
    @dishashah4197 Год назад

    Great explanation 👍

  • @lokeshnaidu1935
    @lokeshnaidu1935 2 года назад +1

    You're awesome man, Very simple and cool explanation

  • @88advait
    @88advait 2 года назад

    Amazing explanation..!

  • @madhavjha844
    @madhavjha844 2 года назад

    Ye code react 18 me kaam nahi kar rha, context api ko react 18 me remove kar diya hai kya ??

  • @meriChhotiDuniya
    @meriChhotiDuniya 3 года назад

    I couldn't understand why we are nesting all the contexts? Suppose we have a bunch of contexts.then?

  • @MayaKaSafarnama
    @MayaKaSafarnama 3 месяца назад

    I have my technical interview for reactJs.. guide and suggest what else to do for preparation.

  • @innovative-thoughts
    @innovative-thoughts 4 года назад +1

    useContent can be used out of the component? I'm doing so but getting error. Following the same method but getting an error on export { DataVar } "Parsing error: Export 'DataVar' is not defined"
    Please guide me. Thanks

    • @steplittle3516
      @steplittle3516 4 года назад

      sir can u help me why value show undefined
      please check the code
      codesandbox.io/s/winter-moon-1zhmw?file=/src/App.js
      i have same problem sir can u help me

    • @shibinraja
      @shibinraja 4 года назад

      @@steplittle3516 i cant see any prob in your file , you have used useContext to set up a consumer to Tab component

  • @banditalks
    @banditalks 4 года назад +1

    Bro we can use props right i mean we can import component C in app.js and add some props we can use same props in compC by importing App right.... is that wrong practice????

    • @rehanhamayun1353
      @rehanhamayun1353 4 года назад

      its better idea

    • @shibinraja
      @shibinraja 4 года назад

      if you import compc , the details provided in com a and comb b wont be available in screen coz your providing directly and updating in virtual dom. Since, Vinod hasn't done anything in Com A and Com B , you thought it will be easy to import that, but if it has values in it. We have to use state management.

  • @NischalShakya-b8n
    @NischalShakya-b8n Год назад

    Rendering directly is not supported and will be removed in a future major release. Did you mean to render instead?
    I get this error what do I do?

  • @covidnineteen5249
    @covidnineteen5249 4 года назад +2

    Sir love your videos.Sir ek local storage pe video bnaoge pls

  • @harshKumar-sr4mw
    @harshKumar-sr4mw 4 года назад

    Great explanation sir thanks for this

  • @nikhil007g
    @nikhil007g 4 года назад

    App m context h to aagar context ki value change hogi to sirf c refresh hoga ya a b and c ?

  • @04.nehalsingh12
    @04.nehalsingh12 3 года назад

    awesome tutorial sir

  • @tarunjoshi1106
    @tarunjoshi1106 4 года назад +3

    Sir COVID 19 india ke api ka use krke React Js mai bhi bnao 👌☺️
    Jo data ko display kre properly 😋👌

  • @CodeWithSajjan
    @CodeWithSajjan 4 года назад +1

    thapa bhai please also create a mega project using react js like ecommerce web app or chat app

  • @adnanyousaf4862
    @adnanyousaf4862 3 года назад +1

    Brother I want to ask one question can you help me (I am perfect in frontend development but I am weak in programming logic building) can you help me

  • @umaphalke5786
    @umaphalke5786 3 года назад

    It helps me alot thank you👍🏻

  • @anandgomaskar2210
    @anandgomaskar2210 Год назад

    thanku so much upload this video it 's need

  • @punjabikids2942
    @punjabikids2942 2 года назад

    I am not getting that why you import 'ComA' inside App.jsx and use while working with "createContext" . if I import either of ComB Or ComC inside "App.jsx" even then the project also works.
    Request to povide the Clarification on it
    Regards

    • @skskssss126
      @skskssss126 2 года назад +1

      the main use of context is to drill or pass data to children component which is very complicated if you use props because you will have to pass props in every component in the hierarchy to get to the lowest component. That's why he made ComC so that he can show how to pass data from parent element i.e. App> ComA>ComB>ComC.

  • @hemanttopi1
    @hemanttopi1 2 года назад

    Can I pass data throw props. And how will be achieved. I am tried but not success

  • @yashkore7030
    @yashkore7030 4 года назад +2

    bro ur explanation is super and each video is uploading morethan 1time in the playlist can u resolve this issue

  • @jatinyadu9183
    @jatinyadu9183 3 года назад

    Error: App(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.
    why this error occured

  • @razikkhan2637
    @razikkhan2637 4 года назад +1

    Sir component c ko bhi to hum directly App.js me call krr skte hai import krk

    • @shibinraja
      @shibinraja 4 года назад

      if you import compc , the details provided in com a and comb b wont be available in screen coz your providing directly and updating in virtual dom. Since, Vinod hasn't done anything in Com A and Com B , you thought it will be easy to import that, but if it has values in it. We have to use state management

  • @hamzailyas8632
    @hamzailyas8632 2 года назад

    I am getting this warning when i am returning any thing inside the Consumer. How can I solve this ?
    Warning: Functions are not valid as a React child. This may happen if you return a Component instead of from render. Or maybe you meant to call this function rather than return it

  • @abdullahirshad1276
    @abdullahirshad1276 3 года назад +1

    Sir is it a replacement for redux?

    • @kashmirtechtv2948
      @kashmirtechtv2948 2 года назад

      Yes. UseContext hook and Context Api when work together minimize the need of Redux to a great extent.

  • @AnkitKumar-yf6wd
    @AnkitKumar-yf6wd 3 года назад +1

    Thank you so much sir .

  • @mr.ramnani
    @mr.ramnani 3 года назад

    oh godd loved that example xD

  • @buildleadinnovate24
    @buildleadinnovate24 4 года назад

    hii whats difference here between js vs jsx file you created here

    • @shibinraja
      @shibinraja 4 года назад +1

      React uses jsx to create a component which render to react component which can be seen in index,js. JSX is javascript xml . Extension doesnt matter when creating file everything is js object. the things written in a component should be of jsx , which takes js objects embeded in xml defined tags.

  • @aliadnanasim4420
    @aliadnanasim4420 4 года назад

    sir extention bta dain please apnay nichay createContext likha pr wo opper khud hi likha gaya is extention ka name bta dain plzz

  • @ranjanvashist321
    @ranjanvashist321 2 года назад

    And boom guys😍

  • @adilrao7777
    @adilrao7777 4 года назад +1

    This is oxm vedio...
    But Sir how we can pass the value without wrap a component inside Context.Provider??
    Like,
    No any component...
    Onliy some JSX
    Sir plz answer this.. kindly

    • @shibinraja
      @shibinraja 4 года назад

      without any component to whom you are providing the value?

    • @skskssss126
      @skskssss126 2 года назад

      what's the use of context if you don't want to pass down value

  • @TKP-info
    @TKP-info 4 года назад

    why creating multiple consumer, we can pass data as object

  • @tubetalk007
    @tubetalk007 Год назад +2

    3 2 1 and boom guys XD

  • @mdzohaib7368
    @mdzohaib7368 4 года назад

    I am getting an error- TypeError: Render is not a function.
    Can anyone help me!

  • @amanrathore8810
    @amanrathore8810 4 года назад +9

    Sir why r u calling in App.js ...

    • @RITIKJAINBCE
      @RITIKJAINBCE 4 года назад +5

      becozz data of comC will pass to comB, data of comB will pass to comA, data of comA will pass to App.jsx....and finally data of App.jsx will pass to index.js

    • @shibinraja
      @shibinraja 4 года назад

      coz thats the parent component of ComB and ComC. So the value from a to c or c to a (children to parent) has to be passed so that it can update in app.js which can update in index,js

    • @tayyabzaman7046
      @tayyabzaman7046 2 года назад

      Yup exactly same question.. If I consider these two answers than the question is why we use context... Because we say we want to directly exchange data between App.jsx and comC.jsx
      So the question is again
      Why we import comA in App.jsx?

  • @DeepakGupta-hj2dv
    @DeepakGupta-hj2dv 4 года назад +1

    Flux pr video kab aayega....flux implementation

  • @ujjwaljain9780
    @ujjwaljain9780 4 года назад

    why my component is rendering when i passing "hello world " in compA and calling comA in App.js ,anyone have any idea

  • @DeepakGupta-hj2dv
    @DeepakGupta-hj2dv 4 года назад +1

    Redux pr bhi video bnayoge kya please reply?

  • @nazimfirdousali6952
    @nazimfirdousali6952 3 года назад

    How if i fetch the data in child A and show it to child B by context without making provider value in index/app.js

  • @kishor-jena
    @kishor-jena 3 года назад

    child element kaise parent element ko value pass karega using contexts?

  • @sallbro786
    @sallbro786 3 года назад

    const Firstname= useContext ();
    when I am exporting Firstname
    Showing:-
    Export 'Firstname' is not defined

  • @mahmad8538
    @mahmad8538 3 года назад

    Helpful 😇

  • @sharadguragain6999
    @sharadguragain6999 2 года назад

    what if we passed compC directly to the parent components?

    • @ashokmehta3645
      @ashokmehta3645 2 года назад

      Best way to do this is to create context and state component sepratelty.And passing the component as props child

  • @pramod6844
    @pramod6844 3 года назад

    Hi Vinod, instead of createContext() with variable can we do it by array?

  • @mohammedaqibi4040
    @mohammedaqibi4040 4 года назад

    Bhai node js better hai ya django kounsa sikhna best rahega

    • @ThapaTechnical
      @ThapaTechnical  4 года назад

      it depends bro.. I will go with node for now

    • @mohammedaqibi4040
      @mohammedaqibi4040 4 года назад

      @@ThapaTechnical ok bhai tysm bhai koi aapki group hai to pls mjhe bhi add kar dijiye

  • @shoaibz1112
    @shoaibz1112 3 года назад

    Is there any way to find child components which using same props from upper level.

  • @solmindaudy
    @solmindaudy 3 года назад

    Everything is at its best . Just stop using the word "PURRRFECT" ;)

  • @mukulchaudhary27
    @mukulchaudhary27 3 года назад

    bro, please tell me how do you multi-line typing

  • @shantanukulkarni6360
    @shantanukulkarni6360 3 года назад +2

    Please focus on naming convention also 11:15 .

  • @salilbhatnagar9736
    @salilbhatnagar9736 3 года назад

    I call in context API used in API Call is possible

  • @shibinraja
    @shibinraja 4 года назад

    Bhai how come this is call back hell , we are not passing a function as an argument to another function where we will return the parameter and call the previous function indefinitely. I think the most suitable thing to refers is high order function which accepts a parameter as function and returns another functions. Btw , learned a lot from you. Thank you and keep going.

  • @munendrasingh848
    @munendrasingh848 3 года назад

    how to create a code in asp.net core web Api for dynamic otp generated in my mobile number using swagger on post method and we will be save all field (as name , EmployeeId and Mobilenumber etc.. )in Db also , Plz Sir tell me it's urgent.

  • @sanchitsingh23
    @sanchitsingh23 4 года назад +1

    Hi, Can you please tell me how to call Json Api in react js..

    • @ThapaTechnical
      @ThapaTechnical  4 года назад +2

      I will try to make a video on it

    • @pranilkharche320
      @pranilkharche320 4 года назад +1

      use Axios

    • @shibinraja
      @shibinraja 4 года назад

      usefetch or axios to call Json api and fetch only in app,js not in other components.

  • @samliprajapati7383
    @samliprajapati7383 4 года назад

    Hii apki vedio bht achi hai kya apne Real dom vs virtual dom ka vedio bnaya hai to plss mujhe uska link forward kariye agar nahi to please ap ispe ek vedio bnaiye mujhe av tk thik s samjh nahi aya hai real dom or virtual dom m difference kya hai

  • @abh1nn
    @abh1nn 4 года назад

    Can we update the values in Provider?

  • @sedmochill4707
    @sedmochill4707 3 года назад

    😂 this specific tutorial is funny bcs of those errors

  • @DEEPANSHU_NAG
    @DEEPANSHU_NAG 4 года назад

    PC assemble ho gya ?
    Laptop thik ho gya ?
    Laptop me video decoding kiye h ?

  • @Alert-ur5oz
    @Alert-ur5oz 6 месяцев назад

    bhai index.js file me ky rhga usme bhi hamee App component ko call krna honga?
    pls reply @ThapaTechnical im waiting

  • @rajbannasa7662
    @rajbannasa7662 3 года назад

    thank you so much sir

  • @creativeakshara8438
    @creativeakshara8438 4 года назад +1

    Computer assembled 🤔
    Bhai please Canvas tutorials bana do🙏

  • @nomanahmed4085
    @nomanahmed4085 4 года назад

    please make video on UseReducer.

  • @abcool0801
    @abcool0801 4 года назад +1

    yahe to chahiye tha ab start hui h asli react to