- implémentation de threejs.

- Création environnement 3D océan.

front/src/pages/GamePage.tsx

@@ -1,9 +1,29 @@
+import { Canvas } from "@react-three/fiber";
+import { OrbitControls, Sky } from "@react-three/drei";
+import * as THREE from "three";
+import { useEffect, useRef } from "react";
+import Ocean from "../components/3d/Ocean";
+
+
+
 
 export default function GamePage() {
     return (
-        <div>
-            <h1>Game Page</h1>
+        <div id="canvas-container">
+            <Canvas>
+                <mesh position={[0, 0, 0]} scale={[1, 1, 1]}>
+                    <boxGeometry args={[1, 1, 1]} />
+                    <meshStandardMaterial />
+                    <ambientLight intensity={0.5} />
+                    <directionalLight color="red" position={[5, 5, 5]} />
+                    <Sky sunPosition={[100, 10, 100]} />
+                    
+                    
+                </mesh>
+
+                <OrbitControls />
+                <Ocean />
+            </Canvas>
         </div>
     )
-}
-
+}