Use React to Scroll to Specific Section on Your Website

preview_player
Показать описание
In this video, I show you how to use react to scroll to specific sections of your website. When you build a website with a single page, a user can navigate to specific section using clicks. We use the full power of JavaScript in this tutorial.

----------
Link to Github repository

----------

----------

----------

______

----------
Chapters
00:00 Introduction
01:12 Setup vscode
01:30 Create navigation menu
04:21 Create sections
06:00 Adding Scroll effects
10:18 Implement back to top button
19:04 Wrap up

#reactjs #scroll #node #javascript #DOM
Рекомендации по теме
Комментарии
Автор

I never had a need for useRef's before this video. Now I see how useful they are when scrolling to a section. Great video Abu! :)

craigjohnson
Автор

dude your videos are really have made REACT easy for me to master

isaacotim
Автор

its a great a easy to follow tutorial, but you did not remove the event in the useEffect. you should remove that event so when the component is closed that event is also closed. Thank you for such a good lecture :)

aaaliiiu
Автор

Thank you so much Abu for explaining this, this will help me to apply in my portfolio website.

avcodeversee
Автор

Thank you for the step by step explanation

Joel-nzgd
Автор

Thanks man
you explained it so easily

faugofficial
Автор

This was a very detailed tutorial with exceptional way of explaining hooks, thank you very much

chiamakaorakwe
Автор

thanks man for such kind of videos, it is really helpful for me...

KishanKumar-czcy
Автор

thank you sir, you're explanation is so clear and i can understand it easily

faainamacaldera
Автор

I need this in my project currently. Will try it tomorrow. Thanks ! Can more react and typescript tutorials plz 😊

user
Автор

Very helpful video Abu! Thank you so much

bedsidetable
Автор

I will implement it now in my project! Thank you, and by the way, you have great teaching skills.

thomasalmeida
Автор

Thanks bro. For these easy and clear explanations

gunnn
Автор

Thanks for this. How is this accomplished when the "sections" are in fat different components, as opposed to simply different divs?

najeesimmons
Автор

Thank you so much! This was really really helpful and very easy to follow.

Najettechou
Автор

very nice! great video, really usefull! thanks from Brasil

eduardoleitzke
Автор

Thank you so much I wasted almost three days on this !

blueb
Автор

thank you! what do you suggest if i want to divide those sections into separate components?

momokee
Автор

thank you for this tutorial, wonderfully explained. But what if each section is a component on its own? For example the Nav is a component, the About section is another component. and all of them gathered in the App.js!
I'm having problems understanding how can I do it when each section is a component on its own, HELP :(.

Rando
Автор

How would I implement this if I have multiple components in my react page? For example, my page has a navbar.js file which is exported to app.js(and this also imports all the sections from other files/components). How could I implement this in that case?

aymanhaque