Using Fetch API in React to populate NewsItems | Complete React Course in Hindi #27

Поділитися
Вставка
  • Опубліковано 17 гру 2024

КОМЕНТАРІ • 557

  • @CodeWithHarry
    @CodeWithHarry  3 роки тому +26

    Playlist access kar lena: ua-cam.com/play/PLu0W_9lII9agx66oZnT6IyhcMIbUMNMdt.html
    If you are on Instagram, you can follow me there for more updates on courses & other stuff: instagram.com/codewithharry

    • @adarshjaiswal2312
      @adarshjaiswal2312 2 роки тому +1

      hi harry
      where we can get full code

    • @REXWILLRISE831
      @REXWILLRISE831 8 місяців тому

      @@adarshjaiswal2312 plz batao harry bhai

    • @TareerMustafa
      @TareerMustafa 4 місяці тому

      Haris Bhai CompTIA A+ CompTIA security+ CEH pr networking pr videos banaden

  • @shashwatagrawal8412
    @shashwatagrawal8412 3 роки тому +29

    Maza aagya bhai... Can't tell how blessed I feel to have discovered your course and also your channel. :)

  • @SinmbfLost
    @SinmbfLost Рік тому +14

    If you want to make all the cards to equal height then follow this:
    In the div with className="card" , add a class called "h-100".
    Now every card should be of same height but the buttons are not aligned properly due to the difference in content of the different cards. To fix this, in the div with className="card-body", add classes "d-flex flex-column". Then finally, in the read more button add a class "mt-auto".
    This should make every card equal height and make them look better. If any problems, feel free to ask :)

    • @ummi7292
      @ummi7292 8 місяців тому +1

      Hi ..could you plz let me know why the fetch api was used in componentDidMount() and not in the constructor(). I understand it means the fetch API happens after rendering but my question is "why"? Why can't it happen at the very outset ?

    • @ahmadrasheed2598
      @ahmadrasheed2598 3 місяці тому +1

      @@ummi7292 Because you cannot make a constructor async in JavaScript.
      if we use fetch() API without async and await then it will asign value to data variable as a pending promise (it will assign varaible first because of Asynchronous nature of JS )

  • @maneetkaur4214
    @maneetkaur4214 2 роки тому +30

    When I was following the code by Harry Bhai there got an error when fetching the data from the API. this is what I did to resolve the error (I guess this would work for you ) :
    async componentDidMount(){
    try{
    const res = await fetch(url);
    const data = await res.json();
    this.setState({
    articles: data.articles
    });
    }
    catch(e) {
    console.log("something is not working");
    }
    }
    PS. You can use axios too

  • @faizshaikh5092
    @faizshaikh5092 2 роки тому +16

    Hello, Harry Bhai! You can use below code for adding three dots to title and description of
    news:
    style={{maxWidth: '100%',
    display: '-webkit-box',
    WebkitBoxOrient: 'vertical',
    WebkitLineClamp: 2,
    overflow: 'hidden',
    textOverflow: 'ellipsis'}}
    Thank you! Love from solapur

    • @kamalpurohit7158
      @kamalpurohit7158 2 роки тому +1

      are bro direct jake text-truncate class use kro na khel khatam

    • @kamalpurohit7158
      @kamalpurohit7158 2 роки тому +1

      bootstrap class h text-truncate u can see

    • @rinkuverma5093
      @rinkuverma5093 2 роки тому

      www.youtube.com/@advanceduitechniques516

    • @thecosmetrohub2737
      @thecosmetrohub2737 Рік тому +1

      @@kamalpurohit7158



      but i am not getting 3 dots at end

    • @braveviewing3830
      @braveviewing3830 Рік тому

      @@thecosmetrohub2737 use text-truncate inside tags of NewsItem component where you defined title and description and it will work

  • @anantdhiman4189
    @anantdhiman4189 3 роки тому +23

    i recently start following this course and i am loving it, thank you so much
    while learning "fetch" i was getting this error "TypeError: Cannot read properties of undefined (reading 'map')"
    From reactjs Docs - this is what i found and works for me, may be it helps other too
    fetch(url).then((res) => res.json())
    .then((json) => {
    this.setState({
    articles: json.articles,
    loading: false
    });
    })

    • @rushikeshsaraf6219
      @rushikeshsaraf6219 3 роки тому +4

      bro after one hour finally i got solution

    • @rushikeshsaraf6219
      @rushikeshsaraf6219 3 роки тому +12

      Update ur constructor like this :
      constructor() {
      super();
      this.state = {
      articles : [],
      loading : false
      }
      }

    • @anantdhiman4189
      @anantdhiman4189 3 роки тому +1

      Thank you @rushikesh
      I did realised, I didn’t use await :)

    • @anjanisharma9509
      @anjanisharma9509 3 роки тому

      @@anantdhiman4189 yes

    • @fantasycube2482
      @fantasycube2482 3 роки тому

      @@rushikeshsaraf6219 thank you so much you make life life ! other wise i am looking length and array

  • @nothingmuch9346
    @nothingmuch9346 3 роки тому +2

    Class 9 me hun phir bhi Harry bhai ka ds algo smjh gya itna accha explained hain

  • @AmitKumar-xx7zj
    @AmitKumar-xx7zj Рік тому +2

    Thank you Harry bhai for such an awesome course

  • @CodeWhy
    @CodeWhy 3 роки тому +1

    @codewithharry you are my favourite youtuber. Love you bro☺️☺️☺️☺️

  • @tejaskumar4470
    @tejaskumar4470 3 роки тому +2

    Wow!!!! 🔥🔥 Harry Bhai 😀

  • @shi-nee7966
    @shi-nee7966 3 роки тому +1

    For the algorithem. Altho i bought a course on udemy before this course started but i know harry bhai's the best. So im liking and commenting on every video for the algo.

  • @ajayarya1193
    @ajayarya1193 Рік тому +12

    Hello, buddy, if you're also get stuck with same problem I had been, just paste it
    async componentDidMount() {
    fetch("url").then((response) => response.json())
    .then((data) => {
    this.setState({
    articles: data.articles
    });
    });
    },
    If anyone can explain me why the old one did not work please help me out.

    • @nishantchaudhary6240
      @nishantchaudhary6240 Рік тому +1

      you are life saver

    • @gopalsharma9364
      @gopalsharma9364 Рік тому +1

      Dil se sukriya bhai❤

    • @pooja6380
      @pooja6380 Рік тому

      thank you i was stuck here from 2 days

    • @sehajdeepsingh7427
      @sehajdeepsingh7427 Рік тому +1

      Hii, i am still stuck with not getting any news from api show on the browser.
      I can see thtat the api is working as I can see the result in console tab, but not on the web page.
      No error is displaying as well

    • @sehajdeepsingh7427
      @sehajdeepsingh7427 Рік тому

      Hii, i am still stuck with not getting any news from api show on the browser.
      I can see thtat the api is working as I can see the result in console tab, but not on the web page.
      No error is displaying as well

  • @itsmytechnology9285
    @itsmytechnology9285 3 роки тому +2

    Harry Bhai OP!!!! 🔥😊

  • @aayushsingh74
    @aayushsingh74 Рік тому +1

    harry bhai 7:47 hum element.title && element.title.slice(); and same for description also bhi use kr skte hai nah maine wahi kiya tha aur usse thik hogya tha.....

  • @sarasazad9174
    @sarasazad9174 5 місяців тому

    Anand aa rha hai Hary bhai! Excellent you are

  • @MensAttitude
    @MensAttitude 9 місяців тому +3

    If render is called before the componentdidmount, then how articles is being displayed on the page. Because page will be rendered first, and after rendering the page component did mount will be called where we are fetching the data from API?

    • @chandreshsolanki7580
      @chandreshsolanki7580 7 місяців тому

      I think that's why he used async await function which stops all other function and fetch data and then render so using async function it will wait for fetching and then render page

    • @ashishrao4273
      @ashishrao4273 4 місяці тому

      I implemented the same and I’m facing the same issue

  • @Amal-qh3uu
    @Amal-qh3uu 3 роки тому +1

    Harry bhai on fire !!

  • @framed5893
    @framed5893 Рік тому +20

    If someone is getting error "Cannot read properties of undefined (reading 'map')" then use this this.state.articles && this.state.articles.map((element) ....

    • @avadhut0007
      @avadhut0007 Рік тому

      Can you explain me

    • @framed5893
      @framed5893 Рік тому +3

      @@avadhut0007 It checks whether the array is NULL or not, if it is null then (i.e it will check this.state.articles is NULL or not ), if it is null then it will not run the code. We have to do this because if it is null then .map function will throw error.

    • @Ashwani_sharma
      @Ashwani_sharma Рік тому

      ​@@framed5893sir ,I tried this but card item is not showing

    • @LetslearnTruth
      @LetslearnTruth Рік тому +2

      Check if you added () after json like data.json();

    • @IKnowYourSecret989
      @IKnowYourSecret989 Рік тому +1

      After 2h of struggle I found out I have a spelling mistake, (articles -> articels) 🌚

  • @loveleensingh1805
    @loveleensingh1805 2 роки тому

    Your explanation is awsome you are my inspiration

  • @psychoticgamer6853
    @psychoticgamer6853 3 роки тому +1

    Angaar... 🔥🚀

  • @ashishvispute2715
    @ashishvispute2715 2 роки тому +13

    for those whose componentDidMount is not working i found this syntax and it worked for me
    here is my News.Js file
    import React, { Component } from 'react'
    import NeswItem from './NewsItem'
    export class News extends Component {
    constructor(){
    super();
    this.state={
    data : null,
    loading : false
    }
    }
    componentDidMount(){
    let url = //your url
    fetch(url).then((res)=>{
    res.json().then((result)=>{
    console.log(result.articles)
    this.setState({data:result.articles})
    })
    })
    }
    render() {
    return (




    Top Headlines

    {this.state.data ?
    this.state.data.map((element)=>



    )
    : null
    }




    )
    }
    }
    export default News

  • @mohituniyal7
    @mohituniyal7 3 роки тому +2

    I would comment in every video till you don't reply. I am really thankful to you. I didn't have cs in 12th but learned programming c and CPP from your videos and still learning. Moreover, I got a confidence boost. Once again thank you for your efforts.

  • @khuzaimaamir8458
    @khuzaimaamir8458 Рік тому +2

    if anybody having error for undefined:state
    Simply add this to componentDidMount :
    .then(response => response.json())
    .then(data => this.setState({ articles: data, loading: false }));

    • @rahulvishwakarma9640
      @rahulvishwakarma9640 Рік тому

      Bro please can you send the full code pls i am facing this error from last two days

    • @khuzaimaamir8458
      @khuzaimaamir8458 Рік тому

      @@rahulvishwakarma9640 send me your number

    • @rupalsaxena9837
      @rupalsaxena9837 Рік тому

      same question...can you paste your code here

  • @motivationallaround8561
    @motivationallaround8561 Рік тому

    Aanand aa raha h Harry bhaii♥

  • @prajedits4065
    @prajedits4065 Рік тому

    Done with #27 Thank YOU!!
    🥳

  • @AsyncGaming
    @AsyncGaming 3 роки тому

    Bhai aaj toh aapne mauj kardi ek ke baad ek videos♥️♥️

  • @HariomSingh-ei4fb
    @HariomSingh-ei4fb 2 роки тому +1

    This video series is very very helpful and interesting
    Thanks alot Harry bhaiii♥️

    • @rahulmaurya2558
      @rahulmaurya2558 2 роки тому

      I'm totally getting blank page after writing all the codes and in the console its showing the 20 objects I don't know where is the error?

  • @abhayvis
    @abhayvis 3 роки тому +5

    Harry is on fire 🔥

    • @tajinder715
      @tajinder715 Рік тому

      it is no harm pay no attention to it

  • @ManojKumar-ul1qp
    @ManojKumar-ul1qp Рік тому

    Harry bhai sahi mein maza agaya. You are the best teacher and I like your voice very much ❤️

  • @ArunKumar-jg8gx
    @ArunKumar-jg8gx 2 роки тому

    East or west Harry Bhaiya Best 🔥😍

  • @PrabinManandhar-y5l
    @PrabinManandhar-y5l 9 місяців тому +1

    hey harry one question, first the constructor is called then render is called and only then componentdidmount is called which brings the data. if render is called before componentdidmount, then how is the fetched data rendered and shown to our page

    • @chandreshsolanki7580
      @chandreshsolanki7580 7 місяців тому

      I think because he used asyn await so the execution of another function stopped and first componentdidmount called and then render

    • @delhiwarriorgaming2882
      @delhiwarriorgaming2882 4 місяці тому +1

      componentdidmount function re-renders the page immediatly after changing the state..thus first constructor then render then componentdidmount then render again..

  • @lavanyabisht5984
    @lavanyabisht5984 8 місяців тому +1

    I am having a problem during console log after running constructor render cdn again render is running why if you know the problem help out

  • @Armaan-yv1se
    @Armaan-yv1se 6 місяців тому +1

    My headlines are not getting populated on browser and there's no issue in compilation and it's not showing any error.. How to resolve it???

  • @AMITKUMAR-np7el
    @AMITKUMAR-np7el 2 роки тому +4

    i recently start following this course and i am loving it, thank you so much
    while learning "fetch" i was getting this error "TypeError: Cannot read properties of undefined (reading 'map')"
    I have used below code in constructor and its working fine....
    constructor() {
    super();
    console.log("This is constructor")
    this.state = {
    articles: [],
    loading: false
    }
    }

    • @abhishekbiranje4533
      @abhishekbiranje4533 2 роки тому +1

      update your code instead using this.setState({articles:parsedData.articles}) you can use this.setState(this.articles=parsedData.articles) and also cannot remove the articles array that you already initialize in the first place.

    • @anishgoyal4424
      @anishgoyal4424 2 роки тому +1

      @@abhishekbiranje4533 Hey dude this is not working , it shows a "," missing error

    • @abhishekbiranje4533
      @abhishekbiranje4533 2 роки тому +1

      ​@@anishgoyal4424 sorry my mistake use = in setState(this.articles = parsedData.articles),this will work

    • @anishgoyal4424
      @anishgoyal4424 2 роки тому

      @@abhishekbiranje4533 thanks

    • @rahulmaurya2558
      @rahulmaurya2558 2 роки тому

      @@abhishekbiranje4533 you are telling use = in setState but where ? i got confused

  • @thecodingdice3107
    @thecodingdice3107 2 роки тому +2

    I have an error when mapping parseData this is how i resolved the error
    this.state.article?.map((element) => console.log(element))
    we have to write an extra question mark in state.article🧐🧐

    • @santy-vlogs
      @santy-vlogs Рік тому

      This solved my error of reading map, thanks and it was helpful

    • @mohitagrawal7925
      @mohitagrawal7925 9 місяців тому

      @@santy-vlogs bro i solve the error but its not fetching the headings its just blank space below heading "Headlins"...what should i do

  • @brijeshtelecombusiness
    @brijeshtelecombusiness 3 роки тому +1

    Sir Multi Recharge Software development ke baare me bhi kuchh bataye

  • @ashishrao4273
    @ashishrao4273 4 місяці тому

    Constructor
    Render
    Component did mount
    That’s the reason it’s not displaying in browser and if you map in component did mount and you can see the output.

  • @sachinverma3925
    @sachinverma3925 3 роки тому

    full majaaa aaa rha Harry bhai❤❤❤❤❤✌✌

  • @narasimha6470
    @narasimha6470 Рік тому +1

    Incase If your articles is fetching and showing in console but not rendering in page, use this.state.articles in map function

    • @sheikhmuzamil7218
      @sheikhmuzamil7218 Рік тому

      facing same issue.. can you tell breifly

    • @narasimha6470
      @narasimha6470 Рік тому +1

      @@sheikhmuzamil7218
      async componentDidMount(){
      const res = await fetch(url);
      const data = await res.json();
      //Here I used this.setstate we must use this.articles.setstate//
      this.articles.setState({ articles: data.articles
      });
      }

    • @sehajdeepsingh7427
      @sehajdeepsingh7427 Рік тому

      @@narasimha6470 The browser is saying that this.articles.setState is not a function

    • @narasimha6470
      @narasimha6470 Рік тому

      @@sehajdeepsingh7427 may be spelling Mistake of setState

    • @sehajdeepsingh7427
      @sehajdeepsingh7427 Рік тому

      @@narasimha6470 is this correct written in error code? this.articles.setState is not a function

  • @kumawatnaresh3451
    @kumawatnaresh3451 3 роки тому

    Componentdidmount hi naam rakhan hai ya kuch or sir iss function ka 4:17

  • @babunapati8630
    @babunapati8630 2 роки тому +1

    while using fetch api ive been detected with this error messgae on console page " Uncaught (in promise) SyntaxError: Unexpected token '

  • @dakshkumar3690
    @dakshkumar3690 3 роки тому

    you are a legend bro your explanation is awsome you are my inspiration

  • @anujpalkic
    @anujpalkic Рік тому +1

    data are not coming in card which we used to populate the news items please help me

  • @allaeibgaming2164
    @allaeibgaming2164 3 роки тому +1

    Please continue your machine learning course

  • @aymandin4912
    @aymandin4912 3 роки тому

    My future job is depending on you harry bhai... Thanks a lot!

    • @FarhanAhmad-ll5fn
      @FarhanAhmad-ll5fn 3 роки тому

      fetch is not working please help me

    • @sujitcodes
      @sujitcodes 2 роки тому

      @@FarhanAhmad-ll5fn same problem, not able to update the articles data using useState()

  • @sumittanwar8389
    @sumittanwar8389 2 роки тому +3

    Why I am getting uncaught TypeError : " Cannot read properties of undefined (reading 'map') "
    In News.js
    Nothing is showing on page.
    Please help me.
    If anyone of you getting the same error 😔😔

    • @rahulprajapati8052
      @rahulprajapati8052 2 роки тому +1

      you must be used parsedData instead of parsedData.articles . Hope this might help
      this.setState({
      articles: parsedData.articles,
      loading: false,
      });

    • @sumittanwar8389
      @sumittanwar8389 2 роки тому +1

      @@rahulprajapati8052 thanks bro 😊

    • @Stocklance
      @Stocklance 2 роки тому +1

      @@rahulprajapati8052 Bhai mera abhi bhi nhi aa rha same error hai... Please Help

    • @safanvhora4970
      @safanvhora4970 Рік тому

      I have an error when mapping parseData this is how i resolved the error
      this.state.article?.map((element) => console.log(element))
      we have to write an extra question mark in state.article

    • @computermaster3786
      @computermaster3786 Рік тому

      @@safanvhora4970 yr es say json ka data render nahi hota card may what is the problem I am stuck from previous one week

  • @rajatchaurasia3578
    @rajatchaurasia3578 3 роки тому +1

    Fully Sunday gride 🔥🔥🔥

  • @AnuragKumar-zx7ew
    @AnuragKumar-zx7ew Рік тому

    Friends, if your data is not fetched using API , then you can change your default browser from Chrome to Microsoft edge, this may fetch data, as I was struggling for 3days, and when I change the default browser it suddenly loded all the news

  • @shiveshsantapta1745
    @shiveshsantapta1745 Місяць тому

    componentDidMount me this.setState karne k baad mere console me to error hi nhi aa raha slice wala, fir bhi mere app me news update nahi ho raha API se

  • @anshumankhuntia8683
    @anshumankhuntia8683 2 роки тому +2

    can not read property of undefined (reading 'map') in using fetch Api [react-vdo-27] cant solve....... please help @harrySir

    • @safanvhora4970
      @safanvhora4970 Рік тому

      I have an error when mapping parseData this is how i resolved the error
      this.state.article?.map((element) => console.log(element))
      we have to write an extra question mark in state.article

    • @computermaster3786
      @computermaster3786 Рік тому

      @@safanvhora4970 please reply me bro it solves the map function error but it doesn't rander data in card please help me I am stuck on this error from previous 4 days please help

  • @rittwickbhabak7348
    @rittwickbhabak7348 3 роки тому

    This react js couse is very helpful. Awesome teaching style.

    • @FarhanAhmad-ll5fn
      @FarhanAhmad-ll5fn 3 роки тому

      fetch is not working please help me

    • @rittwickbhabak7348
      @rittwickbhabak7348 3 роки тому +1

      @@FarhanAhmad-ll5fn there may a lot of reasons, it is impossible to track it without seeing the actual code, you may paste the errors here, we can see it.
      One possible reason may by, you are not using localhost:3000, instead you are using 198.162.xx.xx ip address, using ip address will not work, instead open the localhost link,
      other possible reason may be the wrong apikey, or a expired api key.

    • @FarhanAhmad-ll5fn
      @FarhanAhmad-ll5fn 3 роки тому

      can you give me your mail so i send you pictures of output and code

  • @zakirehman4130
    @zakirehman4130 Рік тому

    Mr Harry
    ek masla hai mere kuch news cards pay image abi bhi display nai hooa aur request timed out ka error show kr raha hai console main to wo kesay resolve ho ga?

  • @monoj9
    @monoj9 Рік тому

    Is there a way to filter news without an imageurl. Like to ignore, if the article doesnt have an image url. And show only does having a image url. Please help.

  • @samuelfrank1369
    @samuelfrank1369 3 місяці тому +2

    Thanks a lot #HarryBhai

  • @rahulvishwakarma9640
    @rahulvishwakarma9640 Рік тому +1

    Fetched data webpage per show nhi ho rha hai plus undefined map wali error bhi aa rhe hai pls iska solution bata sakta hai koi and pls koi iska updated code send kr sakte jo work kr rhe hai i'm facing this error from last two days and cannot able to solve the error

    • @archit9305
      @archit9305 Рік тому

      Check typos "articles"

    • @afshanoor7657
      @afshanoor7657 Рік тому +1

      first check if its an array or not, error will go
      {this.state.articles?.map((element) => {
      return


      })}

    • @sehajdeepsingh7427
      @sehajdeepsingh7427 Рік тому +1

      @@afshanoor7657 thankyou !!

  • @santy-vlogs
    @santy-vlogs Рік тому +1

    whoever getting error like this "TypeError: Cannot read properties of undefined (reading 'map')" please try this solution , change fetch(url) to
    fetch(url).then((res) => res.json())
    .then((json) => {
    this.setState({
    articles: json.articles,
    loading: false
    });
    });
    it should work

    • @AnuragKumar-zx7ew
      @AnuragKumar-zx7ew Рік тому

      bro can you please send your code , as I am struggling from 3 days, but till now I am getting same error

    • @bansitapatra9765
      @bansitapatra9765 Рік тому

      thank you

  • @piyushbora4763
    @piyushbora4763 2 роки тому +1

    Hello Harry Bhai!
    Why didn't all the articles get displayed in this page only?

  • @mountain_and_me
    @mountain_and_me Рік тому +1

    Error : When i click on next button it show me blank page error ( Cannot read properties of undefined(reading 'map')....... Help please 🙏

    • @ManjotSingh-sf5qn
      @ManjotSingh-sf5qn Рік тому +1

      Hey I'm facing the same problem did you found the solution yet?

  • @SlickStatus
    @SlickStatus 2 роки тому

    Bahot Sahi 💥

  • @ASShaikh-x5r
    @ASShaikh-x5r 5 місяців тому

    Maza aa gya bhaai....

  • @dipusah9795
    @dipusah9795 3 роки тому

    koi dikkat wali bat nahi hai harry vai

  • @pratikkadale_171
    @pratikkadale_171 Рік тому +1

    harry bhai koi effective way nahi hai kya API se data fetch karne ke liye?
    ....becauce everytime we click next ...it again request the api........jisse apne request waste ho rahe hai...... there should be a way jisse app ek sath hi sab page load kar lo ..then after usse page mai seprate kar lo........

  • @AbhinavSingh-uw6hh
    @AbhinavSingh-uw6hh Рік тому +1

    I have a doubt? Why we are changing articles in componentDidMount() and not in constructor() ?

    • @rupalsaxena9837
      @rupalsaxena9837 Рік тому +1

      Hey could you help me why fetch is not working?

    • @AbhinavSingh-uw6hh
      @AbhinavSingh-uw6hh Рік тому

      @@rupalsaxena9837 yeah sure. send me the code

    • @rupalsaxena9837
      @rupalsaxena9837 Рік тому

      @@AbhinavSingh-uw6hh import react, { Component } from "react";
      import NewsSite from "./NewsSite";
      export default class News extends Component {
      constructor() {
      super();
      this.state = { articles: [], loading: false };
      }
      async componentDidMount() {
      let url =
      "newsapi.org/v2/top-headlines?country=in&apiKey=7c7a544807b344a8be4cf266f97ca5ca";
      let data = await fetch(url);
      let parsedata = await data.json();
      console.log(parsedata);
      this.setState({ articles: parsedata.articles });
      }
      render() {
      return (

      NewsMonekey


      {this.articles.map((element) => {
      console.log(element.description);
      return (



      );
      })}



      );
      }
      }

  • @rishibethi2722
    @rishibethi2722 11 місяців тому

    What to do if the image is not NULL and its "404 Image Not Found" , what if case should i write to tackle it.....ANY IDEAS ARE ACCEPTED.

  • @softboxmelody
    @softboxmelody 2 роки тому

    Herry sir ... I am watching this tutorial after 5 months of uploading and I am facing a problem . I am following each and every steps and On console I am getting message ( TypeError: Cannot read properties of undefined (reading 'map')) at video time 7:26 and I am Unable to practice any further please sir reply

    • @vedangkavathiya8652
      @vedangkavathiya8652 2 роки тому +1

      Same problem. Problem solve hui?

    • @aayushsharma9386
      @aayushsharma9386 2 роки тому +2

      @@vedangkavathiya8652 let parsedData = await data.json();
      Make this change in ComponentdidMount function.
      It should work.

    • @fahadraza7152
      @fahadraza7152 2 роки тому

      @@aayushsharma9386 yes it works

    • @suryasmitaswain5343
      @suryasmitaswain5343 2 роки тому

      @@aayushsharma9386 still not working

  • @deepgojariya4272
    @deepgojariya4272 2 роки тому +1

    Harry bhai mere console mai articles data aa raha hai but webpage par nahi dikh raha. I also updated it using setState

    • @programminginhand4453
      @programminginhand4453 2 роки тому

      am facing same issue

    • @kapilgera8239
      @kapilgera8239 2 роки тому

      facing the same issue let me know if you got it fixed

    • @ibrahimafzan5408
      @ibrahimafzan5408 2 роки тому

      Change this.State to this.state "s" should be in lower case

    • @safanvhora4970
      @safanvhora4970 Рік тому

      @@ibrahimafzan5408 not working bro

    • @safanvhora4970
      @safanvhora4970 Рік тому

      i spelled the article spelling wrong i corrected it and it worked

  • @rhs1078
    @rhs1078 4 місяці тому

    Amazing work #harryBhai

  • @anujpalkic
    @anujpalkic Рік тому +1

    data are not coming in card which we used to populate the news items please help me
    data are not coming in card which we used to populate the news items please help me
    data show in console but not show in cart

  • @gopal12455
    @gopal12455 2 роки тому +1

    this tutorial is usefull

  • @aishwarpathak509
    @aishwarpathak509 Рік тому

    i'm getting ERROR in [eslint]
    src\components\News.js
    Line 71:3: Parsing error: Unexpected token (71:3)
    webpack compiled with 2 errors and 1 warning
    please help me rectify it

  • @harshsingh7713
    @harshsingh7713 3 роки тому +1

    Bhaiya mera JEE Ka paper khtm hogya h Mai coding sikhna chahta hu pr mujhe kuch pta nhi h kha se Start kru please give me suggestions 🙏

  • @Gaurav_Nahata
    @Gaurav_Nahata 3 роки тому +1

    brother you are doing a gr8 work . can u please teach me how to create an array in java

    • @supratim08
      @supratim08 3 роки тому +1

      int [] arr={1,2,3,4,5}
      another way is by mentioning the size-->
      int [] arr= new int[4];
      arr[0]=1;
      arr[1]=2;
      ..
      and do check the java playlist for detail.

    • @ShubhamVerma-hw4uj
      @ShubhamVerma-hw4uj 3 роки тому

      bhai java ka poora course bna rkha h bhai ne

    • @Gaurav_Nahata
      @Gaurav_Nahata 3 роки тому

      @@supratim08 tnx

  • @somethingdifferent3774
    @somethingdifferent3774 Рік тому

    Yess mza aaya ❤❤

  • @ammaransari2418
    @ammaransari2418 2 роки тому +2

    Facing this issue - Please Help
    ncaught TypeError: Cannot read properties of undefined (reading 'map')

    • @jokercreations2142
      @jokercreations2142 2 роки тому +1

      Same bro.
      Muje bhi uahi arror aa rahi he..

    • @suhasskamath3275
      @suhasskamath3275 2 роки тому +1

      check if the array exists or not

    • @siddharthjain4592
      @siddharthjain4592 2 роки тому +4

      use this line in news.js
      " {this.state.articles && this.state.articles.map((element) => { "

    • @toobakhalid7193
      @toobakhalid7193 2 роки тому

      @@siddharthjain4592 it help in resolving map error but it still shows GET "url" 426 error

    • @K_B_ChanderveerSinghChauhan
      @K_B_ChanderveerSinghChauhan 2 роки тому

      facing the same error pls tell if anyone has solved it

  • @elhaambasheerch7058
    @elhaambasheerch7058 Рік тому

    Harry Bhai, Your courses are great and certainly the best on YT.
    I would love to see a svelte course from you.

  • @adityanawale2634
    @adityanawale2634 2 роки тому +1

    Is there any alternative of apis that can be used for deployment part

  • @abhisekchowdhury8584
    @abhisekchowdhury8584 3 роки тому +1

    Harri please show some examples --- how to use POST parameters with json body in Fetch APIs ?

  • @pradeepkumar7612
    @pradeepkumar7612 3 роки тому

    sir mere visual studeo ke c/c++ ka intellsense kam nahi kar raha hai aur bulb bhi nahi dikh raha hai sir please bataye

  • @itsmee8303
    @itsmee8303 2 роки тому +2

    News.js:98 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'map')
    I am getting this error. How to resolve it ?

    • @aayushsharma9386
      @aayushsharma9386 2 роки тому +1

      let parsedData = await data.json();
      Make this change in ComponentdidMount function.
      It should work.

    • @arhabumer
      @arhabumer 2 роки тому

      @@aayushsharma9386 is sy bhi nhi chal rha kia karo batao ap??

    • @aayushsharma9386
      @aayushsharma9386 2 роки тому

      @@arhabumer are you still getting same error ?
      Try using a try catch block here

    • @arhabumer
      @arhabumer 2 роки тому

      @@aayushsharma9386 thank you so much for your help but I have shifted to functional

    • @safanvhora4970
      @safanvhora4970 Рік тому

      I have an error when mapping parseData this is how i resolved the error
      this.state.article?.map((element) => console.log(element))
      we have to write an extra question mark in state.article

  • @kunalsingh-fc5pf
    @kunalsingh-fc5pf 2 роки тому +1

    hello while fetching data i am getting parsed data in log but it is not populating the news

  • @allaeibgaming2164
    @allaeibgaming2164 3 роки тому +1

    Please make course on machine learning

  • @psychoticgamer6853
    @psychoticgamer6853 3 роки тому +1

    Make a tutorial on how to integrate react with django

  • @lavanyashivu6125
    @lavanyashivu6125 3 роки тому +1

    Pls do make Redux series also 🙏

  • @udaythapar4237
    @udaythapar4237 3 роки тому +1

    Unhandled Rejection (TypeError): Cannot read properties of undefined (reading 'map')

    • @suber-iq9187
      @suber-iq9187 3 роки тому

      yes me

    • @safanvhora4970
      @safanvhora4970 Рік тому

      I have an error when mapping parseData this is how i resolved the error
      this.state.article?.map((element) => console.log(element))
      we have to write an extra question mark in state.article

  • @randomlyxz
    @randomlyxz 3 роки тому

    pls harry bhai help me
    I have installed vs code but it is showing fully blank screen
    i have tried with this tips given in vscode as well in youtube of diable gpu
    pls help me harry bhaiya
    I have windows 10 and i5 4th gen laptop

  • @mughalyt2304
    @mughalyt2304 3 роки тому

    Sir jo react ka course hai aap ka 1.5hour k vedio hai
    Wo or yhe react course same hain ya yhe different hai

  • @princejain2851
    @princejain2851 3 роки тому

    bhai angular pr bhi ek full tutorial bhi bnao.usme kaafi problem aati h

  • @lavanyashivu6125
    @lavanyashivu6125 3 роки тому

    Awesome series

  • @anuragrawat2553
    @anuragrawat2553 Рік тому

    Can someone help me?
    the fetch data is not showing on the browser instead showing the old sample json

  • @aryan7069_
    @aryan7069_ 3 роки тому

    logic ne harry bhai ka dimaag lelia

  • @hamzanaseer1529
    @hamzanaseer1529 3 роки тому

    kia koi bata sakta hai meri app mobile py run q ni hori ???? it runs fine on my laptop pr jab mobile py chalata hun to api data fetch ni krta

  • @rajbannasa7662
    @rajbannasa7662 3 роки тому

    Thank you so much sir ❤️

  • @prajwalwandhare6247
    @prajwalwandhare6247 Рік тому

    I have a doubt, if componentDidMount() works after render() then why we are making API call there? Why we are not fetching data before rendering?

    • @rahulvishwakarma9640
      @rahulvishwakarma9640 Рік тому

      Bhai tumhara code work kr rha hai is video ka

    • @jdgamesandtechnology
      @jdgamesandtechnology Рік тому

      I think we are not fetching data before rendering because if we fetch data before rendering, it would affect the loading time of website and it will put stress on our servers. I hope this answer could be helpful for you.

  • @darkjoker7256
    @darkjoker7256 3 роки тому +1

    TypeError: Cannot read properties of undefined (reading 'map') I m getting this error can anyone help me to resolve it

    • @anantdhiman4189
      @anantdhiman4189 3 роки тому +1

      please replace fetch function with this
      fetch(url).then((res) => res.json())
      .then((json) => {
      this.setState({
      articles: json.articles,
      loading: false
      });
      })
      i was getting same error, but above code works for

    • @shivangm24
      @shivangm24 3 роки тому

      @@anantdhiman4189 I am still facing error can you please help?

    • @anantdhiman4189
      @anantdhiman4189 3 роки тому

      @@shivangm24 please paste your code here, i'll check it and make sure your API key does not exhaust daily limit

    • @FarhanAhmad-ll5fn
      @FarhanAhmad-ll5fn 3 роки тому

      @@anantdhiman4189 bro not working can you help me please reply

  • @factor5902
    @factor5902 3 роки тому +2

    Consistency × 100😌

  • @fahadjawad5235
    @fahadjawad5235 2 роки тому

    Harry bhai componentDidMount error dy raha hai missing semicolon ka
    any suggession?

  • @ysftechnical7552
    @ysftechnical7552 3 роки тому

    Guys Use This...In news image style...for symmetric structure...
    style={{ width: "286px", height: "161px", objectFit:"cover"}}

  • @getknowledgebite3413
    @getknowledgebite3413 3 роки тому +1

    DidMount ko thoro explain bhi kar dete kya hua iss code m sbb upper se gya sir

  • @nextleveltech267
    @nextleveltech267 Рік тому

    Thank you ❤️

  • @lavanyashivu6125
    @lavanyashivu6125 3 роки тому

    Hi pls do make Angular series with crud operations and jwt authentication and pls build a complete MEAN and MERN app