Skip to content

This is a dog breed app that fetches data from a public API and displays details of selected breed.

License

Notifications You must be signed in to change notification settings

shekhs-murega/Phase-2-Project

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

36 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Dog Breed App

The Dog Breed App is a user-friendly web application designed for dog enthusiasts and curious minds alike. With this app, you can explore a vast array of dog breeds, each with its unique characteristics and charm. Browse through a comprehensive list of breeds, select one that piques your interest, and delve into detailed descriptions, including life expectancy and weight ranges. It's your one-stop source for canine knowledge, helping you make informed decisions about your future furry companions.

Table of contents

Features

  • View a list of various dog breeds.
  • Select a breed to view detailed information.
  • Display breed descriptions, life expectancy, and weight ranges.
  • Subscribe to newsletters to receive dog-related updates.

Installation

To run the Dog Breed App on your local machine, follow these steps: 1.Clone the repository to your local machine using Git:

git clone https://github.com/shekhs-murega/Phase-2-Project.git

2.Navigate to the project directory:

cd dog-breed-app

3.Install the necessary dependencies using npm:

 npm install

4.Start the development server:

 npm start

5.The app will be accessible in your browser at http://localhost:3001.

Usage

-Visit the website and click the data tab to view a list of breeds. -Click on a breed to display detailed information about that breed -You can also subscribe to newsletters by entering your email and clicking the "Subscribe" button.

Components

The app is structured into several components:

  • App.js: The main component that renders other components.
  • Data.js: Displays the list of dog breeds and shows detailed information about a selected breed.
  • Header.js: Displays the application header with navigation and subscription form.
  • Footer.js: The footer of the application.

Routes

The app uses React Router to navigate between different pages:

  • /: Home page, it's the main page of the app.
  • /about: Gives a brief description of the Dog Breed App.
  • /data: A list of dog breeds fetched from the API.

API Intergration

The app integrates with the Dog API to fetch the list of dog breeds:

Styling

The app's styling is defined in the CSS files within each component's directory and also uses a Semantic UI CSS and Bootstrap.css.

Deployment

This app is deployed using Netlify.

To deploy the app yourself, follow these steps:

  1. Build your app:
    npm run build

Contibuting

Contributions to this project are welcome. You can open issues, fork the repository, make changes, and submit pull requests.

License

This project is licensed under the MIT License.

About

This is a dog breed app that fetches data from a public API and displays details of selected breed.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published