Inspiration
When contemplating this year's TigerHacks space theme, we thought it would be helpful to people interested in satellites to know where they are in space and what they can see from where they are at. This idea grew into deciding to use Three.js (a powerful javascript based 3d modeling library) to create a 3d model of the globe and satellites. This website would mainly focus on this visualization of the globe, satellites, and where they are in relation to what is in space. Furthering this project, we thought it would be interesting for users to be able to enter their phone number and location and get text alerts when a satellite was flying over them.
What it does
LiteView is a website that visualizes where satellites are around the earth. When first opened, you are asked to log in using Auth0 which then allows you access to the visualizer.
How we built it
We started this project by deciding on a React.js frontend and a Python backend. Ashton worked on the Three.js modeling to create the globe and place satellites around the 3d model. Carter worked on Auth0 and creating the website and deploying this project to our custom domain. Supreet worked on the backend, using the Space Track API to get data into our MySQL server hosted on Vultr which would then be fed into the front end to position the satellites around the Three.js model.
Challenges we ran into
Our first challenge was learning Three.js. None of us have experience in 3d modeling and therefore there was a learning curve for figuring out where to place objects, the camera, lighting, etc. to create an easy-to-use model for the user. We also struggled with configuring the database on the Vultr and had to learn how to connect it to our frontend. Our final big challenge was deploying the website. We had to learn how to use Netlify to build and deploy the website and send it to our custom domain.
Accomplishments that we're proud of
We are proud of figuring out how to create a dynamic model using Three.js and integrating it into a professional website. We are also proud of creating a final product that works at link.
What we learned
The main thing we learned was how to work together. When we first started working on the project, we realized we kept accidentally stepping on each other toes and working on the same part of the project. We had to stop and organize our ideas and plan who was working on what and how we could collaborate. But using the blackboard we had in our room to plan and spreadsheets to keep track of tasks, we were able to work together much more effectively. We also learned how to use new frameworks such as Three.js and Vultr. These were our two biggest roadblocks in understanding what to do but by looking through the documentation and using trial and error, we were able to learn how to use them and integrate them into our website to create a good experience for the user. Finally, we learned how to take a project from VS Code and deploy it to a website.
What's next for LiteView
We would like to build out LiteView to deliver more features to users to help them interact with satellites. Future updates could include using the location given by the user to show them on the globe relative to satellites. Also using the user's location, we could send them a text message via Twilio when an orbital object is above them. We believe this would help space enthusiasts be able to get involved more with seeing satellites in space.
Log in or sign up for Devpost to join the conversation.