Inspiration
As an international student, we often felt lost when I first arrived on campus. Navigating a new environment without a simple and easy tool for finding buildings, study spaces, and food spots was challenging. This inspired us to create NavigateU, a website that helps students quickly find locations on campus.
What it does
It helps users: -Quickly find libraries, study spaces, and student centers. -Explore dining options across campus, including cafeterias, cafes, and food courts. -See the locations to hang out and socialize -Link to an interactive campus map so that they can find the location easily
How we built it
We structured the site using HTML for the content, CSS for styling, and JavaScript to dynamically create cards for each location category. We stored all the location data in a JSON file, which I then fetched using JavaScript to load onto each page automatically. This approach made it easy to update or expand the content without changing the HTML manually.
Challenges we ran into
One of the main challenges was learning how to integrate JSON with JavaScript and dynamically append content to the page. As beginners, we had very little experience combining HTML, CSS, and JavaScript with JSON. It took us multiple trials to get the desired result we wanted.
Accomplishments that we're proud of
We are proud of successfully creating a fully functional, interactive campus navigation website despite starting with very little coding experience. We managed to integrate HTML, CSS, JavaScript, and JSON to display information about study spots, dining halls, and other campus locations. Additionally, we implemented features like cards, images, and links to campus maps, making the website user-friendly and visually appealing. Completing this project gave us confidence in our ability to learn new technologies quickly and solve coding challenges.
What we learned
Through this project, we learned how to combine HTML, CSS, and JavaScript to create an interactive website. We gained experience working with JavaScript and JSON data to populate content on the page, which allowed us to make the website easily updatable. We also learned about DOM manipulation, creating and styling elements with JavaScript, and linking multiple pages together. Beyond coding, we developed problem-solving skills, teamwork, and persistence, especially when figuring out how to make the site responsive and visually organized.
What's next for NavigateU
We plan to make NavigateU more interactive and user-friendly, so it could eventually be used as a tool for new York University students. Future improvements include adding real-time campus maps, search functionality, and mobile-friendly features to help students navigate the campus even more easily.
Log in or sign up for Devpost to join the conversation.