Two map providers
OpenStreetMap through Leaflet is the default. Google Maps can be selected when richer map features are useful.
Web app
Next.js
PWA
ParkFindr
A mobile-first app for finding nearby parks, playgrounds, and green spaces. It opens directly to a useful map, supports two map providers, and does not require an account.
01 · Why it exists
Finding a nearby park should take seconds.
Park discovery often means city websites, general-purpose map apps, sponsored results, and too much context switching. ParkFindr is a single-purpose tool: open it and see parks around you.
It is designed for parents, dog owners, travelers, and anyone trying to find nearby green space from a phone without creating an account first.
Behavior
The map tries hard not to start blank.
Layered location
IP-based location gives the map a useful starting point while browser geolocation permission is pending.
Offline-ready caching
Recent searches and map data are cached locally, which helps on repeat visits or weak mobile connections.
Search anywhere
Autocomplete supports park names and addresses, with results biased toward the current location.
02 · Location
Precision improves when the user grants it.
If location permission was previously granted, browser geolocation is called immediately. At the same time, an IP location estimate can populate the initial map, so the page is not empty while a permission dialog waits for input.
First-time visitors can grant browser location for better precision. If both browser location and IP location fail, the app falls back to a default map center so the interface still works.
03 · Stack
A small app with provider flexibility.
| Layer | Technology |
|---|---|
| Framework | Next.js 15 App Router. |
| Language | TypeScript. |
| Interface | Tailwind CSS and shadcn/ui with Radix primitives. |
| Default map | OpenStreetMap via Leaflet, no API key required. |
| Optional map | Google Maps JavaScript API. |
| Places data | Google Places API for nearby search, details, and autocomplete. |