← All workWeb / Mobile

Church Event Manager

A polished React Native UI implementation for a Coptic church event-management app, built to a defined client brief: pixel-accurate screens and working navigation from a provided Figma design, with no backend by request.

Role

Developer

Year

2024

Built with
React Native
Expo
Figma To Code
Mockup
Screenshot 1
Screenshot 2
Screenshot 3
Screenshot 4
Screenshot 5
Screenshot 6

1another is a mobile app UI for connecting Coptic community members with church events around them. I built the entire UI layer in React Native and Expo from a Figma design the client provided. The scope was UI-only by the client's request. Pixel-accurate screens, working navigation, and light local state, with no backend wiring.

Not every freelance brief is "build the whole product." Many are "implement this design well and hand it back clean," and delivering exactly that on a defined-scope job, without scope creep, without silently re-architecting things the client didn't ask for, is its own skill. The app lets users follow Coptic churches, browse upcoming events such as talks, camps, services, and youth nights, open event details with date/time/location, and save events for later. It's built with React Native and Expo, with screen navigation handled by React Navigation, and theme tokens kept in a small shared module so the coral-and-cream visual identity carries consistently across onboarding, the auth gate, profile setup, the event feed, event detail, and settings. Every screen was translated into React Native components faithfully matching the Figma, with shared styling so a change to the brand colors or typography propagates from one place.

To be clear about scope: this is a UI implementation deliverable, not a shipped product. It isn't connected to a backend and isn't deployed. It's exactly what was scoped, ready for the client to wire to their backend when they're ready.

Key challenges

Faithful translation from Figma to React Native. Pixel accuracy on a clean design is straightforward; the work is in matching spacing, typography, and component structure precisely across a full multi-screen app so the result is indistinguishable from the design rather than approximately like it.

Centralized theming for a multi-screen identity. Keeping the coral-and-cream identity consistent across every screen meant putting theme tokens in one shared module rather than hardcoding colors per screen, so the design stays maintainable and a brand change is a one-place edit.

Disciplined scope. The genuine challenge on a UI-only brief is restraint. Building exactly what was asked, cleanly handed off and ready to wire up, without drifting into backend work or design changes the client didn't request.