nothing

src/App.tsx

@@ -1,35 +1,43 @@
+import { Grid, useBVH, useGLTF, CameraControls, AccumulativeShadows, OrbitControls, Stats } from '@react-three/drei'
+import { Camera, Canvas, useFrame, useThree, useLoader } from '@react-three/fiber'
 import { useState } from 'react'
-import reactLogo from './assets/react.svg'
-import viteLogo from '/vite.svg'
-import './App.css'
 
-function App() {
-  const [count, setCount] = useState(0)
+const Scene = () => {
+  function Floor() {
+    return (
+      <mesh rotation-x={-Math.PI / 2} position-y={-0.05} receiveShadow>
+        <planeGeometry args={[15, 15]} />
+        <meshStandardMaterial color="#ccc" />
+      </mesh>
+    )
+  }
+  const Axes = () => {
+    return <axesHelper args={[15]} />
+  }
 
   return (
+    // Note that we don't need to import anything, All three.js objects will be treated
+    // as native JSX elements, just like you can just write <div /> or <span /> in
+    // regular ReactDOM. The general rule is that Fiber components are available under
+    // the camel-case version of their name in three.js.
     <>
-      <div>
-        <a href="https://vite.dev" target="_blank">
-          <img src={viteLogo} className="logo" alt="Vite logo" />
-        </a>
-        <a href="https://react.dev" target="_blank">
-          <img src={reactLogo} className="logo react" alt="React logo" />
-        </a>
-      </div>
-      <h1>Vite + React</h1>
-      <div className="card">
-        <button onClick={() => setCount((count) => count + 1)}>
-          count is {count}
-        </button>
-        <p>
-          Edit <code>src/App.tsx</code> and save to test HMR
-        </p>
-      </div>
-      <p className="read-the-docs">
-        Click on the Vite and React logos to learn more
-      </p>
+      <CameraControls />
+      {/* <OrbitControls /> */}
+      <ambientLight intensity={0.05} />
+      <directionalLight castShadow position={[3.3, 6, 4.4]} intensity={5} />
+      <Floor />
+      <Axes />
+      <Stats />
     </>
   )
 }
 
+function App() {
+  return (
+    <Canvas shadows style={{ background: "#e9e9e9", width: "100vw", height: "100vh" }}>
+      <Scene />
+    </Canvas>
+  )
+}
+
 export default App