dummy content

app/about/page.tsx

@@ -0,0 +1,73 @@
+const people = [
+  {
+    name: "Jane Cooper",
+    role: "Paradigm Representative",
+    imageUrl:
+      "https://images.unsplash.com/photo-1519345182560-3f2917c472ef?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=8&w=1024&h=1024&q=80",
+    linkedinUrl: "#",
+  },
+  {
+    name: "Jane Cooper",
+    role: "Paradigm Representative",
+    imageUrl:
+      "https://images.unsplash.com/photo-1519345182560-3f2917c472ef?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=8&w=1024&h=1024&q=80",
+    linkedinUrl: "#",
+  },
+  {
+    name: "Jane Cooper",
+    role: "Paradigm Representative",
+    imageUrl:
+      "https://images.unsplash.com/photo-1519345182560-3f2917c472ef?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=8&w=1024&h=1024&q=80",
+    linkedinUrl: "#",
+  },
+]
+
+export default async function About() {
+  return (
+    <section>
+      <div className="mx-auto grid max-w-screen-xl px-4 py-8 text-center lg:py-16">
+        <div className="mx-auto place-self-center">
+          {" "}
+          <div className="py-24 sm:py-32">
+            <div className="mx-auto max-w-7xl px-6 text-center lg:px-8">
+              <div className="mx-auto max-w-2xl">
+                <h2 className="text-3xl font-bold tracking-tight text-primary-800 sm:text-4xl">Meet our team</h2>
+                <p className="mt-4 text-lg leading-8 text-primary-800">
+                  We’re a dynamic group of individuals who are passionate about what we do.
+                </p>
+              </div>
+              <ul
+                role="list"
+                className="mx-auto mt-20 grid max-w-2xl grid-cols-1 gap-6 sm:grid-cols-2 lg:mx-0 lg:max-w-none lg:grid-cols-3 lg:gap-8"
+              >
+                {people.map((person) => (
+                  <li key={person.name} className="rounded-2xl bg-primary-800 px-8 py-10">
+                    <img className="mx-auto h-48 w-48 rounded-full md:h-56 md:w-56" src={person.imageUrl} alt="" />
+                    <h3 className="mt-6 text-base font-semibold leading-7 tracking-tight text-primary-50">
+                      {person.name}
+                    </h3>
+                    <p className="text-sm leading-6 text-primary-50">{person.role}</p>
+                    <ul role="list" className="mt-6 flex justify-center gap-x-6">
+                      <li>
+                        <a href={person.linkedinUrl} className="text-primary-50 hover:text-primary-50">
+                          <span className="sr-only">LinkedIn</span>
+                          <svg className="h-5 w-5" aria-hidden="true" fill="currentColor" viewBox="0 0 20 20">
+                            <path
+                              fillRule="evenodd"
+                              d="M16.338 16.338H13.67V12.16c0-.995-.017-2.277-1.387-2.277-1.39 0-1.601 1.086-1.601 2.207v4.248H8.014v-8.59h2.559v1.174h.037c.356-.675 1.227-1.387 2.526-1.387 2.703 0 3.203 1.778 3.203 4.092v4.711zM5.005 6.575a1.548 1.548 0 11-.003-3.096 1.548 1.548 0 01.003 3.096zm-1.337 9.763H6.34v-8.59H3.667v8.59zM17.668 1H2.328C1.595 1 1 1.581 1 2.298v15.403C1 18.418 1.595 19 2.328 19h15.34c.734 0 1.332-.582 1.332-1.299V2.298C19 1.581 18.402 1 17.668 1z"
+                              clipRule="evenodd"
+                            />
+                          </svg>
+                        </a>
+                      </li>
+                    </ul>
+                  </li>
+                ))}
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  )
+}

app/api/chat/route.ts

@@ -0,0 +1,27 @@
+import { OpenAIStream, StreamingTextResponse } from 'ai'
+import { Configuration, OpenAIApi } from 'openai-edge'
+
+// Create an OpenAI API client (that's edge friendly!)
+const config = new Configuration({
+    apiKey: process.env.OPENAI_API_KEY
+})
+const openai = new OpenAIApi(config)
+
+// IMPORTANT! Set the runtime to edge
+export const runtime = 'edge'
+
+export async function POST(req: Request) {
+    // Extract the `messages` from the body of the request
+    const { messages } = await req.json()
+
+    // Ask OpenAI for a streaming chat completion given the prompt
+    const response = await openai.createChatCompletion({
+        model: 'gpt-3.5-turbo',
+        stream: true,
+        messages
+    })
+    // Convert the response into a friendly text-stream
+    const stream = OpenAIStream(response)
+    // Respond with the stream
+    return new StreamingTextResponse(stream)
+}

app/page.tsx

@@ -1,11 +1,37 @@
+import Link from "next/link"
+
 export default async function Web() {
   return (
     <section>
       <div className="mx-auto grid max-w-screen-xl px-4 py-8 text-center lg:py-16">
         <div className="mx-auto place-self-center">
-          <h1 className="mb-4 max-w-2xl text-4xl font-extrabold leading-none tracking-tight md:text-5xl xl:text-6xl">
-            IsaCon
-          </h1>
+          <div className="relative">
+            <div className="mx-auto max-w-7xl lg:grid lg:grid-cols-12 lg:gap-x-8 lg:px-8">
+              <div className="px-6 pb-24 pt-10 sm:pb-32 lg:col-span-7 lg:px-0 lg:pb-56 lg:pt-48 xl:col-span-6">
+                <div className="mx-auto max-w-2xl lg:mx-0">
+                  <h1 className="mt-24 text-4xl font-bold tracking-tight text-primary-800 sm:mt-10 sm:text-6xl">
+                    Your personal <span className="block xl:inline">web development team</span>
+                  </h1>
+                  <p className="mt-6 text-lg leading-8 text-primary-800">
+                    We are a team of experienced web developers, designers and project managers. We build web
+                    applications, websites and mobile apps for startups and established businesses.
+                  </p>
+                  <div className="mt-10 flex items-center gap-x-6">
+                    <Link href="/about" className="text-sm font-semibold leading-6 text-primary-800">
+                      Learn more <span aria-hidden="true">→</span>
+                    </Link>
+                  </div>
+                </div>
+              </div>
+              <div className="relative lg:col-span-5 lg:-mr-8 xl:absolute xl:inset-0 xl:left-1/2 xl:mr-0">
+                <img
+                  className="aspect-[3/2] w-full object-cover lg:absolute lg:inset-0 lg:aspect-auto lg:h-full"
+                  src="https://images.unsplash.com/photo-1498758536662-35b82cd15e29?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2102&q=80"
+                  alt=""
+                />
+              </div>
+            </div>
+          </div>
         </div>
       </div>
     </section>