Programing Notes

Introduction

This collection of programming notes serves as a working index of conventions, patterns, and systems used across current projects — with particular emphasis on the Sentinel system, Named Style Objects (NSOs), and the styling evolution introduced by Tailwind CSS v4. Together, these form the backbone of a structured frontend development approach that prioritizes clarity, composability, and long-term maintainability. Sentinel defines how styling is governed, NSOs define how it is owned, and Tailwind v4 provides the underlying engine that powers both. This page links doctrine, decisions, and practical implementations — all in service of clean, predictable, and scalable UI architecture.

Topics

The following topics are discussed in this section;

  • Sentinel AI Agent

    Defines the structural rules, grouping logic, and styling governance that underpin all frontend design decisions. Covers grouping order, linting requirements, and system principles.

  • Tailwind and the Rise of NSOs

    A discussion on we felt we needed a better way to handle Tailwind styling with the NextJS development paradigm and the issues we saw that were stopping us.

  • Named Style Objects (NSOs)

    Outlines the NSO paradigm as the formal unit of styling ownership. Explains their role, structure, canonical grouping, and how they replace className entanglement.

  • Scoped Token Constants (STCs)

    A discussion on Scoped Token Constants and how they bring clarity and reuse to Tailwind classNames without requiring full NSO structuring exploring their purpose, limitations and how they fit into the broader Sentinel system.

  • Tailwind v4 Styling Model

    Details how Tailwind v4 introduces token-driven styling with @theme, native design layering, and first-class CSS class support. Explains how TW v4 finally enables maintainable Raw CSS.