diff --git a/Week-1/Task-2/r3f/index.html b/Week-1/Task-2/r3f/index.html
new file mode 100644
index 0000000..517a149
--- /dev/null
+++ b/Week-1/Task-2/r3f/index.html
@@ -0,0 +1,12 @@
+
+
+
+
+
+ Task 2 — Texture Mapping (R3F)
+
+
+
+
+
+
diff --git a/Week-1/Task-2/r3f/package.json b/Week-1/Task-2/r3f/package.json
new file mode 100644
index 0000000..21f55bb
--- /dev/null
+++ b/Week-1/Task-2/r3f/package.json
@@ -0,0 +1,21 @@
+{
+ "name": "task-2-r3f",
+ "version": "0.0.0",
+ "private": true,
+ "type": "module",
+ "scripts": {
+ "dev": "vite",
+ "build": "vite build",
+ "preview": "vite preview"
+ },
+ "dependencies": {
+ "@react-three/fiber": "^8.16.8",
+ "react": "^18.3.1",
+ "react-dom": "^18.3.1",
+ "three": "^0.163.0"
+ },
+ "devDependencies": {
+ "@vitejs/plugin-react": "^4.3.1",
+ "vite": "^5.0.0"
+ }
+}
diff --git a/Week-1/Task-2/r3f/src/App.jsx b/Week-1/Task-2/r3f/src/App.jsx
new file mode 100644
index 0000000..53866f7
--- /dev/null
+++ b/Week-1/Task-2/r3f/src/App.jsx
@@ -0,0 +1,17 @@
+import { Canvas } from '@react-three/fiber'
+import Box from './Box'
+
+function App() {
+ return (
+
+
+
+ )
+}
+
+export default App
\ No newline at end of file
diff --git a/Week-1/Task-2/r3f/src/Box.jsx b/Week-1/Task-2/r3f/src/Box.jsx
new file mode 100644
index 0000000..824e24a
--- /dev/null
+++ b/Week-1/Task-2/r3f/src/Box.jsx
@@ -0,0 +1,38 @@
+import { useRef, useMemo } from 'react'
+import { useFrame } from '@react-three/fiber'
+import * as THREE from 'three'
+
+function Box() {
+ const meshRef = useRef()
+
+ const texture = useMemo(() => {
+ const canvas = document.createElement('canvas')
+ canvas.width = 256
+ canvas.height = 256
+
+ const ctx = canvas.getContext('2d')
+
+ ctx.fillStyle = 'white'
+ ctx.fillRect(0, 0, 256, 256)
+
+ ctx.fillStyle = 'black'
+ ctx.fillRect(0, 0, 128, 128)
+ ctx.fillRect(128, 128, 128, 128)
+
+ return new THREE.CanvasTexture(canvas)
+ }, [])
+
+ useFrame(() => {
+ meshRef.current.rotation.x += 0.01
+ meshRef.current.rotation.y += 0.01
+ })
+
+ return (
+
+
+
+
+ )
+}
+
+export default Box
diff --git a/Week-1/Task-2/r3f/src/main.jsx b/Week-1/Task-2/r3f/src/main.jsx
new file mode 100644
index 0000000..e8e6289
--- /dev/null
+++ b/Week-1/Task-2/r3f/src/main.jsx
@@ -0,0 +1,4 @@
+import { createRoot } from 'react-dom/client'
+import App from './App.jsx'
+
+createRoot(document.getElementById('root')).render()
diff --git a/Week-1/Task-2/r3f/vite.config.js b/Week-1/Task-2/r3f/vite.config.js
new file mode 100644
index 0000000..9ffcc67
--- /dev/null
+++ b/Week-1/Task-2/r3f/vite.config.js
@@ -0,0 +1,6 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+
+export default defineConfig({
+ plugins: [react()],
+})