Skip to content
Back to projects

Web Development

Bulan Fintech Nasional 2026

Digital platform for Bulan Fintech Nasional, AFTECH’s month-long national fintech campaign: a public campaign site, participant dashboard, and admin portal in one Next.js monorepo.

Bulan Fintech Nasional 2026

About Bulan Fintech Nasional

Bulan Fintech Nasional (BFN), or National Fintech Month, is an initiative of the Indonesian Fintech Association (AFTECH). It starts on 11 November, Indonesia's National Fintech Day, and runs for a full month until 12 December, National Online Shopping Day (Harbolnas).

Throughout the month, BFN brings the country's digital finance ecosystem to the public: financial literacy programs, promotions from fintech players, a job fair, and events across Indonesia. The theme for 2026 is "Fintech All Around You", showing how fintech has become part of everyday life and is building a more inclusive, innovative, and connected financial ecosystem.

The flagship event is BFN Fest 2026, an international conference and expo on 26–27 November 2026 at Balai Kartini, Jakarta, themed "Everything, Everywhere, Productive at Once: Fintech & Real Sector Growth". It brings together industry leaders, regulators, investors, startups, communities, and global partners through a conference, an expo of B2B and B2C fintech products, the Infinity Stage, business matching in the Connection Lounge, and the hands-on Fintech Xperience.

For context on its scale, the previous edition (BFN 2025) recorded 150+ contributors, 90+ international and national strategic partners, 90+ financial literacy programs, 50+ promotional programs, and 170+ job vacancies.

The challenge

A campaign of this size needs more than a landing page. Visitors need one clear place to discover events, speakers, partners, news, promotions, and jobs. Participants need an account to register for events and follow their activity and points. Exhibitors need a workspace for their company content, and the AFTECH team needs an admin portal to manage and moderate everything.

All of this had to launch on a fixed date, in two languages, and stay fast and reliable during the busiest weeks of the campaign.

The platform

I worked on the BFN 2026 digital platform at Sawala Technology on the front end, and later extended the back-end APIs the apps depend on. The platform is a Turborepo monorepo with one app per audience and shared packages underneath:

  • Homepage: the public campaign and discovery experience.

  • User dashboard: profile, events, activities, BFN points, and notifications for registered participants.

  • Exhibitor workspace: invitation-based space for companies to manage their profile and submit content.

  • Admin portal: account management, moderation, and platform oversight for AFTECH and BFN administrators.

  • Shared packages: UI components, domain types, API services, and utilities used across every app.

Each app talks to a Hapi backend through a documented /api/v1 contract with cookie sessions, CSRF protection, and role-based access.

What I built

Homepage experience

  • Rebuilt the landing motion around a single hero moment and added an animated BFN logo splash screen.

  • Smooth section navigation without hash links, plus a "coming soon" toast for parts of the schedule that were not published yet.

  • News pages loaded entirely from the API with server-side search, sharing the same layout and motion as the landing page.

  • Navbar and footer that link only to pages and sections that exist, with a language switcher next to the auth actions and a session state that stays steady while it loads.

SEO and performance

  • Localized metadata, social cards, and structured data for every page, plus a localized sitemap and robots.txt.

  • Prerendered locale pages that revalidate every minute, so content stays fresh without slowing the site down.

  • Optimized remote images with a loading shimmer.

  • Shared components emitted as ESM and imported by path, so each app only ships the code it uses.

Admin portal

  • Modules for events, merchandise, BFN points, and QR codes, plus a profile page with a shared change-password form.

  • Consistent empty and error states across list and detail pages, and a styled 404 page.

  • Documented the backend API requests the admin portal needs, so frontend and backend could work in parallel.

User dashboard and shared UI

  • Fixed session handling so the login callback survives an expired session.

  • Shared form components, field hints, select states, and a language menu used by every app.

Back-end contributions

Where the apps needed new capabilities, I extended the back-end REST APIs and connected them to the participant and exhibitor workflows:

  • Exhibitor management for the exhibitor workspace and admin portal.

  • Reporting for BFN points.

  • Visibility controls for job fair listings.

How I worked

I delivered front-end and back-end features with AI coding agents, using structured planning, project context, reusable agent skills, and MCP tools, and validated every change through code review and testing.

Architecture overview

A high-level view of the platform. Each audience gets its own app, and all four share one set of packages so components, types, and API calls stay consistent. Every app talks to the same versioned REST API.

flowchart LR
  accTitle: BFN 2026 platform overview
  accDescr: Four apps in one Turborepo monorepo serve visitors, participants, exhibitors, and admins. They share UI, types, and API services, and all talk to one versioned REST API.
  visitor([Visitor]) --> home
  attendee([Participant]) --> dash
  exhibitor([Exhibitor]) --> exhib
  adminUser([AFTECH admin]) --> adminApp
  subgraph mono["Turborepo monorepo"]
    home["Homepage<br/>campaign, events, news, jobs"]
    dash["User dashboard<br/>events, activities, points"]
    exhib["Exhibitor workspace<br/>company profile and content"]
    adminApp["Admin portal<br/>accounts and moderation"]
    shared[["Shared packages<br/>UI, types, API services"]]
  end
  home & dash & exhib & adminApp --- shared
  shared --> api[("REST API<br/>/api/v1")]

Tech stack

Next.js 16, React 19, TypeScript, Tailwind CSS 4, TanStack Query, Motion, and Turborepo, integrated with a Hapi /api/v1 backend.

Result

The platform is live at bulanfintechnasional.com, serving the public campaign for BFN 2026 in English and Indonesian.

Next project

One Academy

Side Project · 2026