林 · LIN
PROLOGUE · 序幕

William Lin

Code as calligraphy. Precise, intentional, readable.

Full Stack Developer · Paris

Act I
第一幕
ACT I · WORKS
ACT I · WORKS

The Handscroll

Three pieces pulled from the studio notebook.

Scroll to unroll
01 · 2024
vigueur

MatchFit

Sport coaching web app

Full Stack
Vue.jsPHPPostgreSQLDockerGitHub Actions
02 · 2026
carte

ForkMap

Interactive restaurant map — OpenStreetMap + Foursquare

Full Stack
Next.js 15TypeScriptLeafletSupabaseOverpass API
03 · 2024
festin

Restaurant SPA

Multilingual template for clients

Front
React.jsFigmai18n
End of scroll
William Lin · 林
第二幕
ACT II · SKILLS
ACT II · SKILLS

The Stroke

The gesture, the tool, the mark it leaves.

01
Frontend
visage
  • HTML
    5 / 5 · 2026-04
    Ma
  • CSS
    5 / 5 · 2026-04
    Ma
  • JavaScript
    4 / 5 · 2026-05
    Ma
  • TypeScript
    4 / 5 · 2026-05
    Fo
  • React
    4 / 5 · 2026-05
    Fo
  • Vue.js
    4 / 5 · 2025-12
    Ma
02
Backend
os
  • .NET
    3 / 5 · 2025-10
    Co
  • C#
    3 / 5 · 2025-10
    Co
  • Node.js
    4 / 5 · 2026-04
    Fo
  • PHP
    3 / 5 · 2025-11
    Ma
  • Symfony
    3 / 5 · 2025-09
    Co
  • Python
    3 / 5 · 2026-01
    Co
03
Database
réserve
  • PostgreSQL
    4 / 5 · 2026-04
    Fo
  • Supabase
    3 / 5 · 2026-04
    Fo
  • MongoDB
    3 / 5 · 2025-11
    Co
  • MariaDB
    3 / 5 · 2025-10
    Co
04
Tools
outil
  • Leaflet
    3 / 5 · 2026-04
    Fo
  • Docker
    3 / 5 · 2025-12
    Ma
  • Git
    4 / 5 · 2026-05
    Ce
  • Figma
    3 / 5 · 2025-12
    Re
第三幕
ACT III · NOW
ACT III · NOW

Journal

The current notebook — thoughts, reading, work in progress.

Moon of
May 16, 2026
2026 · entry 2026-05

Carnet du moment

Refonte complète de ce portfolio. Le concept "match point badminton" a laissé place à une mise en scène en cinq actes — palette Tang impérial, défilement horizontal en rouleau pour les projets, traversée d'une porte avant la salle des correspondances.

Ce que je travaille

  • Next.js 15 — défilement détourné en horizontal pour la section Works, transitions de rideau entre actes (framer-motion + sticky containers).
  • Calligraphie SVG — chaque compétence se trace au scroll, stroke-dasharray + IntersectionObserver.
  • Typographie — Cormorant Garamond pour le display, Ma Shan Zheng pour le calligraphique, Inter Tight pour la signalétique.

Lectures

  • Tidy First? (Kent Beck) — passes de propreté avant le gros refactor.
  • Hero (Zhang Yimou) — étude des palettes et du mouvement.

Dernière mise à jour : 16 mai 2026.

Stamped
THE THRESHOLD · 入
太和Cross the threshold
FINAL ACT · 終

Correspondence

Leave a word. I read everything, I rarely reply fast, never late.