add tween

package.json

@@ -18,6 +18,7 @@
     "@docsearch/react": "3",
     "@giscus/react": "^2.2.0",
     "@mapbox/rehype-prism": "^0.8.0",
+    "@tweenjs/tween.js": "^18.6.4",
     "algoliasearch": "^4.14.2",
     "classnames": "^2.3.2",
     "dayjs": "^1.11.5",
@@ -58,4 +59,4 @@
     "tailwindcss": "^3.1.8",
     "typescript": "4.8.4"
   }
-}
+}

pages/about.tsx

@@ -1,12 +1,21 @@
 import classNames from 'classnames';
 import dynamic from 'next/dynamic';
+import { InitFn, useThree } from 'rua-three';
 import { NextPageWithLayout } from 'types';
 
 const MainLayout = dynamic(() => import('layouts/MainLayout'));
 
 const About: NextPageWithLayout = () => {
+  const init: InitFn = () => {};
+
+  const { ref } = useThree({
+    init,
+  });
+
   return (
     <>
+      <canvas></canvas>
+
       <main className="h-[calc(100vh-142px)] flex flex-col">
         <div
           className={classNames(
@@ -35,8 +44,6 @@ const About: NextPageWithLayout = () => {
             </div>
           </div> */}
           <h1 className="text-5xl font-semibold font-Barlow">About</h1>
-
-          <p></p>
         </div>
       </main>
     </>

public/models/cloud_station/license.txt

@@ -0,0 +1,11 @@
+Model Information:
+* title:	Cloud Station
+* source:	https://sketchfab.com/3d-models/cloud-station-26f81b24d83441ba88c7e80a52adbaaf
+* author:	Alexa Kruckenberg (https://sketchfab.com/AlexaKruckenberg)
+
+Model License:
+* license type:	CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)
+* requirements:	Author must be credited. Commercial use is allowed.
+
+If you use this 3D model in your project be sure to copy paste this credit wherever you share it:
+This work is based on "Cloud Station" (https://sketchfab.com/3d-models/cloud-station-26f81b24d83441ba88c7e80a52adbaaf) by Alexa Kruckenberg (https://sketchfab.com/AlexaKruckenberg) licensed under CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)

yarn.lock

@@ -1788,6 +1788,11 @@
   resolved "https://registry.npmmirror.com/@tootallnate/once/-/once-2.0.0.tgz#f544a148d3ab35801c1f633a7441fd87c2e484bf"
   integrity sha512-XCuKFP5PS55gnMVu3dty8KPatLqUoy/ZYzDzAGCQ8JNFCkLXzmI7vNHCR+XpbZaMWQK/vQubr7PkYq8g470J/A==
 
+"@tweenjs/tween.js@^18.6.4":
+  version "18.6.4"
+  resolved "https://registry.npmjs.org/@tweenjs/tween.js/-/tween.js-18.6.4.tgz#40a3d0a93647124872dec8e0fd1bd5926695b6ca"
+  integrity sha512-lB9lMjuqjtuJrx7/kOkqQBtllspPIN+96OvTCeJ2j5FEzinoAXTdAMFnDAQT1KVPRlnYfBrqxtqP66vDM40xxQ==
+
 "@types/acorn@^4.0.0":
   version "4.0.6"
   resolved "https://registry.npmmirror.com/@types/acorn/-/acorn-4.0.6.tgz#d61ca5480300ac41a7d973dd5b84d0a591154a22"