Axel Andrian | Front End / UX Engineer
FRONT END / UX ENGINEER

(HELLO, I'M AXEL)

SOFTWARE
with

Front End / UX Engineer at Zentara

I’ve spent 7+ years building web applications for finance, enterprise teams, and security platforms. I work with React, Vue, Svelte, and TypeScript.

Explore selected work
TANGERANG, INDONESIAFRONT-END DEVELOPMENT & UXABOUT ME
01 / THE PERSON

I build interfaces
for daily use.

My work covers dashboards, design systems,
and the workflows behind them.

I work with React, Vue, Svelte, and TypeScript. I build responsive interfaces and work with designers on how people move through an application, from placing an order to reading a financial report.

At Zentara, I manage front-end architecture and performance across 5+ security platforms. I also build real-time interfaces, maintain a shared design system, and write development guidelines for the team.

BASED INTangerang, Banten
MY FOCUSFront-end engineering & UX
See my selected work
02 / SELECTED WORKGitHub

Selected
projects.

Design systems, business analytics,
fintech, and online catering.

Visit the project websites or open “Contribution details” for details about the work on each project.

Zenos design system homepage with React components, layout primitives, and documentation
Zenos playground with an editable React code example and a live welcome card preview
ZENOS / DESIGN SYSTEMComponents for
product interfaces.
01 / ZENTARA DESIGN SYSTEMPROJECT

ZenOS

A React design system with accessible components, responsive layouts, and semantic design tokens. Documentation and a live playground let developers explore components, themes, and product flows.

  • React
  • TypeScript
  • Base UI
  • Design Tokens
Project website
Contribution details

The challenge

Keep product interfaces consistent while giving teams flexible components, layouts, and clear usage guidance.

Development

The system separates layout, behavior, presentation, and recipes. React components built on Base UI share semantic tokens, with focused hooks for theme and responsive interface state.

Delivery

The public site includes component documentation, installation guides, and a playground with editable code, theme controls, and a live React preview.

Semudahitu landing page with financial reporting features and product previews
Semudahitu dashboard showing revenue, marketing costs, profit, and sales charts
BUSINESS ANALYTICSSales, financing,
and operations.
02 / BUSINESS ANALYTICSPROJECT

SemudahItu

A business analytics platform where small and medium businesses track sales, financing, shipping, warehouse operations, and point-of-sale activity.

  • Svelte
  • SvelteKit
  • TypeScript
  • Tailwind CSS
  • Preline
Project website
Contribution details

The challenge

Give businesses one interface for sales, financing, shipping, warehouse operations, and point-of-sale data.

Development

The front end was built from scratch with SvelteKit and TypeScript, using reusable compound components. Collaboration with UI/UX designers covered usability and visual consistency.

Delivery

The platform’s interfaces use reusable components and a shared front-end structure.

GandengTangan website presenting business financing and institutional funding
GandengTangan lender dashboard with account overview, funding portfolio, and microbusiness projects
GANDENGTANGAN / FINTECHFinance &
business growth.
03 / FINTECH PLATFORMPROJECT

GandengTangan

A peer-to-peer lending platform connecting small businesses that need financing with lenders. The scope at PT. Kreasi Anak Indonesia covered fintech dashboards and operational web applications.

  • Vue
  • Nuxt
  • Bootstrap
  • Vuetify
Project website
Contribution details

The challenge

Make financial data and reporting easier to use while keeping operational applications stable and maintainable.

Development

Fintech dashboards combined financial visualizations with dynamic reporting modules. Stakeholder input guided feature development and responsive, accessible interface design.

Delivery

Ongoing delivery included codebase maintenance, issue investigation, and improvements to application performance and reliability.

KendiXpress catering website with menus, ordering steps, and customer testimonials
KendiXpress delivery-location dialog with map search and address selection
KENDIXPRESS / CATERINGOnline
catering.
04 / CATERING MARKETPLACEPROJECT

KendiXpress

An online catering platform for ordering food from multiple vendors and locations.

  • React
  • React Router
  • Redux
  • Tailwind CSS
Project website
Contribution details

The challenge

Let customers order from multiple catering vendors in one application.

Development

The front end uses React, React Router, Redux, and Tailwind CSS. Interface design work and weekly client reviews guided progress and feature planning.

Delivery

Delivery covered the initial front end and revisions to ordering flows based on design reviews and client feedback.

PRODUCT WEBSITE

Solusi Udara

A responsive single-page website for wind turbine ventilators, with a blog and reservation system. Initial UX sketches, wireframes, and mockups were created in Balsamiq.

  • Vue
  • Laravel Mix
  • Bootstrap 5
Project website
PUBLIC INFORMATION

PPID DPR

An information and documentation platform for Indonesia’s Members of Parliament. The responsive interface uses Laravel and Bootstrap 4.

  • Laravel
  • Bootstrap 4
Project website
WORK EXPERIENCE
03 / EXPERIENCE

Roles &
experience.

7+ years building enterprise software,
financial applications, and security tools.

  1. Oct 2025 — Present

    Zentara

    CURRENT ROLE

    Front End / UX Engineer

    Front-end architecture across 5+ security platforms, including an AI-powered pentesting application built with React, TypeScript, and Socket.IO. Delivery included two enterprise UI revamps in one month, a shared design system, development guidelines, and production React templates.

  2. Nov 2023 — Jul 2025

    SemudahItu

    Senior Front End Developer

    A financial reporting and analytics dashboard built with Svelte, SvelteKit, and Tailwind CSS. The scope covered a Preline-based component library, UI pattern and API contract documentation, and ongoing platform maintenance.

  3. Sep 2022 — Nov 2022

    Kendixpress

    Front End Developer

    Front-end development for a catering platform using React and Tailwind CSS. Collaboration with designers covered customer and vendor ordering flows, with feature delivery in a Scrum team.

  4. Dec 2021 — Aug 2025

    GandengTangan

    Front End Developer

    Enterprise applications, ERP systems, fintech dashboards, and company websites. Development also covered custom learning-management scripts and modules, with stakeholder input on maintenance and performance.

  5. Apr 2019 — Dec 2021

    DOT Indonesia

    Front End Developer

    E-commerce, financial, and ERP application development with Scrum teams. Responsibilities included interface consistency, accessibility, and co-mentoring front-end developers in the company’s academy.

Swipe or use arrow keys to see rolesScroll to see previous roles

Explore the toolkit
04 / THE TOOLKIT

Tools for
building.

Tools for web interfaces,
shared components, and application logic.

01

Web interfaces & motion

Responsive web interfaces with transitions that guide navigation and make changes on screen easier to follow.

  • React
  • Vue
  • Svelte
  • Next.js
  • Nuxt
  • SvelteKit
  • Astro
  • TypeScript
  • GSAP
  • Motion
02

Components & state

Reusable components with usage documentation, plus state management to keep the interface and server data in sync.

  • Tailwind CSS
  • Radix
  • ShadCN
  • Bootstrap
  • Storybook
  • Zustand
  • TanStack Query
03

Build tools & data

Build configuration, code checks, and automated tests, alongside dashboards with live updates and data visualizations.

  • Vite
  • Webpack
  • Vitest
  • Jest
  • Oxlint
  • Oxfmt
  • Socket.IO
  • D3
04

Mobile & backend

Mobile interfaces, server-side application logic, and the databases behind them.

  • React Native
  • Flutter
  • Laravel
  • Express
  • NestJS
  • ElysiaJS
  • MySQL
  • PostgreSQL
SCALE & PERFORMANCE
05 / SCALE & PERFORMANCEProject scope, systems, and performance.

Multiple projects.
Shared standards.

Front-end delivery across security products, with shared development guidelines and application performance improvements.

5+

Core projects managed

Front-end work across five or more core projects, covering security interfaces and new product development.

1

Company design system established

Shared design tokens, components, and usage rules established as the company standard, supported by front-end guidelines and ongoing documentation.

+22pts

Lighthouse performance gain

Lighthouse performance increased from 58 to 80. A separate comparison improved from 83 to 94.

~40%

Bundle size reduction

An estimated 40% reduction in production bundle size compared with the previous version.

06 / CONTACTProjects, roles, or questions

Have a project
in mind?

Send the role or project details
and what needs to be built.

axelandrian001@gmail.com