SEOConfigProvider
SEOConfigProvider
is a React hook that provides SEO configuration to your components through a context. It allows you to easily manage and share SEO-related properties across your application.
Installation
To use SEOConfigProvider
, you'll need to have React installed in your project. You can add it to your project using npm or yarn:
npm install react
# or
yarn add react
Next, install SEOConfigProvider
:
npm install @1ohooks/SEOConfigProvider
# or
yarn add @1ohooks/SEOConfigProvider
Usage
Importing
You can import SEOConfigProvider
and useSEOConfig
in your components as follows:
import { SEOConfigProvider, useSEOConfig } from '@1ohooks/SEOConfigProvider';
Setting up the Provider
Wrap your application or a specific part of it with the SEOConfigProvider
to make the SEO configuration available to your components:
import React from 'react';
const App = () => {
const seoConfig = {
title: 'My Awesome Website',
description: 'A description of my website.',
// Add other SEO properties here
};
return (
<SEOConfigProvider config={seoConfig}>
{/* Your application components */}
</SEOConfigProvider>
);
};
export default App;
Accessing SEO Configuration
You can use the useSEOConfig
hook to access the SEO configuration within your components:
import React from 'react';
import { useSEOConfig } from '@1ohooks/SEOConfigProvider';
const MyComponent = () => {
const seoConfig = useSEOConfig();
// Access SEO properties
const { title, description } = seoConfig;
return (
<div>
<h1>{title}</h1>
<p>{description}</p>
{/* Add other SEO-related elements */}
</div>
);
};
export default MyComponent;
Make sure to wrap components that use useSEOConfig
within a SEOConfigProvider
higher up in the component tree.
Contributing
Contributions are welcome! If you have suggestions, bug reports, or would like to contribute code, please create an issue or submit a pull request on the GitHub repository.
License
This project is licensed under the MIT License - see the LICENSE file for details.