Merge branch 'main' into dev-1

ajay-dhangar · web-flow · commit 4ac975bfd57d · 2025-09-30T21:05:51.000+05:30
diff --git a/.github/workflows/lighthouse-report.yml b/.github/workflows/lighthouse-report.yml
@@ -39,8 +39,7 @@ jobs:
         uses: treosh/lighthouse-ci-action@12.1.0
         with:
           urls: |
-            http://localhost:3000/tutorial
-            http://localhost:3000/tutorial/tags
+            http://localhost:3000/tutorial/
           configPath: ./.github/workflows/lighthouserc.json
           uploadArtifacts: true
           temporaryPublicStorage: true
diff --git a/docs/index.mdx b/docs/index.mdx
@@ -1,6 +1,5 @@
 ---
 title: Welcome to CodeHarborHub
-sidebar_label: Welcome to CodeHarborHub
 sidebar_position: 1
 slug: /
 hide_table_of_contents: true
diff --git a/docs/react/advanced-usage/advanced-configuration.md b/docs/react/advanced-usage/advanced-configuration.md
@@ -5,7 +5,7 @@ sidebar_label: Advanced Configuration
 sidebar_position: 4
 tags: [Create React App, Advanced Configuration, Environment Variables, Webpack, Babel, CRACO, react-scripts, Custom Scripts, Ejectify, Custom Templates]
 keywords: [create react app, advanced configuration, environment variables, webpack, babel, craco, react-scripts, custom scripts, ejectify, custom templates]
-description: "Learn how to customize and fine-tune your React projects with advanced configuration options in Create React App."
+description: "Learn how to customize and fine-tune your React projects with advanced configuration options in Create React App. Discover powerful features and alternatives to ejecting that will help you take control of your development environment."
 hide_table_of_contents: true
 ---
 
@@ -145,4 +145,4 @@ class MyClassComponent extends React.Component {
 
 Congratulations! You've taken your first steps into the exciting world of advanced configuration in Create React App. Now you can customize your projects, add plugins, and take control of your development environment with confidence.
 
-Remember, the power of customization comes with great responsibility. Always experiment with caution and keep an eye on the official documentation for the latest updates and best practices. Happy coding! 🎉
+Remember, the power of customization comes with great responsibility. Always experiment with caution and keep an eye on the official documentation for the latest updates and best practices. Happy coding! 🎉
diff --git a/docs/react/advanced-usage/can-i-use-decorators.md b/docs/react/advanced-usage/can-i-use-decorators.md
@@ -158,4 +158,4 @@ Now, the `title` property cannot be changed from outside the component, keeping
 
 Decorators are a superpower in Create React App, and now you know how to use them to make your components even more awesome! By leveraging class, method, and property decorators, you can add exciting features, enhance behavior, and make your codebase cleaner and more organized.
 
-Remember, with great power comes great responsibility. Use decorators wisely and sparingly, and you'll become a true React pro in no time! Happy coding! 
+Remember, with great power comes great responsibility. Use decorators wisely and sparingly, and you'll become a true React pro in no time! Happy coding! 
diff --git a/docs/react/advanced-usage/custom-templates.md b/docs/react/advanced-usage/custom-templates.md
@@ -312,4 +312,4 @@ npm start
 
 ### Conclusion
 
-Congratulations! You've successfully created your custom template in Create React App. Now you can reuse it or share it with others, making it easier to kickstart future React projects with your preferred configurations, dependencies, and folder structures. Happy coding!
+Congratulations! You've successfully created your custom template in Create React App. Now you can reuse it or share it with others, making it easier to kickstart future React projects with your preferred configurations, dependencies, and folder structures. Happy coding!
diff --git a/docs/react/create-react-app.mdx b/docs/react/create-react-app.mdx
@@ -1,7 +1,6 @@
 ---
 id: create-react-app
-title: Getting Started with React
-sidebar_label: Create React App
+title: Create React App
 sidebar_position: 1
 description: Development and implementation the API of interaction of two sites 
 hide_table_of_contents: true
@@ -70,4 +69,4 @@ To provide feedback, you can:
 - Open an issue on our GitHub repository: [issue](https://github.com/codeharborhub/tutorial/issues)
 - Join our community forum and engage in discussions: [Discussions](https://github.com/orgs/codeharborhub/discussions)
 
-We appreciate your contribution in making Create React App even better!
+We appreciate your contribution in making Create React App even better!
diff --git a/docs/react/development/analyzing-the-bundle-size.md b/docs/react/development/analyzing-the-bundle-size.md
@@ -1,7 +1,6 @@
 ---
 id: analyzing-the-bundle-size
 title: Analyzing Bundle Size
-sidebar_label: Analyzing Bundle Size
 sidebar_position: 3
 tags: [react, create-react-app, source-map-explorer, bundle-size, performance]
 description: "Learn how to analyze the bundle size of your Create React App project using Source Map Explorer. Identify areas of your codebase that might be bloated and optimize them for better performance."
diff --git a/docs/react/development/setting-up-your-editor.md b/docs/react/development/setting-up-your-editor.md
@@ -176,4 +176,4 @@ jsx,ts,tsx,json,css,scss,md}": [
 
 Now, whenever you make a commit, Prettier will automatically format the changed files. You can also run `./node_modules/.bin/prettier --write "src/**/*.{js,jsx,ts,tsx,json,css,scss,md}"` to format your entire project for the first time.
 
-To integrate Prettier with your favorite editor, refer to the [Editor Integration](https://prettier.io/docs/en/editors.html) section on the Prettier GitHub page.
+To integrate Prettier with your favorite editor, refer to the [Editor Integration](https://prettier.io/docs/en/editors.html) section on the Prettier GitHub page.
diff --git a/docs/react/development/using-https-in-development.md b/docs/react/development/using-https-in-development.md
@@ -84,4 +84,4 @@ To avoid having to set the environment variables every time you start the develo
 
    This approach is useful if you want to keep your environment variables separate from the `package.json` file. However, remember to keep your `.env` file private and never commit it to a public repository.
 
-For more detailed information on using environment variables in Create React App (CRA), you can refer to the [official CRA documentation on adding custom environment variables](https://create-react-app.dev/docs/adding-custom-environment-variables).
+For more detailed information on using environment variables in Create React App (CRA), you can refer to the [official CRA documentation on adding custom environment variables](https://create-react-app.dev/docs/adding-custom-environment-variables).
diff --git a/docs/react/getting-started/available-scripts.md b/docs/react/getting-started/available-scripts.md
@@ -51,4 +51,4 @@ You can also run custom scripts by adding them to the `scripts` section of your
 
 ## Learn More
 
-You can learn more about the available scripts and their usage in the [Create React App documentation](https://create-react-app.dev/docs/available-scripts).
+You can learn more about the available scripts and their usage in the [Create React App documentation](https://create-react-app.dev/docs/available-scripts).
diff --git a/docs/react/getting-started/folder-structure.md b/docs/react/getting-started/folder-structure.md
@@ -72,4 +72,4 @@ As a beginner, it's recommended to put your JavaScript and CSS files inside the
 
 Feel free to create additional folders at the top level for organizing your project, like "images" or "docs". However, keep in mind that files in these folders won't be included in the final version of your website when you're ready to publish it.
 
-If you're using Git version control system and your project is not part of a larger repository, a new repository will be initialized, creating a `.git` folder. This helps you track changes to your code and collaborate with others if needed. You can ignore this folder for now if you're not familiar with Git.
+If you're using Git version control system and your project is not part of a larger repository, a new repository will be initialized, creating a `.git` folder. This helps you track changes to your code and collaborate with others if needed. You can ignore this folder for now if you're not familiar with Git.
diff --git a/docs/react/getting-started/forms-in-react.md b/docs/react/getting-started/forms-in-react.md
@@ -1,9 +1,8 @@
 ---
 id: forms-in-react
 title: Forms in React
-sidebar_label: Forms in React
 tags: [react, forms, frontend, web development, tutorial]
-description: "Learn how to handle forms in React comprehensively with examples covering controlled components, uncontrolled components, textarea, select, file input, and more. This extensive guide covers theory, usage, features, examples, best practices, alternatives, and advanced techniques."
+description: Learn how to handle forms in React comprehensively with examples covering controlled components, uncontrolled components, textarea, select, file input, and more. This extensive guide covers theory, usage, features, examples, best practices, alternatives, and advanced techniques.
 hide_table_of_contents: true
 ---
 
@@ -442,4 +441,4 @@ const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(<MyForm />);
 ```
 
-In this example, we're using the `useState` hook to manage the input field's value. The `name` state variable holds the value of the input field, and the `setName` function updates this state whenever the input field changes. This ensures that the input field's value is always controlled by React's state, providing a single source of truth for the form data.
+In this example, we're using the `useState` hook to manage the input field's value. The `name` state variable holds the value of the input field, and the `setName` function updates this state whenever the input field changes. This ensures that the input field's value is always controlled by React's state, providing a single source of truth for the form data.
diff --git a/docs/react/getting-started/supported-browsers-features.md b/docs/react/getting-started/supported-browsers-features.md
@@ -51,4 +51,4 @@ The `browserslist` configuration is set up to ensure your website works smoothly
 
 Please note that the `browserslist` configuration does not automatically include polyfills for you. If you're using any other modern JavaScript features that require additional support, make sure to include the necessary polyfills manually.
 
-To summarize, your website is designed to work with all modern web browsers out of the box. If you need to support older browsers, you can include the required polyfills using the [react-app-polyfill](https://github.com/facebook/create-react-app/blob/main/packages/react-app-polyfill/README.md) package. Additionally, the website project supports advanced JavaScript language features to enhance your coding experience. The `browserslist` configuration ensures broad browser compatibility, and you can manually add polyfills if needed.
+To summarize, your website is designed to work with all modern web browsers out of the box. If you need to support older browsers, you can include the required polyfills using the [react-app-polyfill](https://github.com/facebook/create-react-app/blob/main/packages/react-app-polyfill/README.md) package. Additionally, the website project supports advanced JavaScript language features to enhance your coding experience. The `browserslist` configuration ensures broad browser compatibility, and you can manually add polyfills if needed.
diff --git a/docs/react/getting-started/updating-to-new-releases.md b/docs/react/getting-started/updating-to-new-releases.md
@@ -46,4 +46,4 @@ If you make changes to the `browserslist` configuration but notice that your cha
 
 ## Summary
 
-Keeping your project up to date with the latest version of `react-scripts` is important to ensure that you benefit from the latest features and improvements. By following the migration instructions in the changelog, you can safely update your project to a newer version of `react-scripts` and keep your project in sync with the latest developments in the React ecosystem.
+Keeping your project up to date with the latest version of `react-scripts` is important to ensure that you benefit from the latest features and improvements. By following the migration instructions in the changelog, you can safely update your project to a newer version of `react-scripts` and keep your project in sync with the latest developments in the React ecosystem.
diff --git a/docs/react/react-intro.mdx b/docs/react/react-intro.mdx
@@ -1,7 +1,6 @@
 ---
 id: react-intro
 title: Welcome to React
-sidebar_label: Welcome
 sidebar_position: 2
 description: Development and implementation the API of interaction of two sites 
 tags: [React, JavaScript library, User interfaces, Virtual DOM, Declarative syntax, UI components, Web development, Front-end, Single-page applications, Performance optimization, State management, Component-based architecture, JavaScript framework]
@@ -58,4 +57,4 @@ Here are some additional resources to help you learn React:
 
 Remember, practice is key to mastering React. Explore and build various projects to gain hands-on experience and improve your React skills.
 
-Start your journey with React today and enjoy building awesome web applications with ease! If you have any questions or need assistance, feel free to reach out to us. We're here to help you succeed with React.
+Start your journey with React today and enjoy building awesome web applications with ease! If you have any questions or need assistance, feel free to reach out to us. We're here to help you succeed with React.

Original file line number	Diff line number	Diff line change
@@ -158,4 +158,4 @@ Now, the `title` property cannot be changed from outside the component, keeping
`158`	`158`
`159`	`159`	`Decorators are a superpower in Create React App, and now you know how to use them to make your components even more awesome! By leveraging class, method, and property decorators, you can add exciting features, enhance behavior, and make your codebase cleaner and more organized.`
`160`	`160`
`161`		`-Remember, with great power comes great responsibility. Use decorators wisely and sparingly, and you'll become a true React pro in no time! Happy coding!`
	`161`	`+Remember, with great power comes great responsibility. Use decorators wisely and sparingly, and you'll become a true React pro in no time! Happy coding!`
Original file line number	Diff line number	Diff line change
`@@ -312,4 +312,4 @@ npm start`
`312`	`312`
`313`	`313`	`### Conclusion`
`314`	`314`
`315`		`-Congratulations! You've successfully created your custom template in Create React App. Now you can reuse it or share it with others, making it easier to kickstart future React projects with your preferred configurations, dependencies, and folder structures. Happy coding!`
	`315`	`+Congratulations! You've successfully created your custom template in Create React App. Now you can reuse it or share it with others, making it easier to kickstart future React projects with your preferred configurations, dependencies, and folder structures. Happy coding!`
Original file line number	Diff line number	Diff line change
`@@ -176,4 +176,4 @@ jsx,ts,tsx,json,css,scss,md}": [`
`176`	`176`
`177`	`177`	Now, whenever you make a commit, Prettier will automatically format the changed files. You can also run `./node_modules/.bin/prettier --write "src/*/.{js,jsx,ts,tsx,json,css,scss,md}"` to format your entire project for the first time.
`178`	`178`
`179`		`-To integrate Prettier with your favorite editor, refer to the [Editor Integration](https://prettier.io/docs/en/editors.html) section on the Prettier GitHub page.`
	`179`	`+To integrate Prettier with your favorite editor, refer to the [Editor Integration](https://prettier.io/docs/en/editors.html) section on the Prettier GitHub page.`
Original file line number	Diff line number	Diff line change
`@@ -84,4 +84,4 @@ To avoid having to set the environment variables every time you start the develo`
`84`	`84`
`85`	`85`	This approach is useful if you want to keep your environment variables separate from the `package.json` file. However, remember to keep your `.env` file private and never commit it to a public repository.
`86`	`86`
`87`		`-For more detailed information on using environment variables in Create React App (CRA), you can refer to the [official CRA documentation on adding custom environment variables](https://create-react-app.dev/docs/adding-custom-environment-variables).`
	`87`	`+For more detailed information on using environment variables in Create React App (CRA), you can refer to the [official CRA documentation on adding custom environment variables](https://create-react-app.dev/docs/adding-custom-environment-variables).`
Original file line number	Diff line number	Diff line change
@@ -51,4 +51,4 @@ You can also run custom scripts by adding them to the `scripts` section of your
`51`	`51`
`52`	`52`	`## Learn More`
`53`	`53`
`54`		`-You can learn more about the available scripts and their usage in the [Create React App documentation](https://create-react-app.dev/docs/available-scripts).`
	`54`	`+You can learn more about the available scripts and their usage in the [Create React App documentation](https://create-react-app.dev/docs/available-scripts).`