AI Flashcards

Need Flashcards? Fast & Easy Flashcard Generation. Just think of a topic you want and we'll give you a quick "flash-course" on it.

Comment

Inspiration

Flashcards always comes in handy, which is why simplifying the creation of them was one of our goals. We wanted to build something quick and easy, but capable of generating anything on the fly. There are already lots of flashcard websites out there, Quizlet being our biggest inspiration.

What it does

Either drop a file and let the flashcard generate itself, or write a couple of words down describing a topic you're interested in. The rest of the process is automated, so there's less work for you.

How we built it

With React.js as our frontend, we took lots of inspiration from Quizlet. Of course, we used Gemini API to be able to automatically classify texts into terms and definitions, that way our flashcards were limitless.

Challenges we ran into

There was a lot of trouble connecting the backend and the frontend of our project. We worked on each of parts independently, but once we began trying to connect them, the app would not function the way we want. After a user input, there would be a long loading screen because the input was not able to reach the backend. We took a lot of time debugging and fixing the logic to connect them together. Also, we ran into a lot of merging conflicts near the end of the project because we were all making changes within the same files.

Accomplishments that we're proud of

We are proud of being able to create a functional application from scratch. Merging the frontend and backend was hard. Despite those issues, however, we were eventually able to connect them, giving users the ability to input some data before flashcards are generated for them. We also implemented a way for the user to move between different pages using the React Router, giving a way for the user to navigate between the flash card page, home page, and the quiz page without having to reload the website. Despite the limited time we had, we were able to work effectively while dealing with merging conflicts to create a app that was inspired by Quizlet.

What we learned

We learned how important it is to connect the frontend and backend early. Initially, we were a bit ambitious trying to create many features without ever connecting the backend. Because of that, we had to spend a lot of time debugging. We could have kept it simple and created a simple layout where we would then merge the backend and frontend before trying to add more features to our application. Besides that, we learned a lot of React, since our application was done in React, as well as learning how to work with APIs

What's next for AI Flashcards

While we were not able to implement all the features we wanted within the time we had, we planned on allowing the user to save their flashcards so that they can revisit them whenever they want. The quiz was simple so we plan on adding different levels of difficulty as well as a way track performance to help the user learn.

Share this project:

Updates