Overview
Lagu Sion is a web app for "Lagu Sion Edisi Lengkap", the hymnal used in Seventh-day Adventist churches in Indonesia. It puts every hymn's lyrics, chords and audio in one place and adds a presenter mode for projecting them during worship. It is free to use for worship and ministry.
The challenge
Picture the person behind the laptop on a Sabbath morning. The song leader announces a hymn number. They need to find it, project the first verse, follow along, and be ready when the next number is called.
Usually that means a printed hymnal, a hand-made PowerPoint for every song and a separate search for a recording to practice with. Slides drift out of sync with the singing. The operator loses their place. Preparing a single service takes longer than it should, and a song nobody made slides for simply cannot be projected.
Approach
I built it for the operator first. Everything else follows from that.
The key decision was to stop treating slides as files. In Lagu Sion, lyrics are data: each song is stored verse by verse, and the presenter generates slides from that data on the fly. No song needs a pre-made PPT, so every song in the hymnal is ready to project the moment someone calls it.
The second decision was lookup by number. Congregations announce hymns by number, not title, so number search and a by-number view are first-class, sitting alongside title and lyric search rather than behind them.
What I built
- Catalog of the complete Lagu Sion edition plus a separate "Lagu Lainnya" (other songs) collection. Search works by number, title or a fragment of the lyrics, with list and by-number views and adjustable pagination.
- Song pages with verse-by-verse lyrics, the key and time signature, an embedded audio or video player and a "frequently viewed" list.
- Chords on their own tab, where available.
- Playlists, including a "liked" list and category playlists such as Sabbath School or Sermon. Songs can be saved, reordered and managed, so a service can be prepared ahead of time.
- Presenter mode (Tayangan): a live display with a slide queue on the side. From one control view the operator picks songs from the catalog or a playlist, steps through verses, jumps between songs, blanks the screen and adjusts text size.
Why Next.js
The app has two very different sides. Song pages are content: plain, shareable URLs that need to load quickly on church Wi-Fi. The presenter is a live, interactive tool. Next.js lets both run on the same song data, with fast server-rendered pages for reading and a client-side view for presenting.
Outcome
A service no longer depends on someone having made slides the night before. The operator can build a playlist in advance, call up any hymn by number when plans change, and run the whole thing from one screen. For the person behind the laptop, that is the difference between scrambling and simply following the song.