A reusable header component built with TypeScript and React, designed for use across multiple Next.js projects.
Installation
To install this package, run:
npm install hungnc-shared-header
yarn add hungnc-shared-header
Usage
Import the component in your project and use it as follows:
import { Header } from 'hungnc-shared-header';
const App = () => {
return (
<div>
<Header
title="Welcome to My Site"
subtitle="Making things easy"
backgroundColor="#0070f3"
/>
</div>
);
};
export default App;
Props
title
(string): The main title text displayed in the header.subtitle
(string, optional): The subtitle text displayed below the title.backgroundColor
(string, optional): The background color of the header. Defaults to #333
.
Development
5. Build the Package
To compile TypeScript files to JavaScript in the dist
folder, run:
npm run build
6. Publish to NPM
Login to NPM (if not already done):
npm login
Publish the package:
npm publish --access public
License
MIT License