INDEPENDENT DEVELOPER · INDONESIA

Building software
with purpose.

I'm Abdan Syakuran, a frontend developer who turns everyday problems into thoughtfully designed, useful web applications.

Explore selected work GitHub profile
FRONTENDWEB APPLICATIONSAPI & AI INTEGRATION
BUILD / VERIFY / SHIP ✳
abdan-labs / workspace● LIVE BUILDS
◈▣⌘◫
PRODUCT ENGINEERING
From a real problem01
To a working product02
Ready to learn, build & collaborate ↗
UI / UX ↗
</> CODE
DESIGNED & BUILT WITH INTENTION — 2026
SCROLL TO EXPLORE01 — PORTFOLIO

Real problems. Working products. Careful execution.

PRODUCTS > PROMISES

01 / SELECTED WORK

Things I've built.

More than demos: projects shaped around real users, technical constraints, and what happens after deployment.

01 / BUSINESS APPLICATIONOFFLINE-FIRST
Illustrative animation of a fictional cash sale followed by an updated dashboard. No actual transaction is recorded. Illustrative demo · fictional data
P / 01MVP · PILOT STAGING

Microbusiness Operator

Helping small businesses track sales, repayments, expenses, and receivables — even without an internet connection.

Engineering focusLocal-first data, offline PWA workflows, atomic updates, backup & restore, and safer transaction corrections.
TypeScriptIndexedDB / DexiePWACloudflare Pages
Explore staging demo Source repository is private
02 / INSTITUTIONAL WEBSITELIVE SITE
Illustrative design studyIllustrative school website design; the heading, decorative rule and visual elements reveal in sequence.
P / 02LIVE · PUBLIC CODE

School Website

A responsive institutional website for SMP Tahfizh Quran Fantastis, built around readable content and thoughtful interaction.

Engineering focusFramework-free HTML, CSS, JavaScript, accessible motion preferences, production asset preparation, and automated QA checks.
HTML / CSSJavaScriptAccessibilityCloudflare Pages
Visit live website Source ↗
03 / WEATHER INTELLIGENCELIVE PROTOTYPE
Illustrative forecast · sample dataIllustrative Jakarta forecast with sample temperatures, a drawn forecast curve, and fictional advisory and freshness labels. No live weather data is requested.
P / 03LIVE · MVP

ABDAN Weather

A focused weather application that brings together forecasts, data freshness, and an Indonesia-first warning integration.

Engineering focusWeather-provider integration, domain adapters, warning handling, and a zero-cost Cloudflare Workers architecture.
TypeScriptWeather APIsCloudflare WorkersDurable Objects
Try weather prototype Personal R&D project
04 / AI PRODUCT EXPLORATIONIN DEVELOPMENT
Illustrative chat · no API callIllustrative conversation animation showing an example prompt, a temporary processing cue, and a fictional response. No AI API call is made.
P / 04ACTIVE R&D

ABDAN AI

An OpenAI-powered conversational application being developed as an independent, branded product experience.

Engineering focusAI API integration, conversation workflows, responsive chat interfaces, and iterative product verification.
TypeScriptOpenAI APIReactCloudflare
Development in progress · No public demo listed

Project previews on this page are original illustrative UI compositions, not screenshots. The Microbusiness animation uses fictional values and does not record transactions. Weather and AI previews also use illustrative examples, not live API responses. Staging applications are evolving prototypes; feature availability may change.

02 / WHAT I WORK WITH

Curious by nature.
Practical by design.

I enjoy connecting the details of an interface to the reliability of the system behind it.

01 /

Frontend engineering

Responsive layouts, component thinking, semantic markup, clear interactions, and considerate motion.

HTMLCSSJavaScriptTypeScriptReact
02 /

Offline-first apps

Data models and workflows that are useful on real devices, including when network access disappears.

IndexedDBDexiePWABackup & restore
03 /

APIs & deployment

Connecting external services, protecting boundaries, shipping to the web, and validating what was shipped.

REST APIsOpenAI APICloudflareGit / GitHub

03 / HOW I THINK

The best feature is the one that works.

Good software is not only about how it looks. It should make sense to the people using it and remain reliable after the first demo.

  1. 01

    Understand the workflow

    Start with the user and the problem, not a framework.

  2. 02

    Keep architecture intentional

    Choose understandable tools and clear data boundaries.

  3. 03

    Test on real devices

    Check responsiveness, edge cases, accessibility, and offline behavior.

  4. 04

    Ship, observe, improve

    Value reproducible changes over impressive but fragile demos.

04 / ABOUT ME

A builder with a
hands-on perspective.

AS.

I'm Abdan, an Indonesia-based developer learning and building in public where possible.

My background includes technical drafting and school operations. Those experiences taught me that software is most useful when it respects real-world details — how people record information, make mistakes, recover their work, and get things done.

Through ABDAN LABS, I explore web interfaces, business tools, weather data, and AI integration. I care about accessible design, understandable architecture, and steady improvement.

BASED INIndonesia (WIB / UTC+7)
INTERESTED INRemote junior frontend & web roles
BUILDING ASABDAN LABS

05 / LET'S CONNECT

Let's build something
worth using.

I'm interested in junior frontend opportunities, useful product teams, and collaborative projects where I can contribute while continuing to grow.

Send me an email github.com/abdanfx ↗

Email: abdansyakuran@hotmail.com