Back to Projects
Web App

Tell me a joke!!!

It's an example Joke Teller Robot that fetches and speaks jokes via API. It is developed using HTML, CSS, JavaScript

HTMLCSSJavaScript

Project Overview

A fun interactive web app featuring a robot that fetches random jokes from an API and reads them aloud using the Web Speech API. The project demonstrates API integration, browser speech synthesis, and playful UI design. Click the button and the robot character fetches a fresh joke and speaks it with text-to-speech.

Key Features

  • Random joke fetching from JokeAPI
  • Text-to-speech using Web Speech API
  • Animated robot character
  • Button interaction with loading state
  • Speech queue management
  • Fun, playful UI design

Technical Highlights

The Fetch API retrieves jokes from a public REST API with error handling. The Web Speech API SpeechSynthesis interface converts joke text to spoken audio. JavaScript async/await manages the fetch-then-speak flow. The robot animation uses CSS keyframes.