https://github.com/ger86/react-portals-window
In this project I want to show you how we could use the API Portals of React to handle the state of a popup window opended from a component.
https://github.com/ger86/react-portals-window
react react-portal react-portals reactjs reactjs-popup
Last synced: 3 months ago
JSON representation
In this project I want to show you how we could use the API Portals of React to handle the state of a popup window opended from a component.
- Host: GitHub
- URL: https://github.com/ger86/react-portals-window
- Owner: ger86
- License: gpl-3.0
- Created: 2020-08-02T08:59:40.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2023-01-05T23:06:44.000Z (over 2 years ago)
- Last Synced: 2025-01-20T04:07:40.374Z (3 months ago)
- Topics: react, react-portal, react-portals, reactjs, reactjs-popup
- Language: JavaScript
- Homepage:
- Size: 3.93 MB
- Stars: 2
- Watchers: 2
- Forks: 2
- Open Issues: 20
-
Metadata Files:
- Readme: README.md
- License: License.md
Awesome Lists containing this project
README
# ⛩ React Portal: Windows
## Description
In this project I want to show you how we could use the **API Portals** of React to handle the state of a popup window opended from a component.
**React Portals** provide a first-class way to render children into a DOM node that exists outside the DOM hierarchy of the parent component.
As the documentations states, React Portals could be useful when a parent component has an overflow: hidden or z-index style, but you need the child to visually “break out” of its container. For example, dialogs, hovercards, and tooltips.
## You will learn
How to create a popup window with React Portals that shares the state with the parent component.
## Run the project
Use `yarn start` to run the app in the development mode and open http://localhost:3000 to view it in the browser.
## To read more
- [React Portals documentation](https://reactjs.org/docs/portals.html)
- [React Portals. Una introducción](https://medium.com/@ger86/react-portals-una-introduccion-29c296324334)