DEV Community

Cover image for PawMatch: Finding the Dog That Matches Your Personality 🐾
Konark Sharma
Konark Sharma

Posted on

PawMatch: Finding the Dog That Matches Your Personality 🐾

DEV Weekend Challenge: Dog Days Edition Submission πŸ•

This is a submission for Weekend Challenge: Dog Days Edition

What I Built

Dogs have always been more than just pets. They become our companions, our walking partners, our stress relievers, and sometimes the reason we smile after a difficult day.

For International Dog Day, I wanted to build something that celebrates that connection.

I built PawMatch, an interactive dog breed discovery experience that helps people explore different dog breeds based on their personalities, traits, and lifestyles.

The idea came from a simple observation:

Most people choose dogs because they see a cute picture and think, "I want this one."

But every dog has a different personality.

Some dogs need hours of exercise. Some are calm apartment companions. Some are playful chaos machines. Some are independent explorers.

A dog is not just a breed. It is a personality.

PawMatch tries to make discovering breeds feel less like browsing a database and more like meeting different companions.


Demo

The experience includes:

πŸ• Explore Dog Breeds

Users can browse through a collection of dog breeds displayed as interactive cards.

Each breed shows:

  • Personality traits
  • Energy level
  • Size
  • Lifespan
  • Lifestyle compatibility

The goal was to make every breed feel like a character rather than just a data entry.


❀️ Save Your Favorites

Finding a companion is not always an instant decision.

Users can save breeds they connect with and create their own personal shortlist.

Favorites are stored using localStorage, allowing users to keep their choices even after refreshing the page.


🎲 Surprise Me

Sometimes people don't know what they are looking for.

The Surprise Me feature randomly introduces users to a breed they might have never explored before.

Because sometimes the perfect match is the one you weren't searching for.


πŸ” Search and Filter

Users can explore breeds based on:

  • Name
  • Energy level

This helps narrow down choices and discover breeds that fit different lifestyles.


Code

GitHub Repository:

🐾 PawMatch - Find Your Perfect Dog Companion

PawMatch is an interactive dog breed discovery platform designed for International Dog Day. Explore diverse dog breeds, learn their unique personalities, and find the perfect companion that matches your lifestyle and preferences.

React Vite Tailwind CSS License

✨ Features

πŸ” Intelligent Search & Filtering

  • Search breeds by name in real-time
  • Filter by energy level (Low, Medium, High)
  • Responsive search results with instant feedback

❀️ Favorites Management

  • Save your favorite breeds with a single click
  • Favorites persist across sessions using localStorage
  • Quick visual indicators for favorited breeds

πŸ†š Breed Comparison

  • Compare up to 2 dog breeds side-by-side
  • Analyze key differences in size, energy, lifespan, and traits
  • Make informed decisions about which breed suits you best

πŸ“Š Comprehensive Breed Information

  • Detailed breed profiles with:
    • High-quality images
    • Personality traits
    • Size and energy levels
    • Lifespan estimates
    • Best suited living conditions
    • Exercise requirements

🎯 Curated Selection

  • 12+ popular dog breeds included
  • Each…

How I Built It

I built PawMatch using:

  • React
  • Tailwind CSS
  • Framer Motion
  • JavaScript

The main focus was creating a smooth and enjoyable browsing experience.


Component-Based Architecture

One of my goals was to keep the application modular and reusable.

The project is divided into components like:

  • BreedCard
  • BreedGrid
  • BreedModal
  • SearchBar
  • CompareBar
  • DogFact

Each component has a specific responsibility, making it easier to maintain and extend the project.


Making Static Data Feel Interactive

The project uses structured breed data containing:

  • Breed information
  • Personality traits
  • Energy levels
  • Lifestyle recommendations

Instead of showing users a wall of information, I focused on creating interactions around the data.

A simple breed card became a discovery experience.


Animations and User Experience

I used Framer Motion to add subtle interactions:

  • Card hover animations
  • Modal transitions
  • Smooth UI movement

The goal was not to add animations everywhere, but to make interactions feel natural.


Challenges

The biggest challenge was deciding what not to build.

Initially, I considered adding features like:

  • AI-generated dog portraits
  • User uploads
  • Advanced breed recommendations
  • More complex matching algorithms

But with limited time, I focused on creating one polished experience instead of many unfinished features.

Sometimes building less allows you to focus more on the details.


What I Learned

This project reminded me that even a simple idea can become interesting when you focus on the user's emotion.

A breed explorer could easily become another information website.

But when you think about the reason someone visits it, the goal changes.

People are not searching for a dog breed.

They are searching for a companion.


Prize Categories

Not submitting to any additional prize categories.


Final Thoughts

Building PawMatch was my small way of celebrating International Dog Day.

Dogs bring so much happiness into people's lives, and I wanted to create something that reflects that connection.

Every dog has a story, a personality, and a little bit of magic.

Hopefully, PawMatch helps people discover one they connect with. 🐾

Thanks for checking it out!

Top comments (18)

Collapse
 
alexshev profile image
Alex Shev

What I like here is the focus on the mechanism behind β€œPawMatch: Finding the Dog That Matches Your Personality 🐾.” A useful follow-up would be one concrete before/after metric: what changed in latency, error rate, review time, or operator workload once the approach was applied?

Collapse
 
konark_13 profile image
Konark Sharma

Sure, Alex. I'm currently working on it but I'll keep you updated. Thank you so much for the suggestion.😊

Collapse
 
alexshev profile image
Alex Shev

That sounds like a good next step. The mechanism is what will make the project easier for people to trust and extend, so it is worth making visible when you are ready.

Collapse
 
hadil profile image
Hadil Ben Abdallah

Great job, Konark! πŸ‘πŸ»

Collapse
 
konark_13 profile image
Konark Sharma

Thank you so much, Hadil. I'm glad you liked it.😊

Collapse
 
technogamerz profile image
π“π‘πž π‹πšπ³π² 𝐆𝐒𝐫π₯

German Shepherd ❀️

Collapse
 
konark_13 profile image
Konark Sharma

Husky 🐢

Collapse
 
technogamerz profile image
π“π‘πž π‹πšπ³π² 𝐆𝐒𝐫π₯

What are your thoughts about street dogs?

Thread Thread
 
konark_13 profile image
Konark Sharma

Well, they are awesome as well. Every dog has their own story just like us. Some survived harsh weather, some got abandoned, some got lost from their family, some got killed in an accident and some saw their closed one getting dying on the streets and they couldn't do anything. So, yeah they are the most strong survivors that should be loved and cared as well. If dogs could talk we would have gotten unlimited books and podcasts on how their childhood was or what they have gone through. But, the cruelty is a home dog is treated with care and the street dog is treated with sticks. I wrote too much, what are your thoughts on them, do you like your street dogs or you take care of your street dogs.

Thread Thread
 
technogamerz profile image
π“π‘πž π‹πšπ³π² 𝐆𝐒𝐫π₯

What you said is so true and really important. It’s not a small thing at all. I really don’t like it when kids throw stones at dogs or trouble them in different ways.

When I was in the village, we used to give the first roti to the cow and the last one to the dog. We’d let them eat first and then have our food. Now that I’m in the city, it’s a little difficult to do that, so I give them Parle-G instead. Whenever I go near them, they come running to me. They’re honestly so sweet! 🐢❀️

Thread Thread
 
konark_13 profile image
Konark Sharma

Yea, exactly troubling them is the worst and people enjoy hitting them as they won't abuse them or slap them right in the face.

That's a great and wonderful gesture. Giving the first roti to cow and last to dog. Good, atleast you are taking good care of them by feeding them. Don't know how many days can they go without food. They are sweet and you as well. Keep doing this good deed and keep taking good care of them. Always be this kind and sweet towards animals.

Thread Thread
 
technogamerz profile image
π“π‘πž π‹πšπ³π² 𝐆𝐒𝐫π₯

Your project beautifully reflects kindness toward dogs, and the design is absolutely amazing. Really nice project, Konark!

Thread Thread
 
konark_13 profile image
Konark Sharma

Thank you so much for the kind words, The Lazy Girl a.k.a. Divyanshi. Keep loving dogs and caring for them. Always be this kind and humble.

Collapse
 
benjamin_nguyen_8ca6ff360 profile image
Benjamin Nguyen

Great project, Konark!

Collapse
 
konark_13 profile image
Konark Sharma

Thank you so much, Ben 😁.

Collapse
 
benjamin_nguyen_8ca6ff360 profile image
Benjamin Nguyen

No problem man :).

Collapse
 
hemapriya_kanagala profile image
Hemapriya Kanagala

Loved the project, Konark πŸ˜€

Collapse
 
konark_13 profile image
Konark Sharma

Thank you so much, Hemapriya 😊.