Workshop Agenda: from 17th to 19th February 2025

Day 1 (17th Feb): Crafting the Chatbot UI (HTML & CSS Focus)

📌 Theory:

- Web Development Basics: How Websites Work

- HTML Essentials: Semantic Structure, Forms & Accessibility

- CSS for Modern UI Design: Box Model, Flexbox, Grid & Animations

- Introduction to CSS Frameworks: Tailwind CSS & Bootstrap

- UX/UI Considerations for Chatbots

🛠 Hands-On:

- Design & structure a chatbot UI using HTML & CSS

- Style the chat window, input field, and message bubbles

Day 2 (18th Feb): Adding Interactivity with JavaScript & APIs

📌 Theory:

- JavaScript Essentials: Variables, Functions, and DOM Manipulation

- Handling User Interactions: Click Events, Keypresses & Forms

- Working with APIs: How the Frontend Connects to the Backend

- Introduction to LLaMA 3.3 on Groq Cloud

🛠 Hands-On:

- Add JavaScript-based interactions (sending messages, updating UI dynamically)

- Connect the chatbot UI to a mock API before integrating with Groq Cloud

Day 3 (19th Feb): AI-Powered Chatbot Integration & Deployment

📌 Theory:

- Connecting to Groq Cloud’s API to Fetch AI Responses

- Handling API Responses: Asynchronous JavaScript 

- Debugging API-Related Frontend Issues

- Deploying the Chatbot using Vercel

🛠 Hands-On:

- Integrate LLaMA 3.3 API into the chatbot

- Deploy the fully functional AI chatbot on Vercel

- Project Showcase: Demo your chatbot & receive feedback