Implemented skeleton

src/app/components/bingo.module.css

@@ -0,0 +1,8 @@
+.table{
+	margin: 0 auto;
+	border: 1px solid;
+}
+
+.td{
+	padding: 12px 16px;
+}

src/app/components/bingo.tsx

@@ -0,0 +1,16 @@
+import styles from './bingo.module.css'
+import BingoRow from './bingorow.tsx'
+
+export default function Bingo(){
+	return(
+		<table className={styles.table}>
+		<tbody>
+		<BingoRow/>
+		<BingoRow/>
+		<BingoRow/>
+		<BingoRow/>
+		<BingoRow/>
+		</tbody>
+		</table>
+	);
+}

src/app/components/bingoitem.tsx

@@ -0,0 +1,7 @@
+import styles from './bingo.module.css'
+
+export default function BingoItem(){
+	return(
+		<td className={styles.td}>Item</td>
+	);
+}

src/app/components/bingorow.tsx

@@ -0,0 +1,13 @@
+import BingoItem from './bingoitem.tsx'
+
+export default function BingoRow(){
+	return(
+		<tr>
+		<BingoItem/>
+		<BingoItem/>
+		<BingoItem/>
+		<BingoItem/>
+		<BingoItem/>
+		</tr>
+	);
+}

src/app/layout.tsx

@@ -5,8 +5,8 @@ import './globals.css'
 const inter = Inter({ subsets: ['latin'] })
 
 export const metadata: Metadata = {
-  title: 'Create Next App',
-  description: 'Generated by create next app',
+  title: 'Buzzword Bingo',
+  description: 'by data.lore',
 }
 
 export default function RootLayout({

src/app/page.module.css

@@ -1,8 +1,4 @@
 .main {
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  align-items: center;
   padding: 6rem;
   min-height: 100vh;
 }

src/app/page.tsx

@@ -1,95 +1,11 @@
-import Image from 'next/image'
 import styles from './page.module.css'
+import Bingo from './components/bingo.tsx'
 
-export default function Home() {
-  return (
-    <main className={styles.main}>
-      <div className={styles.description}>
-        <p>
-          Get started by editing&nbsp;
-          <code className={styles.code}>src/app/page.tsx</code>
-        </p>
-        <div>
-          <a
-            href="https://vercel.com?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            By{' '}
-            <Image
-              src="/vercel.svg"
-              alt="Vercel Logo"
-              className={styles.vercelLogo}
-              width={100}
-              height={24}
-              priority
-            />
-          </a>
-        </div>
-      </div>
-
-      <div className={styles.center}>
-        <Image
-          className={styles.logo}
-          src="/next.svg"
-          alt="Next.js Logo"
-          width={180}
-          height={37}
-          priority
-        />
-      </div>
-
-      <div className={styles.grid}>
-        <a
-          href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
-          className={styles.card}
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <h2>
-            Docs <span>-&gt;</span>
-          </h2>
-          <p>Find in-depth information about Next.js features and API.</p>
-        </a>
-
-        <a
-          href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
-          className={styles.card}
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <h2>
-            Learn <span>-&gt;</span>
-          </h2>
-          <p>Learn about Next.js in an interactive course with&nbsp;quizzes!</p>
-        </a>
-
-        <a
-          href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
-          className={styles.card}
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <h2>
-            Templates <span>-&gt;</span>
-          </h2>
-          <p>Explore the Next.js 13 playground.</p>
-        </a>
-
-        <a
-          href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
-          className={styles.card}
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <h2>
-            Deploy <span>-&gt;</span>
-          </h2>
-          <p>
-            Instantly deploy your Next.js site to a shareable URL with Vercel.
-          </p>
-        </a>
-      </div>
-    </main>
-  )
+export default function Home(){
+	return(
+		<main className={styles.main}>
+		<h1 align="center">Buzzword Bingo</h1>
+		<Bingo/>
+		</main>
+	);
 }