Skip to content

AmielCyber/PetSearch

Repository files navigation

Pet Search

A user-friendly API allows for the search of available pets for adoption within a specific zip code. Users can also input a zip code or a set of coordinates to obtain the city’s information, enabling them to search for available pets in that area.

The Web application was developed using ASP.NET Web API and .NET 8.

The Angular application is hosted on Vercel, the React application is hosted on Netlify, and the ASP.NET Web API is hosted on Microsoft Azure.

Pet Search Angular Application GitHub Repository

Pet Search React Application GitHub Repository

Live Demo

Note: Server response may take around 10 seconds during a cold start when the server is reactivated after 10 minutes of inactivity. I'm considering upgrading the server to 'always on' on Microsoft Azure in the future.

ASP.NET Live Swagger UI

Angular Application Live Demo

React Application Live Demo

Preview

Desktop Preview

Mobile Preview

Technology Stack

C Sharp Dotnet Core Azure MySQL

Angular Application

Angular GitHub Source Code

React Application

I am no longer serving the React files from ASP.NET. I have decided to host the React application at Netlify instead for a better user experience and separation of concerns. I have also stopped providing updates for the React application. All client updates will be done through the Angular application.

React GitHub Source Code

Local Development Set Up

Note: This set up assumes you have obtained keys from PetFinder API and MapBox API.

Required Dependencies

Running the Production Build

  1. Clone this repository:
git clone https://github.com/AmielCyber/PetSearch
  1. After cloning this repository, go to the repository directory:
cd PetSearch

ASP.NET Setup

Note: You must set a MySQL database and create a username and password with DBManager privileges. You must also create a connection for MySQL.

In MySQL Workbench run this script and replace 'username' and 'password'

DROP
USER if exists 'username'@'localhost';

CREATE
USER 'username'@'localhost' IDENTIFIED BY 'password';

GRANT ALL PRIVILEGES ON * . * TO
'username'@'localhost';

Then set up a connection on MySQL Workbench with the credentials you put above.

Note: You must also get access tokens from MapBox and PetFinder API

In the file: appsettings.development.json replace the brackets ({}) and the contents inside with your own MySQL settings:

"DefaultConnection": "server=localhost;port=3306;database={yourDatabaseName};user={yourUserName};password={yourPassword}"
  1. Go to the API application of the ASP.NET project:
cd ./PetSearch.API
  1. Register your PetFinder and MapBox keys:
dotnet user-secrets init
dotnet user-secrets set "PetFinder:ClientId" "your_client_id"
dotnet user-secrets set "PetFinder:ClientSecret" "your_client_secret"
dotnet user-secrets set "MapBox:AccessToken" "your_access_token"
  1. Download and install NuGet dependencies:
    dotnet restore
  2. Build the .NET application:
    dotnet build
  3. Create MySQL database:
    dotnet ef database update -p ../PetSearch.Data
  4. Run tests:
    dotnet test
  5. Run the application:
    dotnet run
    1. In the terminal check what port the application is using:
    http://localhost:{port}
    
    1. Open your browser and go to http://localhost:{port}/swagger/index.html to test the app endpoints.
    2. Close the application by entering ctrl c on your terminal where you ran dotnet run