Selah Case Study

A focused daily devotional

Mobile‑first reading, quick journaling, and simple reflection tools in one place.

Explore Case StudySee Outcome
Role: Full-stack + UI/UXTimeline: 2.5 weeksHosted on Vercel
Next.jsNext.jsTailwind CSSTailwind CSSFirebaseFirebaseOpenAIOpenAIGeminiGemini
Selah hero image
Problem

Where it began: static PDFs, static hearts

The challenge that sparked Selah.

At my church, devotions lived inside a Dropbox PDF. To engage, members juggled tablets, journals, and pinch-zoomed screens. Reflection was possible, but hardly inviting.

  • Awkward annotations on clunky PDFs
  • No easy way to add notes or search past reflections
  • Access limited to one rigid format

Selah was born to break that friction.

Original PDF page
Solution

A living, breathing devotional

Dynamic, accessible, and personal.

By parsing the church’s PDF into structured JSON, Selah unlocked devotionals into a new medium: clean, mobile-first, and ready anywhere. With journaling and AI reflections built-in, members can go beyond reading—they can converse with Scripture.

Screen 1 – Daily Scripture Overview

Home screen greeting the user and highlighting the date. Focuses on the day’s passage (1 Corinthians 3:10–17) with clean verse typography and a ‘See Today’s Reflection’ call-to-action over a calm, nature-inspired background.

Checkout App
Daily Scripture Overview screen
1 / 4
Highlights

Experiences that matter

Daily Scripture & reflections

Feature description for Daily Scripture & reflections.

Guided journaling

Feature description for Guided journaling.

Reflect with AI

Feature description for Reflect with AI.

Resource hub

Feature description for Resource hub.

Mobile-first + PWA

Feature description for Mobile-first + PWA.

Minimal onboarding

Feature description for Minimal onboarding.

Dev Journey

Learning by building

From minimal code knowledge to full-stack delivery.

{ 01 }

Starting out

Design-first background with minimal code. I mostly tweaked front-end styles in no‑code tools—development still felt like a “black box.”
{ 02 }

Practice-based learning

Learned by shipping. With Cursor, I built small layouts, animations, and components—breaking problems down and asking “what if.” Confidence came from doing.
{ 03 }

Backend fundamentals

To make apps work end‑to‑end I learned:
  • Firestore data modeling and reads/writes
  • Creating and consuming APIs
  • Auth and basic security
  • Hosting, deployment, and scalability basics
{ 04 }

Full-stack confidence

From sketch to production with Next.js, Tailwind, Firebase, and AI APIs—shipping polished, usable products on my own.
Process

Crafting Selah

From sketches to sanctuary.

1
📝

Planning & Design

Sketches, flows, and a calm visual identity.
2
🛠️

Development

Next.js, Tailwind, Firebase, and AI integrations.
3
🚀

Deployment

Fast, reliable hosting on Vercel.
Comparison

Before and After

Drag or hover to compare

Drag to compare
second image
first image
Outcome

Impact in practice

A devotional that meets people where they are.

Selah turns daily devotion into a clear, repeatable routine. People can read the day’s text, capture a quick thought, and return later to pick up where they left off—without jumping between apps. Notes are saved in context, so past reflections are easy to review and compare over time.

When questions come up, built‑in AI offers summaries or prompts to consider, keeping the focus on the passage rather than the tooling. The result is a lightweight flow that helps users stay consistent and engaged, whether they have two minutes or twenty.

See Selah in action

Explore the live app and the source code below.

Visit selahdevotion.comView on GitHub