The Challenge

PDAM Tirta Tarum lacked a modern digital presence commensurate with its scale — over 100,000 active customer connections, 20 branch offices, and 45+ years of public service in one of West Java's largest industrial regencies. Residents had no centralized online channel to access water quality reports, tariff information, financial audits, or self-service forms. Government transparency obligations required structured public disclosure of KPIs, financial statements, and procurement data. The absence of a proper CMS meant any content update required direct code changes, creating operational bottlenecks for the communications team.

Constraints & Scale

As a solo developer delivering a government-adjacent institutional site, I worked within a tight scope with no room for feature creep. The site needed to be deployable and maintainable without a dedicated DevOps team on the client side. Performance was critical — the public expected a fast, mobile-first experience given the high proportion of mobile internet users in Karawang. Bilingual support had to be implemented without a third-party translation service, keeping the stack lean. The CMS had to be simple enough for non-technical staff to operate independently after handover.

System Architecture

The frontend is built entirely with Next.js using the App Router, with TypeScript enforced throughout for type safety across page components, API routes, and CMS data models. Tailwind CSS handles all styling with a custom design system aligned to the client's brand colors. Dynamic content — news articles, announcements, and public information documents — is persisted in PostgreSQL and served through Next.js API routes acting as a lightweight headless CMS layer. Static pages (company profile, history timeline, org structure, tariff tables) are statically generated at build time for optimal performance, while the news listing and detail pages use Incremental Static Regeneration (ISR) to balance freshness and speed. The site is deployed behind Cloudflare for CDN, DDoS protection, and DNS management. Bilingual support is handled via Next.js internationalization routing with locale-aware content fetching from the database.

Key Tradeoffs

I opted for a custom-built CMS over an off-the-shelf solution like Sanity or Contentful to avoid ongoing SaaS subscription costs for the client — a practical consideration for a government BUMD with fixed operational budgets. This came at the cost of build time but produced a leaner, fully owned system. I chose ISR over full SSR for the news pages to minimize server compute load under traffic spikes during major announcements, accepting a short revalidation delay in exchange for reliability. The bilingual system uses database-level content fields per locale rather than a translation layer, giving editors full control but requiring duplicate entry discipline.

Measurable Results

Delivered a production-ready portal covering 15+ page routes across 2 languages with a custom CMS managing 21+ articles at launch. Service performance KPIs — 78% area coverage, 85% customer satisfaction, 20-hour daily distribution — are now publicly surfaced for the first time on a single, accessible platform. Page load performance achieved a Lighthouse score above 90 on mobile. The site consolidates 6 customer service channels (new connection, bill payment, complaint, commercial, online bill check, 24-hour call center) into one unified digital touchpoint for Karawang residents.

Case Study

PDAM Tirta Tarum Karawang Web Portal

2026

A bilingual Next.js web portal with custom CMS for Karawang's regional water utility, serving 100,000+ active customers across West Java.

PDAM Tirta Tarum Karawang Web Portal screenshot

Tech Stack

Key Features

01Build and manage news and announcements via a custom headless CMS
02Toggle full bilingual content (Bahasa Indonesia / English) site-wide
03Display public KPI dashboard with live service performance metrics
04Publish financial audit reports and regulatory documents per year
05Navigate deep company profile: history timeline, directors, org chart, tariff tables
06Submit new water connection registration requests online
07Report service disruptions and complaints through integrated WhatsApp channel
08Browse categorized news with pagination across 6 topic categories

Project Details

PDAM Tirta Tarum Karawang is the regional water utility (BUMD) of Karawang Regency, West Java, having served the community since 1978. The organization needed a modern, public-facing website to replace an outdated presence — one that could handle government transparency requirements, serve residents with self-service tools, and reflect the institution's professional brand. I designed and developed the full portal solo under the Aksara Karya Digital umbrella, delivering a Next.js-based site with a fully custom CMS powering all news and announcements. The site features a bilingual toggle (Bahasa Indonesia / English) across every page, making it accessible to both local residents and industry stakeholders. The portal is structured around two main pillars: public information and customer services. The public information section covers financial reports, service performance KPIs (78% coverage area, 85% customer satisfaction), water quality data, procurement announcements, and regulatory documents. The services section guides residents through new connection registration, bill payment channels, complaint reporting, and commercial water supply inquiries. Beyond the content architecture, the site includes a company profile deep-dive spanning a historical timeline from 1978 to 2024, board of directors profiles, organizational structure, production capacity data, and tariff structure — all managed through the custom CMS. WhatsApp Business and Instagram integrations are woven into the contact and news sections for a modern, multi-channel presence.

#government#nextjs#cms#bilingual#public-sector

View the live portal or get in touch to discuss your next government or institutional web project.

Next Step

Start Your Digital Transformation

Professional websites & apps to boost leads and sales. We handle everything.

Consult Now

More Projects6 projects

View Case Study

2026

Live Demo View Case Study

View Case Study

Truntum – Javanese Wedding Service Platform

2025–2026

A bilingual Next.js website and custom CMS built for a premium Javanese traditional wedding ceremony service in Indonesia.

Live Demo View Case Study

View Case Study

AMS Mobil Karawang

2025

Modernized showroom operations with a customer-facing website, vehicle inventory management, and a back-office admin integrated with sales workflows.

Live Demo View Case Study

View Case Study

DRX Sportnet Ecosystem (2025)

2025

Cloud infrastructure migration and optimization for DRX Sportnet — CI/CD pipeline restructuring, observability enhancement, and security hardening.

Live Demo View Case Study

View Case Study

Enterprise Asset Management

2025

Enterprise SaaS for full lifecycle asset management with depreciation tracking, audit trails, and real-time IFRS-compliant reporting at enterprise scale.

View Case Study

Banking Procurement System

2023-2025

Mission-critical enterprise procurement automation for banking, managing tenders, purchase orders, and multi-level digital approval workflows at scale.

View Case Study

View All Projects

FAQ42 questions

General Questions

Find answers to the most common questions below.