rwparrish/phase1-project-dogs

Dog Breeds Project

This project is a simple web application that allows users to explore different dog breeds. It fetches data from the Dog API (https://dog.ceo/api) to retrieve a list of dog breeds and display them on the webpage. Users can click on a breed to view a random image of a dog from that breed. This is a demo project meant for educational purposes.

Features

You must modify the src attribute of the script tag on line 16 in index.html to see the finsihed project working in the browser: <script src="practice.js"></script> --> <script src="index.js"></script>

• Fetches dog breed data from the Dog API.
• Renders the list of dog breeds on the webpage.
• Allows users to search for a specific dog breed.
• Displays a random image of a dog from the selected breed.
• Provides a button to return to the list of dog breeds.

Getting Started

To run this project locally, follow these steps:

1. Clone the repository or download the project files.
2. Open the index.html file in a web browser.
3. The list of dog breeds will be displayed, and you can start exploring!

Project Structure

• index.html: The HTML file that defines the structure of the webpage.
• style.css: The CSS file that styles the elements on the webpage.
• index.js: The JavaScript file that contains the logic for fetching dog breed data, rendering the breeds, and handling user interactions.

Usage

• When the webpage loads, the list of dog breeds will be fetched from the Dog API and displayed.
• You can search for a specific breed by typing in the search input field. The list will dynamically update to show only the matching breeds.
• Clicking on a breed will display a random image of a dog from that breed.
• To return to the list of dog breeds, click the "Return to List" button.

Credits

This project makes use of the Dog API (https://dog.ceo/api) to fetch dog breed data and images.

License

This project is licensed under the MIT License. Feel free to modify and distribute it according to the terms of the license.