Walidoux/next-app-boilerplate
Walidoux/next-app-boilerplate
Template
1
1
Fork 0
Code Issues Pull Requests Actions Releases Activity

feat(components): implement Head for each page with reusability

Browse Source
This commit is contained in:
Walid 2022-03-24 15:01:50 +01:00
parent 64190593dd
commit 2e0aecd153
No known key found for this signature in database
GPG Key ID: 4BDA1ABD227F9279
2 changed files with 33 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
components/Head/NextHead.tsx Normal file
View File

@ -0,0 +1,32 @@
import Head from 'next/head'
import { projectConfig } from '@/utils/config'
interface HeadProps {
longName?: string
shortName?: string
}
const NextHead: React.FC<HeadProps> = (props) => {
const {
longName = projectConfig.longName,
shortName = projectConfig.shortName,
children
} = props
return (
<Head>
<title>
{props.longName == null
? longName
: props.shortName == null && shortName}
</title>
<meta name='viewport' content='width=device-width, initial-scale=1.0' />
{children}
</Head>
)
}
export default NextHead

2
pages/index.tsx
View File

@ -1,6 +1,6 @@
import type { NextPage } from 'next' import type { NextPage } from 'next'
import Head from '../components/Head' import Head from '../components/Head/NextHead'
const Home: NextPage = () => { const Home: NextPage = () => {
return ( return (