Remove deprecated files and templates: Delete unused files including deployment scripts, environment configurations, and various HTML templates to streamline the project structure. This cleanup enhances maintainability and reduces clutter in the codebase.

static/background.js

@@ -0,0 +1,108 @@
+// Background animation with Three.js
+let scene, camera, renderer, stars = [];
+
+function initBackground() {
+    // Setup scene
+    scene = new THREE.Scene();
+    
+    // Setup camera
+    camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 1, 1000);
+    camera.position.z = 100;
+    
+    // Setup renderer
+    renderer = new THREE.WebGLRenderer({ alpha: true });
+    renderer.setSize(window.innerWidth, window.innerHeight);
+    renderer.setClearColor(0x000000, 0); // Transparent background
+    
+    // Append renderer to DOM
+    const backgroundContainer = document.getElementById('background-container');
+    if (backgroundContainer) {
+        backgroundContainer.appendChild(renderer.domElement);
+    }
+    
+    // Add stars
+    for (let i = 0; i < 1000; i++) {
+        const geometry = new THREE.SphereGeometry(0.2, 8, 8);
+        const material = new THREE.MeshBasicMaterial({ color: 0xffffff, transparent: true, opacity: Math.random() * 0.5 + 0.1 });
+        const star = new THREE.Mesh(geometry, material);
+        
+        // Random position
+        star.position.x = Math.random() * 600 - 300;
+        star.position.y = Math.random() * 600 - 300;
+        star.position.z = Math.random() * 600 - 300;
+        
+        // Store reference to move in animation
+        star.velocity = Math.random() * 0.02 + 0.005;
+        stars.push(star);
+        
+        scene.add(star);
+    }
+    
+    // Add large glowing particles
+    for (let i = 0; i < 15; i++) {
+        const size = Math.random() * 5 + 2;
+        const geometry = new THREE.SphereGeometry(size, 16, 16);
+        
+        // Create a glowing material
+        const color = new THREE.Color();
+        color.setHSL(Math.random(), 0.7, 0.5); // Random hue
+        
+        const material = new THREE.MeshBasicMaterial({ 
+            color: color, 
+            transparent: true, 
+            opacity: 0.2
+        });
+        
+        const particle = new THREE.Mesh(geometry, material);
+        
+        // Random position but further away
+        particle.position.x = Math.random() * 1000 - 500;
+        particle.position.y = Math.random() * 1000 - 500;
+        particle.position.z = Math.random() * 200 - 400;
+        
+        // Store reference to move in animation
+        particle.velocity = Math.random() * 0.01 + 0.002;
+        stars.push(particle);
+        
+        scene.add(particle);
+    }
+    
+    // Handle window resize
+    window.addEventListener('resize', onWindowResize);
+    
+    // Start animation
+    animate();
+}
+
+function animate() {
+    requestAnimationFrame(animate);
+    
+    // Move stars
+    stars.forEach(star => {
+        star.position.z += star.velocity;
+        
+        // Reset position if star moves too close
+        if (star.position.z > 100) {
+            star.position.z = -300;
+        }
+    });
+    
+    // Rotate the entire scene slightly for a dreamy effect
+    scene.rotation.y += 0.0003;
+    scene.rotation.x += 0.0001;
+    
+    renderer.render(scene, camera);
+}
+
+function onWindowResize() {
+    camera.aspect = window.innerWidth / window.innerHeight;
+    camera.updateProjectionMatrix();
+    renderer.setSize(window.innerWidth, window.innerHeight);
+}
+
+// Initialize background when the DOM is loaded
+if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', initBackground);
+} else {
+    initBackground();
+}