diff --git a/app/draw-io/page.tsx b/app/draw-io/page.tsx index 14edaa5..f21f0ab 100644 --- a/app/draw-io/page.tsx +++ b/app/draw-io/page.tsx @@ -1,6 +1,4 @@ "use client"; -import Image from "next/image"; -import Link from "next/link"; import { useRef, useState } from "react"; import { DrawIoEmbed, DrawIoEmbedRef } from "react-drawio"; @@ -8,55 +6,31 @@ export default function Home() { const [imgData, setImgData] = useState(""); const drawioRef = useRef(null); return ( -
-
- - Home - -
- - By{" "} - Vercel Logo - -
-
+
{ console.log(`onExport executed: - ${JSON.stringify(data, null, 2)}`); + ${JSON.stringify(data, null, 2)}`); setImgData(data.data); }} onClose={(data) => { console.log(`onClose executed: - ${JSON.stringify(data, null, 2)}`); + ${JSON.stringify(data, null, 2)}`); }} />
미리보기
- {imgData && ( + {imgData ? ( + ) : ( +
)} -
+ ); } diff --git a/app/layout.tsx b/app/layout.tsx index 9a90ed8..88d8550 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -3,6 +3,8 @@ import { SpeedInsights } from "@vercel/speed-insights/next"; import type { Metadata } from "next"; import { Inter } from "next/font/google"; +import Image from "next/image"; +import Link from "next/link"; import "./globals.css"; const inter = Inter({ subsets: ["latin"] }); @@ -20,10 +22,82 @@ export default function RootLayout({ return ( - {children} +
+
+ + Home + +
+ + By{" "} + Vercel Logo + +
+
+ {children} +
+ {linkItemProp.map((linkItem, i) => ( + +

+ {linkItem.title}{" "} + + -> + +

+

+ {linkItem.sub} +

+ + ))} +
+
); } + +const linkItemProp = [ + { + href: "https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app", + title: "Docs", + sub: "Find in-depth information about Next.js features and API.", + }, + { + href: "https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app", + title: "Learn", + sub: "Learn about Next.js in an interactive course with quizzes!", + }, + { + href: "https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app", + title: "Templates", + sub: "Explore starter templates for Next.js.", + }, + { + href: "https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app", + title: "Deploy", + sub: "Instantly deploy your Next.js site to a shareable URL with Vercel.", + }, +]; diff --git a/app/page.tsx b/app/page.tsx index 841cd8d..1749683 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,97 +1,23 @@ -import Image from "next/image"; import Link from "next/link"; -const linkItemProp = [ - { - href: "https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app", - title: "Docs", - sub: "Find in-depth information about Next.js features and API.", - }, - { - href: "https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app", - title: "Learn", - sub: "Learn about Next.js in an interactive course with quizzes!", - }, - { - href: "https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app", - title: "Templates", - sub: "Explore starter templates for Next.js.", - }, - { - href: "https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app", - title: "Deploy", - sub: "Instantly deploy your Next.js site to a shareable URL with Vercel.", - }, -]; - export default function Home() { return ( -
-
+ <> +
- Home + Draw.io + + + Unity -
-
- Next.js Logo -
- - Draw.io -

Next.js 및 tailwind css, 기타등등... 사용해보기

- -
- {linkItemProp.map((linkItem, i) => ( - -

- {linkItem.title}{" "} - - -> - -

-

- {linkItem.sub} -

- - ))} -
-
+ ); } diff --git a/app/unity/page.tsx b/app/unity/page.tsx new file mode 100644 index 0000000..6ff5373 --- /dev/null +++ b/app/unity/page.tsx @@ -0,0 +1,3 @@ +export default function Home() { + return <>; +}