Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/iamdipankarpaul/chunk-norris-jokes-generator
Chuck Norris Jokes Web App - Get your daily dose of Chuck Norris humor! Fetch jokes by category or go random. Powered by the Chuck Norris API with a history of past jokes.
https://github.com/iamdipankarpaul/chunk-norris-jokes-generator
Last synced: 1 day ago
JSON representation
Chuck Norris Jokes Web App - Get your daily dose of Chuck Norris humor! Fetch jokes by category or go random. Powered by the Chuck Norris API with a history of past jokes.
- Host: GitHub
- URL: https://github.com/iamdipankarpaul/chunk-norris-jokes-generator
- Owner: iamdipankarpaul
- Created: 2023-08-24T15:48:03.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2023-09-27T08:51:45.000Z (over 1 year ago)
- Last Synced: 2024-11-11T14:10:55.145Z (2 months ago)
- Language: HTML
- Homepage: https://chunk-jorris-jokes-generator.vercel.app
- Size: 20.5 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Chuck Norris Jokes Web App
This is a simple web application that allows users to get Chuck Norris jokes based on different categories or select a random joke. The app fetches jokes from the Chuck Norris API and displays them on the webpage. Users can also see a list of previously fetched jokes.
## Table of Contents
- [Introduction](#introduction)
- [Screenshots](#screenshots)
- [Features](#features)
- [Technologies Used](#technologies-used)
- [Setup](#setup)
- [Usage](#usage)
- [Contributing](#contributing)
## Introduction
Chuck Norris Jokes Web App is a fun project that demonstrates how to interact with an external API to fetch and display Chuck Norris jokes. The app provides users with the ability to select a joke category or choose a random joke. It also keeps track of the fetched jokes, which are displayed in a list.
## Screenshots
Screenshot showing the dropdown menu.
Screenshot showing the Alert if category is not properly selected.
Screenshot displaying "Click Me!" button and a Chuck Norris joke retrieved from the API.
## Features
- Fetch jokes from the Chuck Norris API based on selected categories or random jokes.
- Display the fetched joke on the webpage.
- Maintain a list of previously fetched jokes.
- Responsive design for a seamless user experience on different devices.
- Smooth Onload animation using Animate.css library.
## Technologies Used
- HTML: The structure of the webpage.
- CSS: Styling and layout of the webpage.
- JavaScript: Interacting with the Chuck Norris API and handling user interactions.
- Chuck Norris API: The source of jokes.
- Git: Version control and collaboration.
- GitHub: Hosting the repository and web app.
## Setup
To run this project locally, follow these steps:
1. Clone the repository: `git clone https://github.com/dipankarpaul2k/Chunk-Norris-Jokes-Generator.git`
2. Navigate to the project directory: `cd Chunk-Norris-Jokes-Generator`
3. Open the `chunkNorrisJokes.html` file in your preferred web browser.
## Usage
1. Upon opening the app, you'll see the title "Chuck Norris Jokes" along with a dropdown menu to select joke categories and a "Click Me!" button.
2. Use the dropdown to select a category or choose "Random" for a random joke.
3. Click the "Click Me!" button to fetch and display a Chuck Norris joke based on the selected category or randomness.
4. The fetched joke will be displayed on the webpage.
5. The app also maintains a list of fetched jokes below the main joke display area.
6. To view the app's behavior, you can open the browser's developer console to see log messages.
## Contributing
Contributions to this project are welcome! If you find any issues or want to enhance the app, feel free to open an issue or create a pull request. Make sure to follow the existing code style and guidelines.