diff --git a/Week-1/Task-4/vanilla/index.html b/Week-1/Task-4/vanilla/index.html
new file mode 100644
index 0000000..6010e1f
--- /dev/null
+++ b/Week-1/Task-4/vanilla/index.html
@@ -0,0 +1,18 @@
+
+
+
+
+
+ My first three.js app
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Week-1/Task-4/vanilla/main.js b/Week-1/Task-4/vanilla/main.js
new file mode 100644
index 0000000..3d97fe8
--- /dev/null
+++ b/Week-1/Task-4/vanilla/main.js
@@ -0,0 +1,25 @@
+import * as THREE from 'three';
+
+const scene = new THREE.Scene();
+const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
+
+const renderer = new THREE.WebGLRenderer();
+renderer.setSize(window.innerWidth, window.innerHeight);
+renderer.setAnimationLoop(animate);
+document.body.appendChild(renderer.domElement);
+
+const geometry = new THREE.BoxGeometry(1, 1, 1);
+const material = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
+const cube = new THREE.Mesh(geometry, material);
+scene.add(cube);
+
+camera.position.z = 5;
+
+function animate(time) {
+
+ cube.rotation.x = time / 2000;
+ cube.rotation.y = time / 1000;
+
+ renderer.render(scene, camera);
+
+}
\ No newline at end of file
diff --git a/Week-1/Task-4/vanilla/package.json b/Week-1/Task-4/vanilla/package.json
index 3e49788..8bb1539 100644
--- a/Week-1/Task-4/vanilla/package.json
+++ b/Week-1/Task-4/vanilla/package.json
@@ -4,9 +4,15 @@
"version": "0.0.0",
"packageManager": "yarn@1.22.22",
"scripts": {
- "dev": "echo 'Add your Three.js dev script here'",
- "build": "echo 'Add your Three.js build script here'",
+ "dev": "vite",
+ "build": "vite build",
"lint": "echo 'Add your lint script here'",
"clean": "rm -rf dist build"
+ },
+ "dependencies": {
+ "three": "^0.183.2"
+ },
+ "devDependencies": {
+ "vite": "^8.0.3"
}
-}
\ No newline at end of file
+}