Field Notes
Everything I have learned building software in public — Claude Code workflows, security habits, Arabic-first design, and the unglamorous parts of client work.
95 notesDevSecOps✦Security✦AI Engineering✦AI Security✦Design✦Frontend✦Performance✦Engineering✦Tooling✦SEO✦Product✦Career✦
95 notes
DevSecOpsBlocking Bad Traffic by Behaviour, Not by IP ListRead your own logs, detect the patterns that matter, and act. Plus the shared-signal model, and why you should not trust it blindly.
SecurityAuthorisation Rules Belong in One PlaceWhen 'who can do what' is scattered across handlers, no one can answer the question. Policy as code makes the rules readable, testable and reviewable.
SecurityThe OWASP Cheat Sheets Are the Answer to Most Security QuestionsNot the Top 10 — the cheat sheets. Concrete, implementation-level guidance on the things you are actually about to get wrong.
SecuritySanitising HTML: Do Not Write Your OwnIf your app renders HTML it did not write, you need a sanitiser. Regex is not a sanitiser, and the bypasses that prove it are more creative than you expect.
AI EngineeringYour RAG Pipeline Is Only as Good as the Text You Fed ItMost retrieval failures happen at ingestion. Converting documents to clean structured markdown before chunking fixes more than any embedding model change.
AI EngineeringAutonomous Coding Agents: Where the Line IsAn agent that plans, edits, runs and iterates on its own is impressive. The engineering question is what it is allowed to touch while it does that.
AI EngineeringYou Cannot Debug an LLM Feature You Cannot SeeTraces, prompt versions and evaluation scores for AI features. Without them, 'it gave a bad answer' is a bug report with no reproduction steps.
AI SecurityAgents That Drive a Browser: Useful and DangerousLetting a model click through a real website solves problems no API covers. It also hands a language model your session cookies — here is how to scope that.
AI EngineeringThe Patterns Worth Stealing From the Claude CookbooksRunnable notebooks beat prose about prompting. The four patterns in there that changed how I build features on top of a model.
AI EngineeringOne Gateway in Front of Every ModelA proxy that speaks one API to your app and many APIs to providers. The value is not switching models — it is the key handling, budgets and logs you get for free.
DesignIcons Are a System, Not a Folder of SVGsConsistent stroke weight, one grid, tree-shakeable imports, and the accessibility rule that decides whether an icon should be announced at all.
AI EngineeringClaude Code: What Changes When the Agent Has a TerminalAn assistant that can read the repo, run the tests and see the failure is a different tool from one that autocompletes. Here is how I actually use it, and where I do not.
FrontendReact Three Fiber: 3D Without Leaving ReactThree.js as components, with the reconciler doing the scene-graph bookkeeping. The hard part was never the code — it is deciding whether the page needs 3D at all.
PerformanceBefore You Reach for a Faster ReactCompilers that speed up React rendering are real and clever. They also solve the second-biggest problem on most pages — here is how to find out if you have the first one.
FrontendJotai: State That Only Wakes Who Needs ItBottom-up atoms instead of a single store. Derived state is a computed atom, and only the components reading a changed atom re-render.
FrontendType-Safe Routing: No More Guessing ParamsIf a route's params and search schema are typed, a broken link becomes a compile error instead of a blank page someone finds in production.
FrontendStorybook Is a Contract, Not a GalleryThe value is not the pretty component browser. It is that every state a component can be in has to be written down, and the ugly ones stop being discovered in production.
EngineeringHono: An API That Runs AnywhereBuilt on Web Standards rather than Node APIs, so the same handler runs on Node, Bun, Deno, Cloudflare Workers and Lambda. Small, typed and genuinely fast.