Skip to the work

From kitchen to refinery

Used cooking oil passes through five stops on its way to becoming feedstock. I build software for four of them, and one API platform runs underneath all four.

  1. Kitchen

    Restaurants store used oil in drums and tanks, then book a pickup from their phone or the portal.

    Vendor AppVendor Portal

  2. Collector

    A collector drives the route while the restaurant watches them arrive, live, on a map.

    Vendor App

  3. Depot

    The oil is weighed in, stored, and counted against the month's collection target.

    WWS Dashboards

  4. Trading desk

    Feedstock is bought and sold under negotiated contracts with sealed signatures.

    Trading Portal

  5. Refinery

    It leaves as clean-energy feedstock. My part of the line ends one stop earlier.

Seven systems in service

Five I build at FatHopes Energy and two I build on my own time. Every screen below is a working recreation you can click through, so go ahead and press things.

Vendor App

In productionMOBILE2025 to now
Vendor App
Recreated with made-up data. The real screens hold customer information.

The app restaurants use to sell their used cooking oil: book a pickup, watch the collector arrive, get paid.

One Flutter codebase ships to iOS, Android and the web, and it has to work for a cook with oily hands and one bar of signal. I build it end to end, from these screens down to the Nitro and GraphQL service behind them.
Handover note, 2025 to now
  • Pickup booking with a photo check, weight limits and date rules
  • Live collector tracking on a map
  • Wallet, payout methods and withdrawals through Xendit and Billplz
  • Face check before a payout
  • Nine languages and push notifications
FlutterDartGraphQLNitroPrismaPostgreSQLFCM

Trading Portal

In productionWEB2025 to now
Trading Portal
Drag the screen sideways to explore. Recreated with made-up data. The real screens hold customer information.

Where feedstock is bought and sold: company KYC, negotiated purchase requests, and contracts signed under a tamper-evident seal.

A contract here passes between a supplier, a director and a CEO, often over several rounds. I put every counter-offer into one readable thread and made every signature an HMAC seal that anyone can verify later. Sign the demo contract on the screen, then change a number and verify it again.
Handover note, 2025 to now
  • A 15-step KYC and compliance review
  • Purchase requests with counter-offers in one thread
  • HMAC-SHA256 sealed e-signatures with a public verify page
  • Permission nodes and role-based access
  • Weekly, monthly and year-to-date reports
Next.js 16React 19TypeScriptshadcn/uiTanStack TableGraphQL YogaPrisma

Vendor Portal

In productionWEB2025 to now

The web side for restaurant groups: register, manage outlets and tanks, and follow every collection.

Groups with many outlets needed more than a phone app. The portal gives them a five-step registration, outlet and tank management and maintenance requests, with 31 permission keys deciding who can see and do what.
Handover note, 2025 to now
  • Five-step vendor registration with document upload
  • Outlets, brands and persons in charge
  • Tank maintenance requests with before and after photos
  • Collection trends by weight and count
  • 31 permission keys across roles
Next.js 16React 19shadcn/uiRechartsNitroPrismaAzure Blob Storage
Vendor Portal
Drag the screen sideways to explore. Recreated with made-up data. The real screens hold customer information.

WWS Dashboards

In productionDATA2025 to now
WWS Dashboards
Drag the screen sideways to explore. Recreated with made-up data. The real screens hold customer information.

Operations dashboards for the collection network: a week of pickups replayed on a map, monthly pace against target, stock and service levels.

The weekly view replays every collection as an arc from outlet to depot, so you see where the oil came from, not only how much. The monthly view answers one question before any chart: are we on pace for target?
Handover note, 2025 to now
  • Weekly collection replay on a deck.gl arc map
  • Monthly collection pace against target
  • Collection due triage, service level and stock reports
  • Light and dark themes with Malaysian number formats
  • Helping move the legacy LoopBack 4 stack to Nitro and Next.js
Next.js 16deck.glRechartsTanStack TableGraphQL YogaPrismaMySQL

API Platform

In productionBACKEND2025 to now
API Platform
Drag the screen sideways to explore. Recreated with made-up data. The real screens hold customer information.

The type-safe GraphQL and REST layer that every app and portal above talks to.

Five products, one way of building services: Nitro, GraphQL Yoga, Prisma and Zod, with signed requests, structured logs and error tracking on every one. Whichever service misbehaves, you debug it the same way.
Handover note, 2025 to now
  • GraphQL (Yoga) and REST endpoints on Nitro
  • Prisma across PostgreSQL, MySQL and MongoDB
  • JWT and OAuth sign-in with request signing
  • Zod validation at every boundary
  • Winston logging and Sentry error tracking
Node.jsNitroGraphQL YogaPrismaZodWinstonSentry

Built on my own time

Two products I design, build and ship on my own time.

OSAI

Open source, MITDESKTOP
OSAI
Drag the screen sideways to explore.

A desktop superapp for driving AI coding agents: chat, terminals, browser, files and editor as floating windows on one canvas.

I wanted one window for the way I actually work with coding agents. OSAI drives the agent CLIs on your own subscriptions, keeps terminals alive after you close them, and ships signed builds for Windows and macOS. I rebuilt it Windows-first and keep carrying it forward.
Handover note, own product
  • Agent chat across several engines, with tool activity cards
  • Terminals that survive closing, plus a roster of running agents
  • Monaco editor, git-aware file tree and a native browser
  • Command palette, scheduled agents and voice control
  • Signed, auto-updating releases for Windows and macOS
Tauri 2RustReact 19TypeScriptMonacoxterm.js

Stone & Chisel

Live at stonenchisel.comWEB

A calm place to carve markdown notes.

My own notes app, built the way I like to write: split view with scroll sync, wiki links and backlinks, math, Mermaid and Excalidraw canvases, all autosaved with version history. The notes pane in OSAI is a Stone & Chisel client, so the two work as one setup. Try typing in the editor on the screen.
Handover note, own product
  • Edit, split and preview with scroll sync
  • Wiki links, backlinks and a note graph
  • KaTeX math, Mermaid, DBML and Excalidraw canvases
  • Journals, full-text search and version history
  • Share links and API tokens
Next.js 16Tailwind CSSshadcn/uiDrizzleNeon PostgresAuth.js
Stone & Chisel
Drag the screen sideways to explore.

What each system runs on

A patch bay of the stack. Every jack is wired to the units that genuinely use it, straight from their dependency lists.

Web
Mobile
Backend
Data
Cloud
Desktop

Also in regular use: Docker, LoopBack 4, PowerBI, PDF and Excel reporting, Payments, Real-time GPS.

Operator on duty
Portrait of Jullien Nazreen
Name
Jullien Nazreen
Role
Full-Stack Developer
Company
FatHopes Energy
On shift since
Nov 2025
Based in
Greater Kuala Lumpur
Drawn to
Clean energyLogisticsFintech

Who runs the board

I started on backend services and grew into owning features end to end: database schema, API design, and the screens vendors and internal teams use every day.

Most of my work happens in fast-moving, KPI-driven teams where requirements shift week to week. I build across the stack: Next.js and React on the web, Flutter on mobile, and Nitro with GraphQL and Prisma behind them.

I care about software that stays reliable after launch day: type-safe code, plain architecture where it matters, and interfaces that respect the person using them.

  • 9 languages localized in a production app
  • iOS, Android and web from one Flutter codebase
  • PostgreSQL, MySQL and MongoDB in production

Service record

Where I have worked, newest first, and where I trained.

  1. Nov 2025 to now

    Full-Stack Developer

    FatHopes Energy, Subang

    The web and mobile platforms behind used-cooking-oil collection and feedstock trading across several countries, from schema and API design to the screens people use daily.

  2. Nov 2024 to Nov 2025

    Back-End Developer

    Juta Teknologi, Selangor

    Backend services, database integration and API design, plus performance work, bug triage and testing support for the team.

  3. Feb 2024 to Jul 2024

    Chatbot Developer

    Juta Teknologi, Shah Alam

    AI chatbots and conversational workflows, wired into the business processes of client companies.

  4. Jan 2021 to Jun 2021

    Computer Technician

    Cabletronic Computers, Seremban

    Diagnosed and repaired laptops and PCs, hardware and software, and got them back to their owners on time.

Training

  1. Oct 2024 to Feb 2026

    MSc Information Technology

    Universiti Teknologi MARA

  2. Mar 2022 to Aug 2024

    BSc (Hons) Information Systems

    Universiti Teknologi MARA, Intelligent Systems Engineering

  3. Oct 2018 to Sep 2021

    Diploma in Computer Science

    Universiti Teknologi MARA

Open a channel

Not job-hunting. Always up for a good conversation about clean energy, logistics and fintech.

[email protected]

Email works best. LinkedIn and GitHub are just below.

Email me