[Hacktoberfest]: Add content for React - Hooks in React

📝 Issue Description

Add the following content for Hooks in React under REACT

Introduction to Hooks: (What are Hooks, Rules of Hooks)
Basic Hooks: [useState (Managing State), useEffect (Handling Side Effects)]
Additional Hooks: [useContext (Context API for Global State), useRef (Referencing DOM Elements), useReducer (State Logic for Complex State), useMemo (Memoization to Avoid Unnecessary Re-renders), useCallback (Memoizing Functions)
Custom Hooks: (Creating Custom Hooks, When and Why to Use Custom Hooks)

File you will be working on: src\content\docs\react\hooks.mdx

🎯 Expected Outcome

The expected outcome is to add a well-documented and informative section under React that covers the following topics:

Introduction to Hooks: A detailed explanation of what React Hooks are, including the motivation behind their introduction and the rules of hooks (e.g., only calling hooks at the top level and inside functional components).
Basic Hooks: A clear guide to the most fundamental hooks:
- useState: Explanation of how to use the useState hook to manage state in functional components, with examples of how to initialize and update state.
- useEffect: Explanation of how to use the useEffect hook for handling side effects like data fetching or subscriptions, with examples of controlling when effects run and how to clean them up.
Additional Hooks: A deeper dive into other important hooks in React:
- useContext: Guide on how to use the useContext hook for accessing values from the Context API to manage global state.
- useRef: Explanation of the useRef hook for referencing DOM elements and persisting values across renders without triggering re-renders.
- useReducer: A comprehensive guide on using the useReducer hook to manage complex state logic, particularly in large-scale applications.
- useMemo: Explanation of the useMemo hook to memoize expensive calculations and avoid unnecessary re-renders, with practical examples.
- useCallback: Explanation of the useCallback hook to memoize functions and improve performance in React applications, with examples demonstrating the need for memoizing functions.
Custom Hooks: Instructions on how to create custom hooks to extract reusable logic across components, including when and why to use custom hooks, with real-world examples.

The content should be written clearly, with examples where necessary, and provide value for developers who are new to hooks or looking to deepen their understanding of React Hooks. Please don't make use of the AIs.

🔧 Solution Guidance (Optional)

Make use of Astro Star Light Components

📋 Steps to Reproduce

Navigate to src\content\docs\react\hooks.mdx file in the repository.
Add content for each of the 4 sections mentioned above.
Ensure the content is formatted properly using MDX

💡 Additional Context (Optional)

🎃 Hacktoberfest Participation

✔️ This issue is tagged for Hacktoberfest. ✔️ PR should reference this issue and adhere to contribution guidelines.

👥 Contributors

If you are working on this issue, please comment below to let us know. Feel free to ask any questions! Don't forget to go through the Code of Conduct and follow the CONTRIBUTING guidelines.

Thank you for contributing to Hacktoberfest and helping improve this project!

CodeQuestic / OpenPrep