Content improvements in React roadmap (#6720)

src/data/roadmaps/react/content/animation@bRpeoo9zXrnZ2IHSI7JX4.md

@@ -2,7 +2,6 @@
 
 Animation in React can be achieved using various methods, such as CSS transitions, keyframes, or libraries like `react-spring`, `framer-motion`, and `GSAP` (GreenSock Animation Platform). CSS transitions are ideal for simple animations, where you can toggle classes or manipulate inline styles to create smooth transitions. For more complex and interactive animations, libraries like `react-spring` provide a declarative approach, allowing you to create animations by defining spring physics or interpolating values. `framer-motion` offers a rich API to handle complex animations, gestures, and even layout transitions with ease. `GSAP` is another powerful library that excels at creating high-performance animations, offering fine-grained control over every aspect of the animation process. These tools integrate seamlessly with React's component-driven architecture, enabling you to create responsive and dynamic user interfaces.
 
-
 Visit the following resources to learn more:
 
 - [@article@Framer Motion Docs](https://www.framer.com/motion/)

src/data/roadmaps/react/content/component--libraries@thfnymb_UIiKxakKfiua5.md

@@ -1,3 +1,8 @@
 # Component / Libraries
 
 React component libraries are collections of pre-built, reusable components that can be used to speed up the development process. They can be styled using CSS in various ways, including traditional CSS files, CSS modules, and CSS-in-JS solutions like styled-components.
+
+Visit the following resources to learn more:
+
+- [@article@MUI: React Component Library](https://mui.com/)
+- [@article@NextUI.org](https://nextui.org/)

src/data/roadmaps/react/content/jest@opa61u9gYgSpoPtxp58wu.md

@@ -4,5 +4,5 @@ Jest is a delightful JavaScript Testing Framework with a focus on simplicity. It
 
 Visit the following resources to learn more:
 
-- [@article@Jest Website](https://jestjs.io/)
+- [@official@Jest Website](https://jestjs.io/)
 - [@feed@Explore top posts about Jest](https://app.daily.dev/tags/jest?ref=roadmapsh)

src/data/roadmaps/react/content/jotai@yI6XiNW04EL78UL4lkVgd.md

@@ -9,4 +9,3 @@ It scales from a simple useState replacement to an enterprise TypeScript applica
 - [@official@Official Website: Jotai](https://jotai.org/)
 - [@video@Jotai React - Better Global State Management](https://www.youtube.com/watch?v=ZcKzPZN7Ids)
 - [@article@State Management on React - Jotai](https://dev.to/kevin-uehara/state-management-on-react-part-3-jotai-i7f)
-- 

src/data/roadmaps/react/content/radix-ui@XL9XOV2h0BAuA5cFcM5L_.md

@@ -8,4 +8,3 @@ Visit the following resources to learn more:
 - [@official@Official Website](https://www.radix-ui.com/)
 - [@video@Radix UI Course](https://www.youtube.com/playlist?list=PLlNdnoKwDZdwANQoaakE8-kYMyKFOETlo)
 - [@article@What is Radix UI?](https://medium.com/@olivier.trinh/what-is-radix-ui-ff535bbb52d5)
-

src/data/roadmaps/react/content/rendering@0uiGsC5SWavNdlFqizkKe.md

@@ -13,3 +13,5 @@ This process is known as reconciliation, and it is an important aspect of how Re
 
 Visit the following resources to learn more:
 
+- [@official@Rendering - Official Docs](https://legacy.reactjs.org/docs/rendering-elements.html)
+- [@article@Rendering in React - ui.dev](https://ui.dev/why-react-renders)

src/data/roadmaps/react/content/shadcn-ui@njKsYNkwTXPQ1NjlGKXab.md

@@ -1,7 +1,9 @@
 # Shadcn UI
+
 Shadcn is an open-source framework providing pre-built, accessible, and customizable UI components for rapid web application development. It offers a streamlined approach to construct modern user interfaces.
 
 Visit the following resources to learn more:
+
 - [@official@Official Website](https://ui.shadcn.com/)
 - [@official@Documentation](https://ui.shadcn.com/docs)
 - [@video@Shadcn Setup and Tutorial](https://www.youtube.com/watch?v=v0_AT8zaLo8)

src/data/roadmaps/react/content/typescript@ElgRwv5LSVg5FXGx-2K2s.md

@@ -1 +1,11 @@
 # TypeScript
+
+TypeScript is a free and open-source high-level programming language developed by Microsoft that adds static typing with optional type annotations to JavaScript. It is designed for the development of large applications and transpiles to JavaScript. Because TypeScript is a superset of JavaScript, all JavaScript programs are syntactically valid TypeScript, but they can fail to type-check for safety reasons.
+
+TypeScript supports definition files that can contain type information of existing JavaScript libraries, much like C++ header files can describe the structure of existing object files. This enables other programs to use the values defined in the files as if they were statically typed TypeScript entities. There are third-party header files for popular libraries such as jQuery, MongoDB, and D3.js. TypeScript headers for the Node.js library modules are also available, allowing development of Node.js programs within TypeScript.
+
+Visit the following resources to learn more:
+
+- [@official@TypeScript Website](https://typescriptlang.org/)
+- [@official@TypeScript Docs](https://typescriptlang.org/docs)
+- [@video@Learn Typescript Basics in 12 Minutes](https://www.youtube.com/watch?v=ahCwqrYpIuM&pp=ygULdHlwZXNjcnJpcHQ%3D)

src/data/roadmaps/react/content/usememo@w3bNp7OkehI1gjx8NzlC8.md

@@ -1,6 +1,6 @@
 # useMemo
 
-useMemo is a React hook that memorizes the result of a function. It is used to optimize performance by caching the result of a function and returning the cached result when the inputs to the function have not changed.
+`useMemo` is a React hook that memorizes the result of a function. It is used to optimize performance by caching the result of a function and returning the cached result when the inputs to the function have not changed.
 
 Learn more from the following resources:
 

src/data/roadmaps/react/content/usereducer@v48Mv0wQqjXbvy8x6gDjQ.md

@@ -1,6 +1,6 @@
 # useReducer
 
-useReducer: An alternative to useState. Accepts a reducer of type (state, action) => newState, and returns the current state paired with a dispatch method. (If you’re familiar with Redux, you already know how this works.)
+`useReducer`: An alternative to useState. Accepts a reducer of type (state, action) => newState, and returns the current state paired with a dispatch method. (If you’re familiar with Redux, you already know how this works.)
 
 Learn more from the following resources:
 

src/data/roadmaps/react/content/useref@t_laNdMmdLApYszqXRdWg.md

@@ -1,8 +1,9 @@
 # useRef
 
-useRef is a React hook that provides a way to create a mutable reference that persists across component re-renders. It stores a value that doesn't cause re-renders when it changes.
+`useRef` is a React hook that provides a way to create a mutable reference that persists across component re-renders. It stores a value that doesn't cause re-renders when it changes.
 
 Visit the following resources to learn more:
+
 - [@official@useRef](https://react.dev/reference/react/useRef)
 - [@article@W3Schools](https://www.w3schools.com/react/react_useref.asp)
 - [@video@WebDevSimplified](https://www.youtube.com/watch?v=t2ypzz6gJm0)

src/data/roadmaps/react/content/zod@K3RZ8ESxWCpLKHePF87Hy.md

@@ -2,7 +2,7 @@
 
 Zod is a TypeScript-first schema declaration and validation library. I'm using the term "schema" to broadly refer to any data type, from a simple string to a complex nested object.
 
-Zod is designed to be as developer-friendly as possible. The goal is to eliminate duplicative type declarations. With Zod, you declare a validator once and Zod will automatically infer the static TypeScript type. It's easy to compose simpler types into complex data structures.
+Zod is designed to be as developer-friendly as possible. The goal is to eliminate duplicate type declarations. With Zod, you declare a validator once and Zod will automatically infer the static TypeScript type. It's easy to compose simpler types into complex data structures.
 
 Visit the following resources to learn more: