Everything about React Portals in 10 minutes

Рет қаралды 11,733

2 жыл бұрын

In this video you will learn how to use React Portals to create amazing modals in your React App. You will also learn the advantages of React Portals and when and why to use them. You will also learn topics like event delegation and event bubbling.
📚 Materials/References:
- VS Code Extensions: • 5 Must Have Visual Stu...
- Create react app: reactjs.org/docs/create-a-new...
- React Portals Docs: reactjs.org/docs/portals.html
- GitHub Code for the project: github.com/FullstackSimplifie...
🧠 Concepts Covered:
- React Portals
- Event Delegation
- Event Bubbling
- Creating Modal with Portals
🌎 Find Me Here:
My Website: prasoon.me
LinkedIn: / prosoon-goswami
Twitter: / prasoongoswami4
GitHub: github.com/FullstackSimplified
Instagram: / prasoon_goswami

Пікірлер: 33

@gritsienkooleg3447 Жыл бұрын

Thank you, Bro! Very helpfull!

@kritigoswami7382 2 жыл бұрын

Good work again. Keep posting 🙂

@FullstackSimplified 2 жыл бұрын

Thank you

@Amvflix7 Жыл бұрын

Very well explained

@oncoding4520 Жыл бұрын

I had to come out here from a well known udemy course.... your explanations was amazing

@FullstackSimplified Жыл бұрын

Glad it helped. Thanks for watching

@user-kp1zd7on1d 9 ай бұрын

same here

@rahulkrishna164 2 жыл бұрын

Learnt new thing today.

@FullstackSimplified 2 жыл бұрын

Thanks alot. Hope it helped you get the topic.

@akashbose3682 2 жыл бұрын

Well explained 👍

@FullstackSimplified 2 жыл бұрын

Thanks alot

@ashishkumarsingh9857 2 жыл бұрын

Keep posting informative video.

@FullstackSimplified 2 жыл бұрын

Thanks alot

@thecareercoach231 2 жыл бұрын

Thankyou for sharing your knowledge🤝

@FullstackSimplified 2 жыл бұрын

You're welcome

@tanupriya9849 2 жыл бұрын

Great explanation🤗🤗

@FullstackSimplified 2 жыл бұрын

Thanks alot

@ramesh90010 2 жыл бұрын

Good content. Keep up🙂

@FullstackSimplified 2 жыл бұрын

Thanks for the feedback

@habibulislam3386 7 ай бұрын

great explaination..

@FullstackSimplified 6 ай бұрын

Thanks for watching. Glad this helped

@KAMIL-jc8nn Жыл бұрын

Great tutorial

@FullstackSimplified Жыл бұрын

Thank you! Cheers!

@azaamabubacker Жыл бұрын

Well explained

@FullstackSimplified Жыл бұрын

Glad it helped. Thanks for watching

@avertry9529 Жыл бұрын

I noticed you had modal : 100% can you not use vh vw? I've used modals in react without portal.

@FullstackSimplified Жыл бұрын

Absolutely you can use modal without portal. But at times you have situations where you don’t want to render a modal deep inside a nested dom but also want to keep the parent child relationship intact. In these cases portal seems to be much handy. More over you always want your modal to be above all the contents. Using css will just make it visible at the top but eventually your modal will be nested deep inside decreasing the accessibility of your website.

@Pareshbpatel 11 ай бұрын

React Portals, beautifully explained. Thanks. {2023-07-24}

@FullstackSimplified 11 ай бұрын

Glad this helped

@_its-vikash Жыл бұрын

position : fixed

@FullstackSimplified Жыл бұрын

Position fixed would add the modal to the under the same patent which we do not want portal doesn't only gives us styling options but also provides us the way to render elements out side the nested dom tree.