I am currently learning Three.js with the help of three.js-journey. I use this repo to practice the theory that I've learned. My goal is to update this project every time I have learned something new ( if it can be applied to this demo). For the moment I am using plain three.js with TypeScript. In a later stage, I'll refactor the application to React Three Fiber.
This is a very rudimentary roadmap of what I try to accomplish and might change over time.
- Create a scene
- Create planets
- Make the planets orbit the sun
- Make the sun glow
- Add light to and shadow (sun should lighten up surrounding planets)
- Use a better scale for orbit speed and planet sizes
- Add missing planets
- Draw the orbit of planets with lines on the scene
- Add modals that display extra information about a planet (R3F)
- Adjust zooming so that it's blocked from a certain level of zoom in/out
- Add loading screen
Run your local development server.
npm install
npm run devTest your application.
npm run testBuild your application.
npm run build