add sample unity app with webgl

app/unity/page.tsx

@@ -1,11 +1,12 @@
+"use client";
 import { Unity, useUnityContext } from "react-unity-webgl";
 
 export default function Home() {
   const { unityProvider, isLoaded, loadingProgression } = useUnityContext({
-    loaderUrl: "build/myunityapp.loader.js",
-    dataUrl: "build/myunityapp.data",
-    frameworkUrl: "build/myunityapp.framework.js",
-    codeUrl: "build/myunityapp.wasm",
+    loaderUrl: "/unity/test-project/build.loader.js",
+    dataUrl: "/unity/test-project/build.data",
+    frameworkUrl: "/unity/test-project/build.framework.js",
+    codeUrl: "/unity/test-project/build.wasm",
   });
 
   // We'll round the loading progression to a whole number to represent the
@@ -13,15 +14,21 @@ export default function Home() {
   const loadingPercentage = Math.round(loadingProgression * 100);
 
   return (
-    <div className="relative h-[600px] w-[800px]">
-      {isLoaded === false && (
-        // We'll conditionally render the loading overlay if the Unity
-        // Application is not loaded.
-        <div className="absolute left-0 top-0 flex h-full w-full items-center justify-center bg-gray-500">
-          <p>Loading... ({loadingPercentage}%)</p>
-        </div>
-      )}
-      <Unity className="unity" unityProvider={unityProvider} />
-    </div>
+    <>
+      <div className="mb-5 mt-5">
+        새 Unity 프로젝트를 생성하고, WebGL로 빌드 후 빌드 산출물을
+        react-unity-webgl 라이브러리를 통해 실행했다.
+      </div>
+      <div className="relative h-[600px] w-[800px]">
+        {isLoaded === false && (
+          // We'll conditionally render the loading overlay if the Unity
+          // Application is not loaded.
+          <div className="absolute left-0 top-0 flex h-full w-full items-center justify-center bg-gray-500">
+            <p>Loading... ({loadingPercentage}%)</p>
+          </div>
+        )}
+        <Unity className="h-full w-full" unityProvider={unityProvider} />
+      </div>
+    </>
   );
 }