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

[rakshixh]

📝 Issue Description

Add the following content for Components in React under REACT

1. What are Components?
2. Functional Components vs. Class Components
3. Creating a Component
4. Component Props
5. Component Composition (Nesting Components)
6. Default Props and Prop Types (Type Checking in React)

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

🎯 Expected Outcome

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

• What are Components?: A clear explanation of what components are in React, their role in UI building, and how they are the building blocks of a React application.
• Functional Components vs. Class Components: A comparison between functional and class components, their syntax, when to use each, and how they differ in terms of React features (like hooks and lifecycle methods).
• Creating a Component: A step-by-step guide on how to create a React component (both functional and class-based), with code examples for each.
• Component Props: An explanation of how props are used to pass data into components, with examples of how to handle and destructure props.
• Component Composition (Nesting Components): Instructions on how to compose components by nesting them within each other, with examples demonstrating component hierarchies.
• Default Props and Prop Types (Type Checking in React): A guide to using default props and prop types to define type checking in components, ensuring proper data types are passed as props and avoiding errors.

The content should be written clearly, with examples where necessary, to provide developers a comprehensive understanding of React components, prop management, and component composition. Avoid using any AI-generated content.

🔧 Solution Guidance (Optional)

• Make use of Astro Star Light Components

📋 Steps to Reproduce

• Navigate to src\content\docs\react\components.mdx file in the repository.
• Add content for each of the 6 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!

[programmerraja]

Can i work on this?

[rakshixh]

Hey @programmerraja ,
Please give us the update else will have to unassign you from this issue due to inactivity so that someone else can work on this.