Setup

PreviousNext

Getting started with Trident UI

Prerequisites

Before choosing an installation mode, make sure your project meets the following requirements:

  • React 18+
  • Node.js or Bun.js
  • Tailwind CSS 4

Choose your installation mode

Trident UI can be installed in two modes, depending on how you want to work:

  1. shadcn registry mode: for teams that want to manage the component code directly in their own repository via shadcn.
  2. Classic package mode (NPM) with @clubmed/trident-ui: for teams that want a ready-to-use package and a versioning/release cycle maintained through npm.

Choose your setup guide:

shadcn icon
shadcn registry mode

Setup with shadcn to keep and adapt component code directly in your repository.

NPM package mode

Setup (NPM package) for a ready-to-use dependency and npm-managed versioning.

shadcn vs NPM

Criteriashadcn registry modeNPM package mode
Best forTeams that want full control over component codeTeams that want a plug-and-play dependency
InstallationAdd components with shadcn add from the registryInstall @clubmed/trident-ui from npm
Code ownershipComponent code is copied into your repositoryComponent code stays in node_modules
Versioning modelManaged directly in your app codebaseManaged by npm package versions
CustomizationDirect file-level customization is straightforwardPrefer composition and overrides
UpdatesRe-import/merge component changes when neededUpgrade package version
Maintenance effortMore flexibility, but more maintenance responsibilityLower day-to-day maintenance