This is a Next.js project bootstrapped with create-next-app. It is a fully-functioning AI web application that generates courses based on the title and the units you provide it. It uses OpenAI's API using prompt-engineering to utilize user provided data to generate the courses. Any topic can be provided, the ideas are ENDLESS! It has a login feature to login through your Google account (used Google Cloud API) and also generates relevant images using Unsplash API. The relevant YouTube videos are generated through YouTube's API and the Summary section summarizes the video transcript. It uses Prisma, an open-source ORM which generates all the configuartions for the MySQL-compatible serverless database - PlanetScale.
First, run the development server on your terminal - no need to use an IDE. Make sure that you are in the current directory of learning-journey-yt before beginning.
npm run devOpen http://localhost:3000 with your browser to see the result.
The page should be like the one shown below once you sign in:
You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file. This project uses next/font to automatically optimize and load Inter, a custom Google Font.
The Gallery page shows the courses you have generated using Learning Journey. Here are some I generated below! You can generate courses from the simplest to the most complicated topics....
Click on the create course button to create your first course!! Input the titles and units you want. You can input as many units as you want by clicking on "Add Unit". The default value is 3 units.
All the pages can be viewed in both light and dark themes ! My favourite is the dark theme.
Once the course has been generated the page should look like the one shown below.
Each chapter within the course will have a relevant video generated from YouTube along with a short summary summarising the video's transcript.
You can return to the course generated anytime from the course gallery. Have fun creating courses!
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.