ClubRadar | Nightlife Booking App - React Native

ClubRadar – Nightlife Discovery, Booking and Venue Management Template

ClubRadar is a complete nightlife discovery app built with React Native, Expo SDK 55 and TypeScript. Users find clubs, bars and lounges on a live dark-styled map, filter by distance and category, watch 24-hour venue stories, and book tickets, tables or free guest list spots. Club managers get a full dashboard to create venues, publish events and post stories.

One TypeScript codebase ships both iOS and Android apps.

Demo Instructions

The template connects to a Firebase backend. A working demo project is included, and the documentation shows how to plug in your own Firebase project (free plan is enough) in about 15 minutes.

Test accounts on the demo backend:

• Regular user: email demo@clubradar.app – password demo1234
• Club manager: email manager@clubradar.app – password demo1234

No additional configuration is required to try the demo: run the app, log in with the accounts above and the demo data (7 venues, 5 events, stories) appears. To use your own backend you create a free Firebase project and paste its config values into one clearly marked config file – every step is in the documentation.

Everything the App Does

Discovery

• [+] Interactive map with a custom dark map style and color-coded pins per venue category
• [+] Rich map callouts: name, category, distance and a “View Details” action
• [+] Map / List view toggle on the home screen
• [+] Radius search: Near Me, 5, 10, 20 and 50 km with a visual radius circle and +/- stepper
• [+] Live text search across venue names and artists
• [+] Category filter chips: Nightclub, Live Music, Pub, Lounge, EDM Club, Rooftop, Bar, Karaoke Bar, Dive Bar
• [+] Artist / performer filter for events
• [+] Real GPS location (expo-location) with Haversine distance calculation shown per venue

Stories

• [+] 24-hour venue stories in a horizontal stories bar with an Instagram-style viewer
• [+] Managers post photo stories from their venues (camera or photo library)
• [+] Automatic expiry: client-side filtering plus a scheduled Cloud Function that purges expired stories and their storage files every hour

Venues and Events

• [+] Club details: cover image, rating, description, contact number, distance and the venue’s upcoming events
• [+] Event details: poster, artist, date and time, price and “free before” handling

Bookings

• [+] Three booking types: ticket, table reservation and free guest list
• [+] Guest count selection and confirmed / cancelled statuses
• [+] Bookings screen with real-time updates and a cancel action
• [+] Denormalized booking records for fast list rendering with fewer Firestore reads

Accounts and Roles

• [+] Email and password authentication via Firebase Auth
• [+] Role selection at sign-up: regular user or club manager
• [+] Manager sign-up creates the account and the manager’s first venue in one flow
• [+] Role-aware interface: managers get a dashboard button, signed-out guests see a “Club manager? Log in here” banner
• [+] Profile screen with user data, sign-out and preferences stored in Firestore

Manager Dashboard

• [+] Full venue and event CRUD from a dedicated dashboard
• [+] Create venue with an address search and map-pin location picker (geocoding)
• [+] Cover image upload to Firebase Storage from camera or library
• [+] Create events per venue with a date and time picker and pricing, including free events
• [+] Hide and unhide venues and events without deleting them

Polish

• [+] Dark neon theme controlled by a single design-token file (colors, spacing, typography, radii)
• [+] Loading states, empty states and user-facing error messages throughout
• [+] Real-time Firestore subscriptions for clubs, events, stories and bookings
• [+] Platform-aware shadows, keyboard handling and safe-area layouts on iOS and Android

Technology

• Framework: React Native 0.83 with Expo SDK 55 (dev client)
• Language: TypeScript (strict mode)
• Navigation: React Navigation 7 (native stack)
• Backend: Firebase – Auth, Firestore, Storage, plus one scheduled Cloud Function for story expiry
• Maps and location: react-native-maps and expo-location

Third-Party Services Disclaimer

Important: this template relies on Firebase (authentication, database, storage and Cloud Functions) and the Google Maps API (map display and geocoding). These are third-party services provided by Google and are not developed or maintained by the author. Both services operate under their own terms of service and pricing: while both offer free tiers that are sufficient for development and testing, exceeding those limits or enabling paid features may incur additional costs that are the buyer’s responsibility. Please review the current Firebase and Google Maps pricing and terms before publishing. The author is not affiliated with Google, and no API keys or paid accounts are included with this item.

• Media: expo-image-picker, expo-video, expo-linear-gradient
• Icons: lucide-react-native with react-native-svg

What the Buyer Gets

• [+] Complete source code for the app and the Cloud Function, organized in a clean service-layer architecture
• [+] Both iOS and Android apps from a single codebase
• [+] Illustrated setup documentation: Firebase project setup, Google Maps key, renaming the app, changing the bundle ID, replacing the icon and re-skinning the theme
• [+] Demo dataset with ready-made venues, events and stories, plus two test accounts
• [+] App Store and Google Play submission checklist

Development Disclosure

Portions of this template’s source code were developed with AI-assisted tools. All code has been reviewed, tested and documented by the author.

Please note: this item is a source-code template, not a finished hosted product. Basic familiarity with React Native, npm and Firebase is required to build and publish. The documentation covers every setup step, and re-skinning the whole app takes minutes because every color comes from one theme file.