Illini Market

A market by UIUC students, for UIUC students. Find affordable subleases, school supplies, utilities, and more at your one stop spot to get what you need to thrive at the University of Illinois.

Comment

Inspiration

Having met each other for the first time just a few short days ago, we began getting to know each other through our shared heritage as students at the University of Illinois. The conversation steered toward something we’ve all experienced, something that’s almost a joke at this point, the UIUC Snapchat Story. We talked about how so many students post things that they’re buying and selling on that story for others to see, yet none of us have ever had the time or energy to sit down and tap through it. We know for a fact that many, if not all, students have the same view on it. Similar experiences exist across various other platforms, such as the r/UIUC subreddit, on which hundreds of students search for a sublease on their apartments every semester. As a result, hundreds, if not thousands, of students, including ourselves, who do not frequently engage with or use these niche social networks at all, miss out on invaluable opportunities to sublease apartments, buy necessary class supplies, or other materials which are necessary to college life, often at prices lower than usual. Moreover, many, if not all, of these advertised products and apartments quietly go unused, which is ultimately a waste of high-quality, serviceable products. However, what if there was a way to make shopping from and advertising to your fellow Illinis a million times easier? That’s where Illini Market comes in.

What it does

"Illini Market" is a dynamic web application designed to streamline the process of discovering various listings posted by other students that are essential for university life. These could range from subleases, to school supplies, to tickets for events, all within an intuitive and interactive interface. Emphasizing user convenience, the platform offers seamless integration with Google authentication, ensuring secure sign-in procedures for all users. Once the user is logged in, they can view listings created by other users for virtually any product, including things such as clothes or electronics. The website incorporates a powerful search algorithm to find products of relevance to any search our users could devise. Logged in users also have the ability to create their own listings and publish them to the website for anyone to view. If a user finds a listing of interest, they can click on the listing to get more information and easily contact the listing owner via email with the click of a button. By streamlining the process through which students can share and exchange products, Illini Market represents the last puzzle piece in the Illini community.

How we built it

We opted for the React framework for its versatility and efficiency, complemented by the visually stunning Chakra UI to ensure an appealing user interface. Having various pre-styled components simplified the process of creating the UI, allowing us to focus more heavily on the inner workings of Illini Market. For the backbone of our application, we integrated a Flask-based backend paired with a simple yet robust SQLite database. As Flask is a standalone microframework written with Python, it allowed for rapid prototyping and iteration on our API as our development needs evolved throughout the hackathon. The Flask backend became the orchestrator, handling requests from the web-app and seamlessly connecting with the SQLite database to retrieve and store information. Users would be seamlessly and securely logged in to our application through our application’s use of the OAuth 2.0 protocol and interaction with Google’s secure and comprehensive OAuth 2.0 API endpoints through access tokens, which essentially outsource our authentication security to Google. This allows us to read user data that the user consents to giving such as their name and email directly from their Google account, while keeping the user’s credentials private, thereby allowing the end users to trust our application as they don’t need to provide their password to us. A standout feature of our web app was the powerful and intuitive search functionality. We recognized the need for users to easily find relevant listings, and to achieve this, we implemented a cutting-edge search algorithm. Leveraging an implementation of the Levenshtein Distance algorithm, we devised a pipeline that intelligently calculated the semantic similarity between user queries and listings, allowing us to surface only the most relevant results.

Challenges we ran into / Accomplishments that we're proud of / What we learned

One of the earliest challenges we faced in the development of our project was the integration with Google’s authentication link, particularly with CORS issues since we were running our server locally. We overcame this by using specific redirects and requests between our client, server, and Google’s authentication server, which enabled us to get around the tricky CORS rules. We also faced challenges when attempting to implement the algorithm for our search, particularly in manipulating the table data in order to get it in the right format for the similarity processing function input, and then using the output of the function to get back the table items that were most similar to our query.

One thing we are collectively proud of is that each of us picked up a new language or framework during the hackathon and were able to use it to successfully implement key features in our project. For example, we were able to learn and implement fuzzy string matching for our search feature, as well as pick up Chakra UI on the fly to easily create intuitive user interfaces. In addition, we are proud that we were able to work efficiently as a team, use Git effectively, and help each other across all parts of the application as we built it.

Lastly, a breakthrough moment was when we managed to use our Levenshtein distance algorithm to enable robust semantic search. As we iterated upon several algorithms to achieve this goal, they continued to fall short of our expectations. After exhausting several options, we stumbled across this algorithm and it serviced our exact need. Once we had the basic search functionality work, we went the extra mile to integrate it directly into the posts, where a user could easily find related listings in just one click. In the end, this feature allowed for an intelligent touch to how users interact with our platform.

What's next for Illini Market

We plan to change our database to MySQL integrated with a cloud platform such as Microsoft Azure to make our application more scalable. SQLite was portable and easy to test our code with, but is very limited in scalability. We genuinely believe our project can inform and point hundreds of students in the right direction looking for more affordable subleases, academic materials, and other tools to have an optimal experience on campus. Thus, making our product more scalable is our top priority. In addition, we plan to implement a feature to facilitate payments between users on the website, in case clients want to buy someone’s listing on the spot. This optimizes the billing process for some products, such as school supplies, rather than having it unnecessarily drawn out over the course of several emails. We also envision an image vector search feature. With this feature, clients who can envision a particular apartment or piece of equipment they are searching for but are unable to describe it in words can input images into our search fields, and our engine will display the most similar listings based on their images. These features will make our app inclusive of more students and situations, ultimately allowing for a more productive and joyful experience using our product.

Built With

Share this project:

Updates