Learn advanced topics of React for building dynamic user interfaces with reusable components, allowing for efficient updates and rendering.

Zero to Hero in Front-end Development with React

React is one of the front-end frameworks of JavaScript. This module starts with the Context API, refs, error boundaries, portals, and code splitting. Next, we will learn about hooks, Redux and routing, and internationalization. After completing this module, we will be able to use React professionally.

React Deep Dive: Advanced Approaches

**Portals** allow us to render components in DOM nodes that are *outside* of the parent node of the current component hierarchy but still have access to the current component environment. 

A typical example is an overlay rendered in its own `<div>` outside of the actual application.

The portal remains in the context of the component that has created it and therefore has access to all data available to the parent component, such as its props and state.

Let's have a look at how to render an element outside of its component hierarchy.

Context API

Refs

Error Boundaries

Portals

Code Splitting

Typechecking with PropTypes, Flow, and TypeScript

React Hooks – an Introduction

Hooks in Action

The Hooks API

Routing in React

State Management

Internationalization

Appendix

Conclusion

Introduction

What are portals?