Build LLM-powered Web Apps with Django and Gemini API

Build LLM-powered Web Apps with Django and Gemini API @weskambale
kambale.dev Wesley Kambale

• Machine Learning Engineer • Community Builder • Explore ML
Facilitator with Crowdsource by Google • Consultant at The Innovation Village • Google Dev Library Contributor Profile Interests Experience • Research in TinyML, TTS and LLM

The agenda to agend… • Introduction to LLMs & Gemini
API • Setting up Django • Integrating LLMs with Django using Gemini • Building a Simple LLM-powered Web App • Q&A • Resources & Takeaways

Introduction to LLMs & Gemini API What are LLMs and
what is Gemini API? • Large Language Models (LLMs): Machine learning models designed to understand and generate human-like text. • Gemini API: An API that allows developers to interact with LLMs using natural language instructions.

Django Overview What is Django? High-level Python web framework for
building web apps quickly and efficiently. Robust, scalable, and perfect for rapid prototyping. Ideal for integrating machine learning and AI features.

Overview of Gemini API What is the Gemini API? Gemini
API is an interface for natural language processing. Integrates with LLMs to handle queries, generate text, or perform tasks via natural language prompts. Choose the right Gemini model

Install Django and Gemini

Create a Django Project

Create a Django App

INSTALLED_APPS = [  'django.contrib.admin',  'django.contrib.auth',  'django.contrib.contenttypes',  'django.contrib.sessions',  'django.contrib.messages',  'django.contrib.staticfiles',  'rest_framework', 
'chat_app',  ]    GEMINI_API_KEY = 'your_gemini_api_key'   

Define Models

Migrate the Database

from django.shortcuts import render, reverse  from django.contrib.auth.decorators import login_required  from
.models import ChatBot  from django.http import HttpResponseRedirect, JsonResponse  import google.generativeai as genai    genai.configure(api_key="YourAPI-Key")    @login_required  def ask_question(request):  if request.method == "POST":  text = request.POST.get("text")  model = genai.GenerativeModel("gemini-pro")  chat = model.start_chat()  response = chat.send_message(text)  user = request.user  ChatBot.objects.create(text_input=text, gemini_output=response.text, user=user)  (request, "chat_bot.html", {"chats": chats}) 

# Extract necessary data from response  response_data = {  "text":
response.text, # Assuming response.text contains the relevant response data  }  # Add other relevant data from response if needed  else:  return JsonResponse({"data": response_data})    return HttpResponseRedirect(reverse("chat")) # Redirect to chat page for GET requests    @login_required  def chat(request):  user = request.user  chats = ChatBot.objects.filter(user=user)  return render 

<body>  <form id="promptForm">  <input type="text" name="prompt" placeholder="Enter your prompt">  <button
type="submit">Generate</button>  </form>  <div id="response"></div>    <script>  document.getElementById('promptForm').onsubmit = function(e) {  e.preventDefault();  const prompt = document.querySelector('[name="prompt"]').value;    fetch(`/generate/?prompt=${prompt}`)  .then(response => response.json())  .then(data => {  document.getElementById('response').innerText = data.result;  });  }  </script>  </body>   

Resources… Django: https://www.djangoproject.com/ Gemini: https://deepmind.google/technologies/gemini/ Django Docs: https://docs.djangoproject.com/en/5.1/

Mwebale! Any questions? @weskambale kambale.dev Wesley Kambale

Build LLM-powered Web Apps with Django and Gemi...

Build LLM-powered Web Apps with Django and Gemini API

Wesley Kambale

More Decks by Wesley Kambale

Featured

Transcript