🤖 A simple, aesthetic web app that helps you find fun activities when you’re bored. Powered by the Bored API.
Bored Bot is a mini web app that suggests random activities for users who need a spark of inspiration. Whether you’re feeling lazy, creative, or restless — just click the button and get a new idea instantly!
This project was built to practice Fetch API, DOM manipulation, and clean UI design with a minimal aesthetic touch. It’s perfect for beginners learning JavaScript interactivity.
✨ Key things the app can do:
- 🎯 Fetches random activities from the Bored API
- 💡 Displays fun ideas instantly on button click
- 🌈 Smooth and clean UI with pastel tones
- 🧠 Accessible and responsive design
| Technology | Purpose |
|---|---|
| HTML5 | Structure of the app |
| CSS3 | Styling and responsiveness |
| JavaScript (ES6) | Logic and interactivity |
| Bored API | Fetching random activity suggestions |
Here are the key JavaScript and web concepts covered while building this project 🧩
- 🖥️ Servers & Clients — understanding how browsers communicate with servers
- 🔁 Request/Response Cycle — how data flows between client and API
- 🌐 APIs — connecting frontend with external data sources
- 📦 JSON — working with structured data
- ⚙️
fetchSyntax — sending requests and handling responses
Additional concepts practiced include:
fetch(),.then(),querySelector,addEventListener,classList,style.display, and accessibility witharia-live.
- Improved understanding of asynchronous JavaScript using
fetch()- Practiced DOM updates based on API responses
- Learned to apply minimal aesthetic design using CSS shadows and color palettes
- Gained experience in making apps that are small, simple, and user-friendly
🔗 Live Demo: https://your-demo-link.vercel.app
👩💻 Created by Aliya Syed
“Build. Break. Learn. Repeat.” 🌸
index.html
<h1>🤖 bored? 🤖</h1>
<p aria-live="polite">Find something to do</p>
<button id="get-activity" aria-label="Find a new activity