Skip to content
Notes 03 / Recorded ideas

Field notes

Practical writing about frontend engineering, interface systems, and the decisions behind the work.

All Posts

01
·16 min read

Deploying My Portfolio Website: From Zero to Production with VPS, Staging, and GitHub Actions

A complete guide to deploying a Next.js portfolio website on a VPS (Tencent Cloud Lighthouse) with staging environment, PM2, Nginx, SSL, and automated CI/CD via GitHub Actions.

deploymentnextjsvpsdevopsportfoliogithub-actionsstaging
02
·6 min read

Deploying Next.js to a VPS: Nginx, PM2, and Custom Domains

A practical guide to deploying Next.js applications on a VPS with Nginx reverse proxy, PM2 process management, and custom domain setup.

nextjsvpsdeploymentnginxpm2devops
03
·6 min read

Cara Membuat Lowongan Kerja Terindex di Google Jobs

Panduan praktis menggunakan structured data JobPosting agar lowongan kerja muncul di Google Jobs dan menjangkau lebih banyak pelamar.

seorecruitmentstructured-datagoogle-jobs
04
·5 min read

9Router — One Gateway to 60+ AI Providers with Smart Fallback

How I set up 9Router as a local AI gateway with 3-tier fallback, RTK token compression, and seamless integration with Claude Code, Codex, and Hermes Agent.

aitoolsautomationproductivitydevtoolsrouterfree-tier
05
·5 min read

VPS Monitoring Stack — Grafana, Prometheus & Blackbox Exporter

How I built a full-stack monitoring system on Ubuntu VPS with Grafana, Prometheus, Blackbox Exporter, and automated uptime tracking with Telegram alerts.

devopsmonitoringgrafanaprometheusvpsself-hostedtelegram
06
·7 min read

Building a Habit Tracker with Next.js 16, Tailwind v4 & shadcn/ui

A deep dive into building a mobile-first habit tracker with modern Next.js, shadcn/ui components, framer-motion animations, and a localStorage-first architecture for offline-first personal tracking.

nextjstailwindshadcntypescriptside-projectproductivitylocalstorage
07
·11 min read

Access Any Device from Anywhere — How Tailscale Replaced My Entire VPN Setup

How Tailscale creates a private mesh network between your Mac, Windows, and Android devices — with zero port forwarding, no public IP, and SSH access that actually works.

devtoolsnetworkingtailscalevpnremote-access
08
·4 min read

Why I Rebuilt My Portfolio

My old portfolio was a mess. Here's how I rebuilt it with Next.js 15, Tailwind v4, and a feature-based architecture.

nextjstailwindportfolioweb-dev
09
·4 min read

Frontend Development in 2026 — What's Changed

A look at how frontend development has evolved — from React Server Components to AI-assisted coding.

frontendreacttrendsai