Target Audience:

This course is designed for:

• Junior Developers interested in conversational AI and full-stack development.

• Technical Trainers and educators seeking to incorporate AI chatbots into their teaching tools.

• Product Managers and UX Designers exploring AI-driven customer service solutions.

• AWS Practitioners aiming to enhance their practical skills in Lex and cloud-based app integration.

• Students or Graduates in Computer Science, Software Engineering, or IT with a passion for AI interfaces.
  
  

Ideal participants should have basic knowledge of:

• JavaScript and React

• AWS fundamentals (e.g., IAM, Lambda)

• Web development workflows (Node.js, npm, VS Code)

Outcomes:

• Understand Agentic AI principles and the role of conversational agents in modern applications.

• Design and build chatbots using Amazon Lex, including intents, utterances, slots, and Lambda integration.

• Implement multi-turn conversations with session attributes and contextual responses.

• Develop a user-facing React interface for chatbot interaction, using modern front-end techniques.

• Integrate Amazon Lex with React using the AWS SDK and Lex Runtime APIs.

• Apply Tailwind CSS for styling the chatbot UI with responsive design elements.

• Manage state and error handling within the chatbot interface to ensure a seamless user experience.

• Deploy full-stack chatbot apps using AWS Amplify or S3, enabling real-world usage and scalability.

• Troubleshoot integration issues and apply best practices in conversational UI design.

Prerequisites

• JavaScript and web dev basics

• AWS free-tier account

• Node.js, npm, and IDE (e.g., VS Code)

DAY 1: Building Conversational Agents with Amazon Lex

Module 1: Introduction to Agentic AI and Amazon Lex 

• Overview of Agentic AI and conversational interfaces

• Introduction to Amazon Lex: Features and use cases

• Setting up an AWS account and Lex environment

• Lab: Configure AWS credentials and explore Lex console

10.30 - 10.45 MORNING BREAK

Module 2: Designing Intents and Slots 

• Understanding intents, utterances, and slots

• Creating a sample chatbot (e.g., Restaurant Booking Bot)

• Defining slot types and prompts

• Lab: Build a basic Lex bot with intents and slots

1.00PM - 2.00PM LUNCH BREAK

Module 3: Dialog Management and Fulfillment 

• Configuring dialog flows and validation

• Using AWS Lambda for fulfillment logic

• Testing bot interactions in the Lex console

• Lab: Create a Lambda function to handle bot responses

3.30PM - 3.45PM AFTERNOON BREAK

Module 4: Advanced Lex Features 

• Adding context and session attributes

• Handling multi-turn conversations

• Best practices for conversational design

• Lab: Enhance the Restaurant Booking Bot with multi-turn dialog

Q&A and Wrap-Up

• Review of Day 1 concepts

• Troubleshooting common Lex issues

DAY 2: Integrating Amazon Lex with React

Module 5: Introduction to React for AI Interfaces 

• React basics: Components, state, and props

• Setting up a React project with Vite or Create React App

• Overview of AWS SDK for JavaScript

• Lab: Create a simple React app with a static UI

10.30 - 10.45 MORNING BREAK

Module 6: Connecting React to Amazon Lex

• Installing and configuring AWS SDK in React

• Using AWS Lex Runtime API to interact with the bot

• Handling user input and displaying bot responses

• Lab: Build a React component to send/receive messages from Lex

1.00PM - 2.00PM LUNCH BREAK

Module 7: Enhancing the React-Lex Integration

• Styling the chat interface with Tailwind CSS

• Managing conversation state in React

• Error handling and user feedback

• Lab: Style the chat UI and add loading/error states

3.30PM - 3.45PM AFTERNOON BREAK

Module 8: Capstone Project and Deployment 

• Building a complete chatbot application (e.g., Restaurant Booking UI)

• Deploying the React app to AWS Amplify or S3

• Testing the end-to-end application

• Lab: Finalize and deploy the chatbot application

Q&A and Course Wrap-Up

• Review of key concepts

• Resources for further learning (AWS Lex docs, React tutorials)

or contact janice@marcnzed.com or call Janice at +6019 470 3904