feat: integrate GSAP for object animations and update package dependencies

src/script.js

@@ -1,5 +1,6 @@
 import './style.css'
 import * as THREE from 'three'
+import gsap from 'gsap'
 
 // Canvas
 const canvas = document.querySelector('canvas.webgl')
@@ -31,19 +32,22 @@ const renderer = new THREE.WebGLRenderer({
 renderer.setSize(sizes.width, sizes.height)
 
 // Clock
-const clock = new THREE.Clock()
+// const clock = new THREE.Clock()
+gsap.to(mesh.position, { x: 2, duration: 1, delay: 1})
+gsap.to(mesh.position, { x: 0, duration: 1, delay: 2})
 
 
 // Animations
 const tick = () => {
 
-    // Clock
-    const elapsedTime = clock.getElapsedTime()
+    // // Clock
+    // const elapsedTime = clock.getElapsedTime()
 
-    // Update objects
-    mesh.rotation.y = elapsedTime * Math.PI * 2
-    mesh.position.y = Math.sin(elapsedTime)
-    mesh.position.x = Math.cos(elapsedTime)
+    // // Update objects
+    // mesh.rotation.y = elapsedTime * Math.PI * 2
+    // mesh.position.y = Math.sin(elapsedTime)
+    // mesh.position.x = Math.cos(elapsedTime)
+    // camera.lookAt(mesh.position)
     
     // Renderer
     renderer.render(scene, camera)