Update links to new react documentation (#4134)

* update react error boundary link

* update links to JSX

* actualize Component Life Cycle overview and links

* update links to event handling in react

* actualize HOC overview

src/data/roadmaps/react/content/102-components/102-jsx.md

@@ -4,7 +4,7 @@ JSX stands for JavaScript XML. It allows writing HTML in JavaScript and converts
 
 Visit the following resources to learn more:
 
-- [Introduction to JSX](https://reactjs.org/docs/introducing-jsx.html)
 - [Writing markup with JSX](https://react.dev/learn/writing-markup-with-jsx)
+- [JavaScript in JSX with Curly Braces](https://react.dev/learn/javascript-in-jsx-with-curly-braces)
 - [JSX in React – Explained with Examples](https://www.freecodecamp.org/news/jsx-in-react-introduction/)
 - [JSX in React on w3school](https://www.w3schools.com/react/react_jsx.asp)

src/data/roadmaps/react/content/103-rendering/100-component-life-cycle.md

@@ -1,8 +1,10 @@
 # Component Life Cycle
 
-Each component has several “lifecycle methods” that you can override to run code at particular times in the process. You can use this [lifecycle diagram](https://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/) as a cheat sheet. In the list below, commonly used lifecycle methods are marked as bold. The rest of them exist for relatively rare use cases.
+React components have a lifecycle consisting of three phases: Mounting, Updating, and Unmounting along with several “lifecycle methods” that you can override to run code at particular times in the process. You can use this [lifecycle diagram](https://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/) as a cheat sheet.
+
+It is not recommended to use lifecycle methods manually. Instead, use the useEffect hook with functional components.
 
 Visit the following resources to learn more:
 
-- [The Component Lifecycle](https://reactjs.org/docs/react-component.html#the-component-lifecycle)
+- [Class Component](https://react.dev/reference/react/Component)
 - [Lifecycle of Reactive Effects](https://react.dev/learn/lifecycle-of-reactive-effects)

src/data/roadmaps/react/content/103-rendering/104-events.md

@@ -7,7 +7,7 @@ Handling events with React elements is very similar to handling events on DOM el
 
 Visit the following resources to learn more:
 
-- [Handling Events in React](https://reactjs.org/docs/handling-events.html)
-- [Synthetic Events in React](https://reactjs.org/docs/events.html)
+- [Responding to Events](https://react.dev/learn/responding-to-events)
+- [React Event Object (Synthetic Event)](https://react.dev/reference/react-dom/components/common#react-event-object)
 - [Responding to Events](https://react.dev/learn/responding-to-events)
 - [React Event Handler](https://www.robinwieruch.de/react-event-handler/)

src/data/roadmaps/react/content/103-rendering/105-high-order-components.md

@@ -4,6 +4,8 @@ A higher-order component (HOC) is an advanced technique in React for reusing com
 
 Concretely, a higher-order component is a function that takes a component and returns a new component.
 
+Higher-order components are not commonly used in modern React code. In order to reuse logic, React hooks are mainly used now.
+
 Visit the following resources to learn more:
 
 - [High-Order Components](https://reactjs.org/docs/higher-order-components.html)

src/data/roadmaps/react/content/114-error-boundaries.md

@@ -6,4 +6,4 @@ Error boundaries are React components that catch JavaScript errors anywhere in t
 
 Visit the following resources to learn more:
 
-- [Error Boundaries in React](https://reactjs.org/docs/error-boundaries.html)
+- [Error Boundaries in React](https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary)