diff --git a/src/app/CreateWine.tsx b/src/app/CreateWine.tsx
new file mode 100644
index 0000000..5b1ad5f
--- /dev/null
+++ b/src/app/CreateWine.tsx
@@ -0,0 +1,24 @@
+"use client";
+
+import { FormEvent } from "react";
+import { allProducers, insertWine } from "~/server/db";
+
+export default function CreateWine() {
+  function handleSubmit(event: FormEvent<HTMLFormElement>) {
+    event.preventDefault();
+
+    const formData = new FormData(event.currentTarget);
+    const response = insertWine(formData);
+  }
+  return (
+    <form onSubmit={handleSubmit}>
+      <select name="producer" id="producer">
+        {allProducers.map((producer) => (
+          <option key={producer.id} value={producer.id}>
+            {producer.name}
+          </option>
+        ))}
+      </select>
+    </form>
+  );
+}
diff --git a/src/app/page.tsx b/src/app/page.tsx
index c2ae5a1..a8d7ed2 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,9 +1,28 @@
-export default function HomePage() {
+import { FormEvent } from "react";
+import { allWines, insertWine, allProducers } from "~/server/db";
+import CreateWine from "./CreateWine";
+
+export const dynamic = "force-dynamic";
+
+function WineCards() {
+  return (
+    <>
+      {allWines.map((wine) => (
+        <div key={wine.id}>
+          {wine.name} - {wine.producer}
+        </div>
+      ))}
+    </>
+  );
+}
+
+export default async function HomePage() {
   return (
     <main className="">
       <div className="container ">
         <h1>Yes hello</h1>
-        <p></p>
+        {/* <CreateWine  /> */}
+        <WineCards />
       </div>
     </main>
   );
diff --git a/src/server/db/index.ts b/src/server/db/index.ts
index 5153599..8c70d51 100644
--- a/src/server/db/index.ts
+++ b/src/server/db/index.ts
@@ -1,7 +1,15 @@
-import "./src/server/db/envConfig"
+import "./envConfig"
 import { drizzle } from 'drizzle-orm/vercel-postgres';
 import { sql } from '@vercel/postgres';
 import * as schema from './schema';
 
 export const db = drizzle(sql, { schema });
 
+export const allWines = await db.query.wines.findMany();
+
+type NewWine = typeof schema.wines.$inferInsert;
+export const insertWine = async (wine: NewWine) => {
+    return db.insert(schema.wines).values(wine).returning();
+}
+
+export const allProducers = await db.query.producers.findMany();
diff --git a/src/server/db/schema.ts b/src/server/db/schema.ts
index 03b0417..15ed081 100644
--- a/src/server/db/schema.ts
+++ b/src/server/db/schema.ts
@@ -20,7 +20,7 @@ export const createTable = pgTableCreator((name) => `wine-shop_${name}`);
 export const producers = createTable(
   "producer",
   {
-    id: uuid('id').primaryKey(),
+    id: uuid('id').primaryKey().defaultRandom(),
     name: text('name').notNull(),
     createdAt: timestamp('createdAt').defaultNow().notNull(),
     country: text('country').notNull(),
@@ -41,7 +41,7 @@ export const producersRelations = relations(producers, ({ many }) => ({
 export const wines = createTable(
   "wine",
   {
-    id: uuid('id').primaryKey(),
+    id: uuid('id').primaryKey().defaultRandom(),
     name: text('name').notNull(),
     createdAt: timestamp('createdAt').defaultNow().notNull(),
     updatedAt: timestamp('updatedAt').defaultNow(),
@@ -59,4 +59,10 @@ export const winesRelations = relations(wines, ({ one }) => ({
     fields: [wines.producer],
     references: [producers.id],
   }),
-}));
\ No newline at end of file
+}));
+
+export type SelectWine = typeof wines.$inferSelect;
+
+
+export type SelectProducer = typeof producers.$inferSelect;
+export type InsertProducer = typeof producers.$inferInsert;
\ No newline at end of file