The latest articles on DEV Community by Banshraj Prajapati (@banshraj1). https://dev.to/banshraj1 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4161390%2F791a3aa9-9508-43e1-a01c-2bb7731bd9c1.png https://dev.to/banshraj1 en Banshraj Prajapati Sun, 04 Oct 2026 18:29:57 +0000 https://dev.to/banshraj1/i-built-an-ai-study-assistant-for-my-friend-using-gemma-react-and-render-4l6l https://dev.to/banshraj1/i-built-an-ai-study-assistant-for-my-friend-using-gemma-react-and-render-4l6l <h1> I Built an AI Notes Simplifier for My Friend Using Gemma, React and Render </h1> <p><em>This is a submission for the Hacktoberfest Weekend Challenge: Build for a Friend 🤝</em></p> <h2> What I Built </h2> <p>A friend of mine often struggles with exam preparation because lecture notes can be long and difficult to revise quickly. Reading pages of notes before an exam takes time, and finding the most important concepts is not always easy.</p> <p>To solve this problem, I built <strong>Noteform</strong>, an AI-powered study companion that helps students turn lengthy notes into useful study material within seconds.</p> <p>The application can:</p> <ul> <li>Generate concise summaries from long notes</li> <li>Create important exam-focused questions</li> <li>Generate viva questions for oral exam preparation</li> <li>Help students revise faster and more effectively</li> </ul> <p>The goal was to make studying less overwhelming and more productive.</p> <h2> Demo </h2> <h3> Live Application </h3> <p><a href="https://ai-notes-simplifier.vercel.app/" rel="noopener noreferrer">https://ai-notes-simplifier.vercel.app/</a></p> <h3> Backend API </h3> <p><a href="https://ai-notes-simplifier.onrender.com/" rel="noopener noreferrer">https://ai-notes-simplifier.onrender.com/</a></p> <h3> GitHub Repository </h3> <p><a href="https://github.com/Banshraj1/ai-notes-simplifier" rel="noopener noreferrer">https://github.com/Banshraj1/ai-notes-simplifier</a></p> <h2> Screenshots </h2> <h3> Home Page </h3> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fuwfk29whoai1io3d9qgx.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fuwfk29whoai1io3d9qgx.png" alt="Home Page" width="799" height="450"></a></p> <h3> AI Summarization </h3> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fcwu4ia0x11x1l39j49tx.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fcwu4ia0x11x1l39j49tx.png" alt="AI Summarization" width="800" height="450"></a></p> <h3> Important Question Generation </h3> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F5nwwbwsmtxyvfes2lj11.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F5nwwbwsmtxyvfes2lj11.png" alt="Important Questions" width="800" height="450"></a></p> <h3> Viva Question Generation </h3> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F3jyttoil9veqcyngjbjb.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F3jyttoil9veqcyngjbjb.png" alt="Viva QuestionsImage description" width="800" height="450"></a></p> <h2> How I Built It </h2> <h3> Frontend </h3> <ul> <li>React</li> <li>Vite</li> <li>Tailwind CSS</li> <li>Axios</li> </ul> <h3> Backend </h3> <ul> <li>Node.js</li> <li>Express.js</li> </ul> <h3> AI Stack </h3> <ul> <li>Google Gemma</li> <li>Hugging Face Inference API</li> </ul> <h3> Deployment </h3> <ul> <li>Vercel (Frontend)</li> <li>Render (Backend)</li> </ul> <h2> Features </h2> <h3> Smart Summaries </h3> <p>Transforms lengthy notes into concise, revision-ready summaries.</p> <h3> Important Questions </h3> <p>Generates exam-focused questions from notes to help students prioritize their revision.</p> <h3> Viva Preparation </h3> <p>Creates viva-style questions that help students practice before oral examinations.</p> <h3> Clean Interface </h3> <p>A simple and distraction-free interface designed around the study workflow.</p> <h2> Why Does Open Innovation Matter? </h2> <p>This project is powered by <strong>Gemma</strong>, an open AI model, through Hugging Face.</p> <p>Using an open model gave me more flexibility in how AI is integrated into the application and avoids tying the project entirely to a single proprietary AI provider.</p> <p>The open approach also makes it easier to experiment with different models and gives the project a path toward self-hosted inference in the future.</p> <p>For a student-built project, this is especially useful because it lowers the barrier to experimenting with modern AI while keeping the architecture flexible.</p> <h2> Feedback </h2> <p>I shared the application with my friend, who found the <strong>Important Questions</strong> feature especially useful for quickly identifying what to revise before exams.</p> <h2> Prize Categories </h2> <ul> <li>Build for a Friend</li> <li>Best Use of Open Source AI</li> <li>Best Use of Render</li> </ul> ai hacktoberfest react showdev Banshraj Prajapati Sun, 04 Oct 2026 18:26:15 +0000 https://dev.to/banshraj1/i-built-an-ai-study-assistant-for-my-friend-using-gemma-react-and-render-59pa https://dev.to/banshraj1/i-built-an-ai-study-assistant-for-my-friend-using-gemma-react-and-render-59pa <h1> I Built an AI Notes Simplifier for My Friend Using Gemma, React and Render </h1> <p><em>This is a submission for the Hacktoberfest Weekend Challenge: Build for a Friend 🤝</em></p> <h2> What I Built </h2> <p>A friend of mine often struggles with exam preparation because lecture notes can be long and difficult to revise quickly. Reading pages of notes before an exam takes time, and finding the most important concepts is not always easy.</p> <p>To solve this problem, I built <strong>Noteform</strong>, an AI-powered study companion that helps students turn lengthy notes into useful study material within seconds.</p> <p>The application can:</p> <ul> <li>Generate concise summaries from long notes</li> <li>Create important exam-focused questions</li> <li>Generate viva questions for oral exam preparation</li> <li>Help students revise faster and more effectively</li> </ul> <p>The goal was to make studying less overwhelming and more productive.</p> <h2> Demo </h2> <h3> Live Application </h3> <p><a href="https://ai-notes-simplifier.vercel.app/" rel="noopener noreferrer">https://ai-notes-simplifier.vercel.app/</a></p> <h3> Backend API </h3> <p><a href="https://ai-notes-simplifier.onrender.com/" rel="noopener noreferrer">https://ai-notes-simplifier.onrender.com/</a></p> <h3> GitHub Repository </h3> <p><a href="https://github.com/Banshraj1/ai-notes-simplifier" rel="noopener noreferrer">https://github.com/Banshraj1/ai-notes-simplifier</a></p> <h2> Screenshots </h2> <h3> Home Page </h3> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fuwfk29whoai1io3d9qgx.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fuwfk29whoai1io3d9qgx.png" alt="Home Page" width="799" height="450"></a></p> <h3> AI Summarization </h3> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fcwu4ia0x11x1l39j49tx.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fcwu4ia0x11x1l39j49tx.png" alt="AI Summarization" width="800" height="450"></a></p> <h3> Important Question Generation </h3> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F5nwwbwsmtxyvfes2lj11.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F5nwwbwsmtxyvfes2lj11.png" alt="Important Questions" width="800" height="450"></a></p> <h3> Viva Question Generation </h3> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F3jyttoil9veqcyngjbjb.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F3jyttoil9veqcyngjbjb.png" alt="Viva QuestionsImage description" width="800" height="450"></a></p> <h2> How I Built It </h2> <h3> Frontend </h3> <ul> <li>React</li> <li>Vite</li> <li>Tailwind CSS</li> <li>Axios</li> </ul> <h3> Backend </h3> <ul> <li>Node.js</li> <li>Express.js</li> </ul> <h3> AI Stack </h3> <ul> <li>Google Gemma</li> <li>Hugging Face Inference API</li> </ul> <h3> Deployment </h3> <ul> <li>Vercel (Frontend)</li> <li>Render (Backend)</li> </ul> <h2> Features </h2> <h3> Smart Summaries </h3> <p>Transforms lengthy notes into concise, revision-ready summaries.</p> <h3> Important Questions </h3> <p>Generates exam-focused questions from notes to help students prioritize their revision.</p> <h3> Viva Preparation </h3> <p>Creates viva-style questions that help students practice before oral examinations.</p> <h3> Clean Interface </h3> <p>A simple and distraction-free interface designed around the study workflow.</p> <h2> Why Does Open Innovation Matter? </h2> <p>This project is powered by <strong>Gemma</strong>, an open AI model, through Hugging Face.</p> <p>Using an open model gave me more flexibility in how AI is integrated into the application and avoids tying the project entirely to a single proprietary AI provider.</p> <p>The open approach also makes it easier to experiment with different models and gives the project a path toward self-hosted inference in the future.</p> <p>For a student-built project, this is especially useful because it lowers the barrier to experimenting with modern AI while keeping the architecture flexible.</p> <h2> Feedback </h2> <p>I shared the application with my friend, who found the <strong>Important Questions</strong> feature especially useful for quickly identifying what to revise before exams.</p> <h2> Prize Categories </h2> <ul> <li>Build for a Friend</li> <li>Best Use of Open Source AI</li> <li>Best Use of Render</li> </ul> ai productivity react showdev Banshraj Prajapati Sun, 04 Oct 2026 18:08:49 +0000 https://dev.to/banshraj1/i-built-an-ai-notes-simplifier-for-my-friend-using-gemma-react-and-render-182d https://dev.to/banshraj1/i-built-an-ai-notes-simplifier-for-my-friend-using-gemma-react-and-render-182d <p><em>This is a submission for the Hacktoberfest Weekend Challenge: Build for a Friend</em></p> <h1> What I Built </h1> <p>A friend of mine often struggles with exam preparation because lecture notes can be long and difficult to revise quickly. Reading pages of notes before an exam takes time, and finding the most important concepts is not always easy.</p> <p>To help with this problem, I built <strong>Noteform</strong>, an AI-powered study companion that can:</p> <ul> <li>Generate concise summaries from long notes</li> <li>Create important exam-focused questions</li> <li>Generate viva questions for oral exam preparation</li> </ul> <p>The goal was to make revision faster and more effective.</p> <h1> Demo </h1> <p><strong>Live Demo:</strong> <a href="https://ai-notes-simplifier.vercel.app/" rel="noopener noreferrer">https://ai-notes-simplifier.vercel.app/</a></p> <h2> Home Page </h2> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fjqcgfygrct6ysei9c3hg.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fjqcgfygrct6ysei9c3hg.png" alt=" " width="799" height="450"></a></p> <h2> AI Summarization </h2> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F22le82lklr6jstuge3wv.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F22le82lklr6jstuge3wv.png" alt=" " width="800" height="450"></a></p> <h2> Important Question Generation </h2> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fjt0yqe70cfckgwmxfgkm.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fjt0yqe70cfckgwmxfgkm.png" alt=" " width="800" height="450"></a></p> <h2> Viva Question Generation </h2> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F504ukc14843qqpqr4z9b.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F504ukc14843qqpqr4z9b.png" alt=" " width="800" height="450"></a></p> <h2> Code </h2> <p><strong>GitHub Repository:</strong> <a href="https://github.com/Banshraj1/ai-notes-simplifier" rel="noopener noreferrer">https://github.com/Banshraj1/ai-notes-simplifier</a></p> <h2> How I Built It </h2> <h3> Frontend </h3> <ul> <li>React</li> <li>Vite</li> <li>Tailwind CSS</li> <li>Axios</li> </ul> <h3> Backend </h3> <ul> <li>Node.js</li> <li>Express.js</li> </ul> <h3> AI Stack </h3> <ul> <li>Google Gemma</li> <li>Hugging Face Inference API</li> </ul> <h3> Deployment </h3> <ul> <li>Render (Backend): <a href="https://ai-notes-simplifier.onrender.com/" rel="noopener noreferrer">https://ai-notes-simplifier.onrender.com/</a> </li> <li>Vercel (Frontend): <a href="https://ai-notes-simplifier.vercel.app/" rel="noopener noreferrer">https://ai-notes-simplifier.vercel.app/</a> </li> </ul> <h2> Features </h2> <h3> Smart Summaries </h3> <p>Transforms lengthy notes into concise, revision-ready summaries.</p> <h3> Important Questions </h3> <p>Generates exam-focused questions from the provided notes to help students prioritize their revision.</p> <h3> Viva Preparation </h3> <p>Creates viva-style questions and answers for quick oral exam practice.</p> <h3> Clean Interface </h3> <p>A simple and distraction-free interface designed around the study workflow.</p> <h2> Why Does Open Innovation Matter? </h2> <p>This project is powered by <strong>Gemma</strong>, an open AI model, through Hugging Face.</p> <p>Using an open model gave me more flexibility in how AI is integrated into the application and avoids tying the project entirely to a single proprietary AI provider.</p> <p>The open approach also makes it easier to experiment with different models and gives the project a path toward self-hosted inference in the future.</p> <p>For a student-built project, this is especially useful because it lowers the barrier to experimenting with modern AI while keeping the architecture flexible.</p> <h2> Feedback </h2> <p>I shared the application with my friend, who found the <strong>Important Questions</strong> feature especially useful for quickly identifying what to revise before exams.</p> <h2> Live Demo </h2> <p>Try it here:</p> <p><a href="https://ai-notes-simplifier.vercel.app/" rel="noopener noreferrer">https://ai-notes-simplifier.vercel.app/</a></p> <h2> Prize Categories </h2> <ul> <li>Build for a Friend</li> <li>Best Use of Open Source AI</li> <li>Best Use of Render</li> </ul> devchallenge weekendchallenge hf26challenge react