What is BISH Consulting?

BISH (PT. Bali Infinite Shine) is a Bali-based consulting firm that helps businesses navigate Indonesia's regulatory landscape. They cover environmental compliance, business licensing, land affairs, corporate tax, strategic communication, branding, and even software development: seven practice areas under one roof. Their clients range from foreign investors setting up PT PMA entities to resort operators and mining ventures who need end-to-end regulatory advisory.

The website serves as their digital storefront: a bilingual (EN/ID) company profile that explains who they are, what they offer, and how to reach them. Beyond a typical brochure site, it includes seven dedicated SEO landing pages for each service line, a contact form with dual email delivery (admin notification + client confirmation), and a polished visual identity inspired by Balinese architectural motifs.

How I Built It

I built this on Next.js 16 with the App Router, deployed on Vercel. The stack is intentionally lean: no headless CMS, no database. All content lives in typed TypeScript modules (services, team, company info, client logos), which keeps the site fast, version-controlled, and easy to hand off. A Dockerfile handled staging previews during development, but production runs entirely on Vercel's edge.

The design system uses Tailwind CSS v4's CSS-first theme configuration (no tailwind.config.js), with semantic color tokens drawn from Balinese materials: terracotta brown for the red clay brickwork, dark brown for volcanic soil, paras stone for carved sandstone, and temple gold for hairline accents. Every page matches this palette consistently.

Animation is handled by Motion (the Framer Motion successor), with custom components like ScrollReveal, PageHeaderReveal, and KineticSeal (an ambient rotating Balinese mandala watermark rendered in temple gold linework). The client logos section uses a GPU-accelerated CSS marquee that runs at a smooth 35-second loop with zero JavaScript.

Internationalization runs on next-intl with locale-prefixed routing (/en, /id), and the entire site is statically rendered except for the contact form, which is a server action with rate limiting (5 submissions per 15 minutes per IP), Zod validation, honeypot spam protection, and dual Resend email delivery: one notification to the management team, one confirmation to the client. If the Resend API key is missing in dev, the form still works and just skips email sending gracefully.

What I Learned

This was my first time building a fully bilingual site with server-component-first i18n, and next-intl with Next.js 16's async params pattern taught me a lot about the server/client boundary. I also got deep into Tailwind v4's CSS-first config: no more JS config files, just @theme directives and CSS variables, which made the design tokens feel more native.

The client trusted me with the full visual direction, so I got to design a complete corporate identity from the ground up: color palette, typography pairings (Poppins + Lato), icon system, section layouts, and motion behavior. It's a simple site architecturally, but the polish is in the details: custom scrollbars matching the brand palette, consistent 44px+ touch targets, seamless image optimization to WebP/AVIF, and a zero-emoji, zero-em-dash content standard across every page.

BISH Consulting Website