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

## What are URL parameters?

Most applications require some usage of parameters in URLs. React Router also supports parameters by using colons ( `:` ), which you might be already familiar with:
```js
<Route path="/users/:userid" component={UserProfile} />
```

We can easily restrict which parameters should be detected and can even provide further customization. For example, React Router allows the limitation of matching of routes by providing an `asc` (ascending) or `desc` (descending) keyword in regular expressions just after the parameter:
```js
<Route path="/products/:order(asc|dec)" />
```

The above `Route` would only match if the URL provided was either `/products/asc` or
`/products/desc`.

If we were to only allow numeric values in the `:userid`, we would define routes such as `/users/:userid(\d*)` or `/users/:userid([0-9]*)` to limit these. 

### Code example
Let's see this in action: 

# What are URL parameters?

Most applications require some usage of parameters in URLs. React Router also supports parameters by using colons ( `:` ), which you might be already familiar with:
```js
<Route path="/users/:userid" component={UserProfile} />
```

We can easily restrict which parameters should be detected and can even provide further customization. For example, React Router allows the limitation of matching of routes by providing an `asc` (ascending) or `desc` (descending) keyword in regular expressions just after the parameter:
```js
<Route path="/products/:order(asc|dec)" />
```

The above `Route` would only match if the URL provided was either `/products/asc` or
`/products/desc`.

If we were to only allow numeric values in the `:userid`, we would define routes such as `/users/:userid(\d*)` or `/users/:userid([0-9]*)` to limit these. 

## Code example
Let's see this in action: 

Learn how to dynamically set values in a page's URL.

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

Parameters in URLs

What are URL parameters?