noidilin

hey, i'm noidilin

a frontend engineer with DevOps depth, building polished product interfaces and the cloud delivery paths that keep them reliable.

"from careful interface work to Terraform, EKS, GitOps, and observability — I like building systems that are clear to use and safe to operate."

[]
hello.

i'm noidilin. i'm a frontend engineer with a background in finance, design, and cloud delivery. i build clean product interfaces while thinking through the CI/CD, infrastructure, and observability paths that keep them reliable.


my journey into tech started after graduating with a finance degree from National Taiwan University. while working as a freelance 3D and interior designer, i developed a systematic approach to problem-solving and discovered my love for technical precision. this eventually led me to web development, where i could combine my design sensibility with code. since then, i've invested over into learning React, Next.js, AWS, Terraform, Kubernetes, and modern delivery workflows, creating experiences that balance aesthetic clarity with operational reliability.

philosophy

I’d rather ship deliberately than pretend deployment is an afterthought. Every project is a chance to make the interface, release path, and operating model feel precise and durable.

[/about]
Dither

the projects i've built

here are some of the projects I've worked on, from polished frontend products to cloud-native delivery platforms. each one reflects how i think about UX, reliability, deployment, and operating systems after they ship.

Hiraya project screenshot showing the portfolio and platform interface.
cloud platform/2026/platform engineering
live

hiraya

An AWS EKS delivery platform using Terraform, GitHub Actions, Argo CD, and observability workflows.

story

Build a repeatable path from application code to AWS EKS with Terraform-owned infrastructure, GitOps handoff, and operational visibility.

  • Terraform provisions the AWS/EKS foundation, ECR, VPC, and platform access modules.
  • GitHub Actions builds images, validates service catalogs, and updates GitOps manifests.
  • Argo CD owns Kubernetes application sync, platform add-ons, and monitoring manifests.

outcome: Includes Compose smoke tests, GitOps render checks, and Prometheus/Grafana observability paths.

AWS EKSTerraformArgo CD
[github][live demo]
Portfolio 3D screenshot showing an immersive motion portfolio hero.
interactive portfolio/2026/creative frontend
live

portfolio-3d

A 3D portfolio experience built with React Three Fiber and smooth GSAP motion.

story

Explore a motion-heavy portfolio shell around a responsive React Three Fiber scene and animated presentation copy.

  • Full-viewport Canvas scene with drei Environment, Lightformer, Float, and a custom Planet component.
  • GSAP, Lenis, and animated text components shape the portfolio motion system.
  • Vite, React 19, TypeScript, and Tailwind CSS keep the creative frontend lightweight.

outcome: A visual experiment for CG-inspired personal portfolio storytelling.

React Three FiberGSAPVite
[github][live demo]
DRelation frontend screenshot showing the hematology assessment interface.
healthcare assessment/2026/frontend engineering
client work

drelation-frontend

A Next.js 16 assessment frontend for hematology image tests, reports, and group workflows.

story

Guide users through hematology image testing, checkout, group distribution, and report review flows.

  • Tokenized individual, group, advisor, free, and paid report routes support multiple assessment paths.
  • Report types model accuracy, category performance, weak points, and group question consistency.
  • Storybook-backed Next.js 16 component system uses Radix UI, React Hook Form, Zod, and Tailwind CSS.

outcome: Outcome and adoption details are placeholders until product metrics can be collected.

Next.js 16React 19Tailwind CSS 4
[github][live demo]
Misegoto frontend screenshot showing the restaurant repair matching dashboard.
marketplace dashboard/2026/frontend engineering
live

misegoto-frontend

A Next.js 16 public site and dashboard frontend for restaurant repair matching.

story

Support restaurant and repairer dashboards across repair requests, invoices, payments, profiles, and notification settings.

  • Separate restaurant and repairer dashboard routes model each side of the repair marketplace.
  • Invoice checkout paths support card and bank-transfer payment flows with payment-result handling.
  • next-intl, Auth0/Firebase providers, and shared dashboard shells support localized user journeys.

outcome: Outcome and marketplace metrics are placeholders until approved public numbers are available.

Next.js 16React 19next-intl
[github][live demo]

check out more projects at

[/projects]