Adoptly

• 

  Home Page

About the Project

Inspiration

Millions of pets wait in shelters every year, but adoption platforms often feel like classified ads — flat photos and plain text.
I wanted to reimagine the adoption journey as something emotional, interactive, and engaging, helping people connect with animals on a deeper level.

How I Built It

• Frontend: Next.js 14 (App Router) for fast, modern routing
• Styling: TailwindCSS + shadcn/ui for responsive, polished design
• Backend: In-memory data store (no external DB required for demo)
• APIs: Custom API routes for pets, stories, and quiz matching
• Deployment: GitHub Codespaces for quick cloud-based dev

What I Learned

• How to use the Next.js App Router effectively with API routes
  
• Rapid prototyping in GitHub Codespaces without local setup
  
• The power of Tailwind + shadcn/ui for building beautiful UIs fast
  
• Designing adoption experiences that go beyond simple search filters
  

Challenges I Faced

• Tech Constraints: Limited access to external services (like Firebase/Supabase), so we built a lightweight in-memory backend
  
• UI/UX Decisions: Balancing sleek design with hackathon time pressure
  
• Data Mocking: Creating realistic pet profiles and stories for demo purposes
  
• Team Sync: Ensuring consistency across components while working in a cloud IDE
  

✨ Adoptly isn’t just about building an app — it’s about making pet adoption more human, emotional, and joyful.

Built With

• cloudide
• codespaces
• github
• next.js
• shadcn
• tailwindcss