Martlet Nests

Finding housing as a student can feel impossible. Between co-ops and exchanges, flexibility is desperately needed. The solution? Martlet nests, a student platform to post and sublet apartments!

Comment

Inspiration

As McGill students, we’ve experienced firsthand how challenging the housing situation can be. The rigidity of leases clashes with our dynamic lifestyles, making finding or subletting apartments a frustrating experience. One of our team members, for example, struggled to find a short-term subletter for their apartment while preparing for an exchange semester. With limited resources such as Facebook Marketplace, they faced issues like potential scams and unwanted harassment. Another teammate faced the overwhelming task of finding an apartment with their partner just a month into the semester, only to encounter fake ads and uncooperative landlords. These frustrations highlighted the need for a reliable, student-focused platform to simplify housing searches and subletting, addressing the unique challenges faced by our community.

What it does

Our website is designed to streamline the student housing process by integrating multiple functionalities. Firstly, Martlet Nests prevents unwanted visitors by verifying that the user logging on has a valid McGill email account. This makes it safe and trustworthy for any student at McGill (as well as incoming exchange students!), hence promoting the usage of our website over other platforms. Upon signing in, users are able to see all of the current listings on the database. A search bar is implemented along with pagination, allowing for an efficient UI. If the user wants to list a location, they can start by going to their account details and updating their profile picture/phone number, both of which are safely stored and linked to their account. By clicking on the “Post Listing” button, the user will now be able to provide all the necessary information for their apartment. This rental will then get displayed on the main page once the form is submitted. Once finished, the user can simply log out, making the process smooth and painless.

How we built it

Our team used React with Vite for building the front-end, leveraging its speed and modularity to create dynamic and responsive layouts for browsing and filtering house options, while maintaining a realistic level of front-end development for our uninitiated team. Components were designed to handle multi-page navigation seamlessly, allowing users to switch between all of the different pages effortlessly. Different APIs were also incorporated, such as Google API for the map and Calendly API for scheduling meetings with your desired posters with the ease of a click.

On the backend, we used an efficient and scalable RealTime Database in order to serve our users quickly. For image storage and retrieval, we integrated cloud storage, allowing users to upload, store, and access images seamlessly. To handle user authentication, we implemented an email-only login system, ensuring that only McGill students could access the platform. We enforced server-side email validation, allowing login only with the @mail.mcgill.ca domain. The use session cookies ensure secure access across sessions and maintain a smooth user experience.

Challenges we ran into

The first challenge we ran into was working with strangers on such an expansive project. Due to unforeseen circumstances, Hugo and Jewoo had to find two new teammates the day of the competition, so there were a lot of uncertainties up until the start of the event. Getting organized quickly seemed like an impossible task, but in the end we quickly settled on an idea and got to coding. We are extremely proud of our adaptability even in the face of difficult circumstances. The first challenge that impacted our work was Git. In the beginning, due to some members inexperience, we were all working on the same branch, which led to a lot of overrides and loss of people’s work. While this was a significant estback at first, we quickly moved to working on different branches and merging at intermittent periods, which quickly got us back on track to finish this project. Finally, the frontend programmers struggled with integrating the front and back ends smoothly, which was a huge cause for concern, but our member Minsu quickly got to work and helped figure out the problem.

Accomplishments that we're proud of

Overall, we’re extremely happy with all the features we were able to implement during the given time range. On the front end, we’re extremely happy with the “look” of the website. We made it so that it resembles some of the current UI that our university is known for, but with improved functionality and little touches that make it stand out. Our logo really helps in advancing this front, since it incorporates recognizable McGill elements such as the Martlet, and makes something new out of it. We’re also extremely proud of the potential our product holds in helping future McGill students so that they don’t have to go through the struggles and stress that we went through. Our division of work was also fantastic: not once did we feel like we were stepping on other people’s toes. The more advanced programmers on our team also displayed a great deal of patience, which helped in the long run since the lower level programmers gained confidence and were able to contribute towards the end.

What we learned

As stated before, this was our first time developing UI from scratch. Most of us had no experience working with React, let alone more advanced tools like Tailwind CSS. As such, this CodeJam was a huge learning experience for us in that front. This was accentuated by the fact that we picked a UI heavy project. Still, we are ecstatic to have had the opportunity to work on these skills, since we would otherwise never do so. With school and classes taking up so much time, it’s difficult to sit down and learn these kinds of workflows. Another major thing we learned was how to work with Firebase, which was also greatly beneficial.

What's next for Martlet's Nest

Due to our current branding being so similar to McGill’s UI, we would want to pitch this website idea to the university itself, for a multitude of reasons. The biggest is that this would give McGill another tool to keep its community safe, due to the requirement of McGill credentials to access the database. The efficacy and simplicity of our system would also allow incoming students (and exchange!) to have lower stress levels in relation to accommodation. If not, we would also love to work on developing this project independently, since we truly believe that this could be hugely beneficial to our communities. Half of our team is made up of first years too, so we would love for them to have an easy way to avoid the problems we’ve had to go through. In the farther future, we would also to validate specific landlords, who are reputed, so that their properties are also allowed on the website. Finally, we would also love to make our UI available to any university, since it can easily be tweaked to have different branding since the functionality is so consistent.

Share this project:

Updates