Candidate banner

Candidate

About the Project

FrontendBackendLLM

Disclaimer: This project links to a staging site that is not in production. Profiles may therefore be outdated, and some features may be disabled.

Candidate is a project developed as part of the 2nd semester in Web Development. We were tasked with rewriting the existing candidate portal candidate.dk using React Router 7 and TypeScript. The project was a collaboration between me and my classmates.

The site is a candidate portal that connects students with companies looking for candidates for internships and jobs. As an exam project, my exam group and I developed an AI chatbot designed to help companies find the right candidates for their positions.

We used Mistral's API as the LLM to generate responses in the chat window. Since we're using MongoDB as the database, we implemented vector-based search to find relevant profiles – using Mistral’s embedding model to generate embeddings of the profiles.

Test User:

Email: twolmar@gmail.com

Password: hello

Techstack

icon-React
icon-React Router
icon-MongoDB
icon-Motion
icon-Tailwind CSS
icon-TypeScript
icon-Mistral

Snapshots

  • snapshot
  • snapshot

Technologies

We used React to create an interactive and dynamic user interface for our exam project. Using React made it easy to build a structured codebase.

We used React Router v7 as our React framework to develop the website. With React Router’s 'loader' and 'action' functions, we were able to fetch data and handle requests.

We used MongoDB as our database and Mongoose to handle the data in React. This allowed us to store and retrieve data efficiently.

Motion allowed us to add smooth animations and interactions that enhance the user experience. In this project, we used it to animate the chat window.

We used Tailwind CSS to style our chat window. Since the rest of the site also uses Tailwind, it was easy to maintain a consistent style.

TypeScript helped us write more robust and maintainable code. By adding type checking to JavaScript, we reduced errors and improved the development process.

Mistral is an AI API that provides access to various AI models. We used Mistral to generate chat responses and create embeddings of user profiles.