The Dog App is an Angular 18 application that fetches data from a free API to display various dog breeds. This app is part of a larger initiative to compare development experiences across different front-end frameworks. The goal is to explore how each framework handles API integration, data fetching, and creating modern, responsive web applications. This project is an integral part of my journey to learn and understand various front-end technologies' strengths and learning curves.
- Fetch and display a list of dog breeds
- Detailed view of each breed with additional information
- Responsive design for mobile and desktop views
- Modern UI/UX with a focus on simplicity and usability
-
Clone the repository:
git clone https://github.com/gustavoaroberto/angular-the-dog-app.git
-
Navigate to the project directory:
cd angular-the-dog-app
-
Install dependencies with npm:
npm install
-
Create an
environment.ts
file in thesrc/environments
directory and add your API key:export const environment = { production: false, apiUrl: 'https://api.thedogapi.com/v1', apiKey: 'your_api_key_here' };
-
Start the development server:
ng serve
-
Open your browser and go to
http://localhost:4200
.
- On the home page, you will see a list of dog breeds.
- Click on any breed to see more details.
- Use the search functionality to quickly find specific breeds.
- Angular 18: Framework for building client-side applications.
- RxJS: Library for reactive programming using observables.
- Angular CLI: Command-line interface for Angular.
This project is licensed under the MIT License.