• 

  Home page

• 

  Future plans page

• 

  Beginning of app (first input)

• 

  Example of an incorrect answer/ What the modal looks like on question submission

• 

  Buffer between ever 5 questions to generate more & offer to change interest

• 

  Example: Interest was One Piece and the topic was English Comprehension

• 

  Example: Interest was The Simpsons and the topic was reading

• 

  Example: Interest was The Simpsons and the topic was reading

• 

  The initial planning phase of Eduquest (details visible if you zoom in on the image)

• 

  Example: History study strategies with The Simpsons as the interest

About Eduquest

Inspiration

What inspired us was mostly how in todays day and age it's eminent that most students have a significantly lowered attention span and its clear in the field of education. This paired with the outdated nature of the brick and mortar education, trying to teach a "one size fits all" style, has demonstrated to us that there needs to be a new way to go about education which makes learning fun for every student according to their individual interests and likes.

What we learned

During this project we learned a lot including how beneficial conditional rendering of elements can be when it comes to writing frontend code using something like Nuxt (Vue). Also it was a fun experience designing and organizing an API with ExpressJS and testing it with Insomnia. Overall we gained a lot of experience making a fullstack app and self hosting it all the while being remote from each other and our server.

How it's built

We had so much fun integrating so many technologies into this project ranging from dockerfiles to typescript config files!

Backend

On the backend we have a REST API using ExpressJS to serve its functions (normally Zach prefers ElysiaJS which is bun based but didn't want to risk reliability). This API utilizes Googles Gemini Pro LLM to generate questions which has a great API easily accessible programmatically. Once our very fine tuned prompts are filtered through the API's request body parameters to saturate a ready-made prompt, it's sent to Google and its response is sent directly back to the frontend in JSON format (there're also measures in place to catch errors and present them in the frontend console).

Frontend

Our frontend is curated in NuxtJS which is a truly impeccable tool for making full stack web apps! Beyond the simple welcome pages and (slightly rushed) future plans page, the app portion of Eduquest takes input from the user with a carefully crafted process (including animations) to get each parameter needed and send it off to our backend (This includes the users interest, what topic they want to practice, and their grade level). Once the input is sent off to our backend, there's a slight buffer that lasts around 15 seconds on average before the users curated practice content is served in an easy to read and aesthetically pleasing format. Once the user burns through all of the generated content, our app will continuously generate more content for the user as much as they want until they decide to stop or change their interest which is a readily available option during their session.

Server Side

Both the API and Website are self hosted by US behind automatic SSL certificate renewal so your content is always encrypted, A proxied tunnel through cloudflare in order to filter out spammers, bots, or possible DDoS attacks, and an extra reverse proxy layer so no unnecessary network ports need to be opened for our app to reach the world! Both the API and Website are also run via a docker container with 24/7 surveillance to notify our system admins (Zach) when there's an issue.

Challenges

A big challenge during this project was surprisingly the frontend. As most of it had to be rushed due to the upcoming time limit, parsing the API JSON with many different possibilities as to how it had to be read was quite the challenge. This on top of some network issues we ran into including our image scraping feature going caput when released to production on our servers posed quite the road bump. Besides that, a big challenge was really the race for time in the end which thankfully was won. Also the learning curve for certain implemented technologies was pretty fun to overcome!

Eduquest Description

What is Eduquest?

Eduquest is an online learning platform that empowers students to learn according to their passions and preferences. It offers fun and engaging practice in various subjects for students in grades K-5, including Math, Reading, English Comprehension, Science, and History.

How can I use Eduquest?

To use Eduquest, simply visit the website at https://eduquest.me. You can immediately start practicing any of the subjects offered by Eduquest with automatically generated questions based on your interests (Simply hit "Get Started").

NOTE: Since Zach is hosting the website and API on his enterprise server at home, the headless image scraping feature isn't yet available on the frontend but does work if the API is hosted locally. Examples of what it may look like with scraped images are below.

What are the benefits of using Eduquest?

Eduquest offers a number of benefits for students, including: * Personalized learning: Eduquest tailors its content to each student's individual needs and interests. * Fun and engaging practice: Eduquest makes learning fun and engaging with its interactive exercises and games. * Improved academic strategies: Via our history section, we curate studying strategies which are beneficial for memorization including many other tips to success

Built With

• ai
• express.js
• geminipro
• nuxt
• puppeteer
• shadcn
• tailwindcss
• typescript