3 min read

Public APIs

Next.js tailwindcss radix-ui typescript swr

Overview ๐Ÿ”—

Public APIs is a searchable directory that helps developers discover free APIs for their projects. Instead of browsing through GitHub repositories or scattered lists, users can filter by category, authentication requirements, and HTTPS support.

The project gained significant traction on Product Hunt, receiving badges for Top Post of the Day and Golden Kitty nomination.

Why I Built This ๐Ÿ”—

I kept finding interesting APIs in GitHubโ€™s public-apis repository but struggled to discover them efficiently. The markdown list became unwieldy, and I wanted:

  • Category filtering: Quickly find all โ€œMusicโ€ or โ€œFinanceโ€ APIs
  • Auth visibility: See at a glance which APIs require keys
  • HTTPS indicator: Security-conscious selection
  • Fast search: Instant results without page reloads

This was also an experiment in building a lightweight, content-focused app with Next.js static generation.

Key Features ๐Ÿ”—

Search & Filter ๐Ÿ”—

Real-time search across API names, descriptions, and categories. Filter by:

  • Category (40+ categories from Animals to Weather)
  • Authentication type (None, API Key, OAuth, etc.)
  • HTTPS support
  • CORS availability

Responsive Grid Layout ๐Ÿ”—

APIs displayed in a clean card grid that adapts from single column (mobile) to 3 columns (desktop). Each card shows essential info at a glance.

Dark Mode Support ๐Ÿ”—

Full dark mode with Tailwindโ€™s dark variant. The UI automatically respects system preferences.

PWA Ready ๐Ÿ”—

Configured as a Progressive Web App with offline support, installable on mobile devices.

Direct links to API documentation and source repositories, making it easy to explore further.

Build Notes ๐Ÿ”—

Static Generation Strategy ๐Ÿ”—

The app fetches API data at build time using getStaticProps, creating a static site that loads instantly. Data updates trigger a new build via webhook โ€” no database, no server runtime, just static files served from CDN.

Tech Evolution ๐Ÿ”—

Originally built with Chakra UI, the app was migrated to Tailwind CSS + Radix UI primitives. The motivation was bundle size reduction and more flexibility in styling โ€” Chakraโ€™s component abstractions werenโ€™t needed for whatโ€™s essentially a filterable list with search.

Data Source ๐Ÿ”—

Powered by the public-apis project by Dave Machado. The site provides a searchable interface to this open dataset.

Recognition ๐Ÿ”—

Current Status ๐Ÿ”—

Stable and in maintenance mode. The data updates automatically from the upstream source. Occasionally refreshed with UI improvements and dependency updates.