GradConnect

Auth0 authentication page
Basic application authentication on top of JWT security
Generates JWT tokens to authenticate users when they connect to backend (security features)
User not logged in home page
Search Page
Logged In Page (email displayed using MongoDB)

Inspiration

We all had difficulty with the college application process, and wished there was some platform for us to have had guidance during the complicated process.

What it does

GradConnect connects high school students in the college application process with college student mentors at the schools they are interested in. Mentors can help students with general advice, essay help, or application help.

How we built it

GradConnect was built using React.js, MongoDB, Node.js, Auth0, Express, Vite, and Bootstrap.

Challenges we ran into

Frontend Multiple people working on the same files with conflicting views on styling was difficult to navigate, as the look and feel had to be intuitive to everyone.

Backend A challenge we faced was learning to use Auth0 with our application. No one in our team had experience working with Auth0, and we faced many challenges as we developed our program. The first was in authenticating the user on the client side, and securely validating the user in the server. This was necessary to ensure malicious users could not access our MongoDB database. We solved this issue by using Auth0 universal authentication on our client and using the Auth0 API to generate JWT tokens in order to validate the user.

Integration Fetching and Posting information to the database was a huge challenge, as there was a significant amount of boilerplate code and APIs we used, so anyone that didn't directly work behind the scenes had a lot to read up on and understand before being able to make basic requests to the database.

Accomplishments that we're proud of

Built a full stack application in 24 hours with Single sign on functionality, secure authenticated backend with MongoDB while most of us were working with some of the technologies like Auth0 for the first time. We’re also proud of the execution of a professional quality UX design with minimal compromises from our original design in bootstrap, even with one member using bootstrap, js, and git for the first time.

What we learned

We all learned a lot of valuable information regarding all of the software that we used, as well as some of the extra challenges that accompany undertaking a large task in such a short frame.

What's next for GradConnect

We were able to implement saving user data and records into the MongoDB database, but didn’t have enough time to finish displaying all of that data on the site. After finishing all our originally planned features like a fully functioning connections list and search system, we hope to integrate recommender algorithms to make the connection process more seamless.

MLH-Specific Categories

MongoDB Screenshots shown below. User data fetched upon login and all users stored within database. Auth0 We used the Auth0 universal login to authenticate our users on the client side. Then we generated JWT tokens on the backend using Auth0's API to validate users and make sure malicious users could not access our database.