LABORATORY // FIELD NOTES

Field Notes & Lab Reports

A first-hand technical publishing log. Architectural breakdowns, performance tests, and engineering learnings documented directly from real software builds and web development projects.

NOTE_01// DESIGN

Why I Built My Portfolio Like a Physical Desk

PUBLISHED: 2026-02-156 min read

A technical design breakdown of creating a custom tactile dark paper-desk visual system using Next.js, React, CSS Custom Variables, and responsive transform rotations.

#Tactile UI#CSS Custom Variables#React Components#Design System
NOTE_02// TECHNICAL

How the Spotify Currently Playing Widget Works

PUBLISHED: 2026-02-207 min read

An architectural walkthrough of building a server-side cached Spotify OAuth route handler in Next.js to display live listening activity securely.

#Next.js App Router#Spotify API#OAuth 2.0#In-Memory Caching
NOTE_03// BUILD LOG

Building a Case Study System Instead of a Project Gallery

PUBLISHED: 2026-02-256 min read

How I designed a schema-backed project case study architecture in Next.js to provide verified technical proof for freelance clients.

#Next.js App Router#Dynamic Routes#TypeScript#Case Studies
NOTE_04// WEB ENGINEERING

Turning a Static Portfolio Into a Freelance Web Developer Site

PUBLISHED: 2026-02-288 min read

An architectural breakdown of transforming a student project showcase into a commercial freelance platform with technical SEO, search intent mapping, and project brief forms.

#Technical SEO#Freelance Services#Conversion Architecture#Next.js

HAVE A SIMILAR PROJECT IN MIND?

Let's apply these engineering solutions and design approaches to your website or frontend application.

let's build your solution