Uses
Tools, hardware, and software I use daily as a Principal Frontend Architect. Opinionated list — everything here earns its place.
Editor & Terminal
VS CodePrimary editor. Extensions: ESLint, Prettier, GitLens, Tailwind IntelliSense, Thunder Client.
Claude CodeAI-assisted engineering — architecture brainstorming, code review, vibe coding. Saves hours every week.
iTerm2 + ZshTerminal with Oh My Zsh, Powerlevel10k theme.
WarpOccasional use for its AI autocomplete and block-based UX.
Development
Node.js v24Enforced via .nvmrc + engines field. nvm for version management.
pnpmDefault package manager. Faster installs, strict dependency resolution.
Docker DesktopLocal containerisation for services that shouldn't pollute the host.
Postman / Thunder ClientAPI testing. Thunder Client for quick in-editor checks.
React DevTools + Redux DevToolsBoth installed as browser extensions — Chrome and Firefox.
Design & Diagramming
FigmaDesign review, component annotation, and quick mockups during architecture conversations.
ExcalidrawArchitecture and sequence diagrams. Fast, whiteboard-style, easy to share.
Mermaid (in Markdown)For diagrams that live in the repo alongside ADRs and architecture docs.
Hardware
MacBook Pro (M-series)Primary work machine. Fast builds, long battery, runs iOS simulators natively.
Dell 27" 4K MonitorExternal display for extended desktop and screen sharing in calls.
Keychron K2Mechanical keyboard. Brown switches — tactile without the full office-disrupting clack.
Logitech MX Master 3Thumb wheel is genuinely useful for horizontal scroll in wide code files.
Productivity
NotionArchitecture notes, meeting prep, personal knowledge base.
LinearIssue tracking on projects where the team uses it.
Slack + Google MeetTeam communication and client calls. Daily driver.
1PasswordPassword management. Non-negotiable.
This Site
Next.js 16 (App Router)Framework. React Server Components, file-based routing, Vercel-native.
Tailwind CSS v4Styling. Design tokens in globals.css, utilities for layout.
MDX + gray-matterBlog and work content. Write in markdown, drop in React components when needed.
ShikiSyntax highlighting in code blocks. Works in RSC, best-in-class output.
VercelHosting. Preview URLs per branch, zero-config Next.js deploy.