Refactoring News component to use the same function | Complete React Course in Hindi #33

React class-based components: In this react course, we will see how to learn react using projects.
This is going to be a project-based course full of real-world react projects.

Best Hindi Videos For Learning Programming:

►C Language Complete Course In Hindi -

►JavaScript Complete Course In Hindi -

►Django Complete Course In Hindi -

Follow Me On Social Media
Comment "#HarryBhai" if you read this 😉😉

[CodeWithHarry]

If you are on Instagram, you can follow me there for more updates on courses & other stuff: Instagram.com/codewithharry

[axnplayz]

There is one problem in Harry's code and that is in "UpdateNews function". When the user clicks in next btn then the same page which is page=1 is repeating again. When i click on next then i am getting the same news as it was in page=1 and after 2 pages the news are different. u can check it on 7:30

[bhaveshjhawar]

For any new learner facing problem with the refactored code i.e(next button is showing the next page after second click)
Simply do this --->

handlePrevClick=async()=>
{
await
this.updateNews()
}

handleNextClick= async()=>
{
await
this.updateNews()

}

[tapassamanta]

Getting the hearts from him made this react course more attractive

[priyampatel]

Harry Bhai! I dont know if i am too late to tell you this...I am currently learning Java Language from your tutorials, and to be honest :) I am literally so thankful to you for making such amazing tutorials, it is very helpful and easy to learn :)

[CodeWith-Peer]

For search functionality:
Add in Navbar component,
1. constructor(props) {
super(props);
this.state = {
searchInput: ''
};
}

handleInputChange = (e) => {
this.setState({ searchInput: e.target.value });
};

handleSubmit = (e) => {
e.preventDefault();

};
2. <form className="d-none d-lg-flex" onSubmit={this.handleSubmit}>
<input
className="form-control me-2"
type="search"
placeholder="Search"
aria-label="Search"


/>

Add in App.js
1. constructor() {
super();
this.state = {
searchQuery: ''
};
}

handleSearch = (query) => {
this.setState({ searchQuery: query });
};
2. <Navbar onSearch={this.handleSearch} />

Add in News.js,
async componentDidUpdate(prevProps) {
if (prevProps.searchQuery !== this.props.searchQuery) {
await this.updateNews();
}
}

*Don't forget to add q param in your API

[shivangkhandelwal]

Yaar Harry Bhai m ye series abhi dekh to nhi rha but manna padega aapki dedication ko...is frequency se videos aate hue mene pehle kbhi nhi dekha ! HATS OFF 🙇‍♂️

[keshavsharma]

Nothing left to say about u.. literally 12 videos in 24 hrs❤️ u r the savior

[itsmytechnology]

This React Course is Very Very Helpful 🔥

[navpan]

Hats off to this guy, this much hardwork for us for free ❤️❤️❤️❤️

[starkendeavours]

I'll catch up with this React Course soon, I'm learning CSS and Javascript from your channel Harry Sir ♥

[suparnatripathi]

In this video there is a bug in componentDidMount method Next button is not working we are getting undefined in page variable

[mohituniyal]

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.

[unfilteredshivam]

Learning programing and Coding is Directly Proportional to Harry🔥

[sahilhans]

Kitne baar bhi thanks bolun Bhai kam h aapke liye, fir bhi bhai thankyou so much ❤️

[gnial]

mazaa aa gaya dear harry ... even in 2024 ... happy new year and God bles you!

[prasantkumarray]

Harry bhai is the best youtuber for young ones

[Karthik-kt]

Really Reallyy Appreciate your efforts bhaiya🙏🙏🙏🙇‍♂️🙇‍♂️🙇‍♂️ You are a savior Thank you for working so hard to make all these easily understandable tutorials!! We really cant thank u enough Harry Bhai🙇‍♂️♥ I will surely support u once i start earning cause most knowledge i got from you only...Aap sikhate ho toh mushkil se mushkil dikhne wali cheez samaj aane lagti hai...thanku very much...Really underrated Teacher in the whole world🙏🙏🙏💯

[CodeWhy]

You are the best one my favourite youtuber....☺️☺️☺️☺️

[muhammadaarizimam]

harry bhai, aap ui mast design krte ho or code me to aap professional the hi. Hats off🔥🔥🔥