A modern, interactive 3D black hole simulation built with React, Three.js, and Material-UI. This comprehensive educational platform combines cutting-edge web technologies with accurate physics simulations to create an impressive learning experience.
# Install dependencies
npm install
# Start development server
npm run dev
# Open http://localhost:3000 in your browser- Real-time black hole visualization using Three.js and React Three Fiber
- Custom physics engine with gravitational calculations
- Particle system showing matter accretion and orbital mechanics
- Orbital camera controls for exploration
- Real-time performance monitoring with FPS display
- Comprehensive black hole guide with scientific explanations
- Mathematical foundations with interactive calculators
- Historical context and key scientists
- Professional glossary of scientific terms
- Step-by-step physics derivations
- Schwarzschild radius calculator for any black hole mass
- Gravitational lensing calculator with real physics equations
- Real-time mathematical computations using actual formulas
- Educational explanations for each calculation
- React 18 - Modern React with hooks and functional components
- Three.js - Industry-standard 3D graphics library
- React Three Fiber - React renderer for Three.js
- Material-UI - Professional component library
- Vite - Fast build tool and development server
src/
├── components/
│ ├── Layout.jsx # Main layout with navigation
│ ├── Footer.jsx # Footer component
│ └── BlackHoleScene.jsx # 3D simulation component
├── pages/
│ ├── SimulationPage.jsx # Main 3D simulation page
│ ├── AboutPage.jsx # Educational content page
│ └── PhysicsPage.jsx # Mathematical foundations page
├── App.jsx # Main app component with routing
└── main.jsx # Application entry point
- Real-time physics calculations for gravitational effects
- Interactive calculators for real physics computations
- Professional UI/UX with Material-UI components
- Responsive design that works on all devices
- Scientific accuracy based on general relativity
npm run dev- Start development servernpm run build- Build for productionnpm run preview- Preview production build
This application demonstrates:
- Advanced Web Development - Modern React with hooks and routing
- 3D Graphics Programming - Three.js with custom physics
- Scientific Computing - Real physics equations and calculations
- Educational Design - Interactive learning platform
- Professional UI/UX - Material-UI with responsive design
The simulation is based on:
- Schwarzschild geodesics from general relativity
- Gravitational lensing using Einstein's deflection formula
- Accretion disk physics with temperature gradients
- Event horizon calculations using Schwarzschild radius
- Real physics equations with step-by-step derivations
Built with ❤️ using React, Three.js, and Material-UI