The problem Codie: Code Genie solves

Problems faced while preparing for interviews
Lack of guidance: While there are plenty of websites that help with interview preparation, there is no real-time clearing of doubts. Most websites just have predefined hints and complete solutions. Both of these don't mimic the real interview experience
Time Constraints: Many software developers have busy schedules and may not have the time to dedicate to interview preparation. According to a survey conducted by HackerRank in 2018, 50% of developers say that time is the biggest barrier to interview preparation.
Interview anxiety: According to a survey conducted by Hired in 2019, 92% of software engineers experience anxiety during job interviews. This can lead to poor performance, despite having the necessary skills and experience
Problems with existing solutions
AI Chatbots like chatGPT can greatly help with interview preparation. However, the issues associated with them are

Generic: Answers given are generic and not always specific to the use case
Lack of Context: The interview preparation context has to be mentioned each time the user wants to use it
Copy-pasting: copying and pasting every single problem from websites like Leetcode is not very efficient given the time constraint during interview prep
Distracting: Taking the users away from the problem page can be distraction during preparation

Challenges I ran into

Challenge #1
Extracting the question data from the raw HTML page of each platform was a significant challenge since each question div had children elements which also needed to be extracted for reading the text present inside.

Solution
Getting the element and it's classname was fairly straightforward using devtools. Once that was done, with help from ChatGPT, I created a function that recursively extracts each element until it finds the text present inside, and append it to a string.

Challenge #2
Preserving each message after the extension was closed. Also needing to preserve chats based on the question from each platform.

Solution
Solving the former was quite simple by using localstorage. However, the way it is used on chrome extension is slightly different from the usual syntax. For solving the latter, I extracted the platform and question title from the url, and added them to the messages key, thereby creating unique localstorage objects for each question

Challenge #3
Creating prompts that yielded the most desirable responses. In most cases, a direct prompt like "give me a hint", won't give the response you'd expect. The model often gives the full solution when asked for a hint. So designing the prompts was a challenge

Solution
I researched a bit about prompts, and found some public github repos with sample prompts. I also created placeholder texts for these pre-defined prompts so that the user experience is not ruined due to the large text from the prompts.