cleanup imports and page declarations

src/app/about/page.tsx

@@ -1,8 +1,12 @@
-import * as React from 'react';
 import Typography from '@mui/material/Typography';
 import Box from '@mui/material/Box';
+import { Metadata } from "next";
 
-const About = () => {
+export const metadata: Metadata = {
+  title: "About",
+};
+
+const About: React.FC = () => {
   return (
     <Box>
       <Typography variant='h1'>About</Typography>

src/app/contact/page.tsx

@@ -1,8 +1,13 @@
-import * as React from 'react';
+
 import Typography from '@mui/material/Typography';
 import Box from '@mui/material/Box';
+import { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "Contact",
+};
 
-const Contact = () => {
+const Contact: React.FC = () => {
   return (
     <Box>
       <Typography variant='h1'>Contact</Typography>

src/app/layout.tsx

@@ -1,4 +1,5 @@
-import * as React from 'react';
+
+import { Metadata } from "next";
 import { AppRouterCacheProvider } from '@mui/material-nextjs/v14-appRouter';
 import { ThemeProvider } from '@mui/material/styles';
 import CssBaseline from '@mui/material/CssBaseline';
@@ -8,6 +9,29 @@ import Header from '@/components/Header';
 import Footer from '@/components/Footer';
 import MainContainer from '@/components/MainContainer';
 
+export const metadata: Metadata = {
+  title: {
+    template: "%s | Nichole Frey",
+    default: "Nichole Frey", // a default is required when creating a template
+  },
+  description: "Full-Stack Web Developer located in Central Florida",
+
+  generator: "Next.js",
+  applicationName: "Nichole Frey's Portfolio",
+  // referrer: 'origin-when-cross-origin',
+  keywords: [
+    "Full-Stack",
+    "Web Developer",
+    "Next.js",
+    "React",
+    "JavaScript",
+    "TypeScript",
+  ],
+  // authors: [{ name: 'Seb' }, { name: 'Josh', url: 'https://nextjs.org' }],
+  creator: "Nichole Frey",
+  publisher: "Nichole Frey",
+};
+
 interface RootLayoutProps {
   children: React.ReactNode;
 }

src/app/page.tsx

@@ -1,8 +1,12 @@
-import * as React from 'react';
 import Typography from '@mui/material/Typography';
 import Box from '@mui/material/Box';
+import { Metadata } from "next";
 
-const Home = () => {
+export const metadata: Metadata = {
+  title: "Nichole Frey's Portfolio",
+};
+
+const Home: React.FC = () => {
   return (
     <Box>
       <Typography variant='h1'>Welcome</Typography>

src/app/work/page.tsx

@@ -1,8 +1,13 @@
-import * as React from 'react';
+
 import Typography from '@mui/material/Typography';
 import Box from '@mui/material/Box';
+import { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "Work",
+};
 
-const Work = () => {
+const Work: React.FC = () => {
   return (
     <Box>
       <Typography variant='h1'>Work</Typography>