Where to Launch a React Component Library: npm, JSR, the shadcn Registry Index and React Newsletters
Launch a React component library by publishing it to npm, optionally to JSR, and by making the components visible: a docs site with a live playground is the product page. If your components follow the shadcn registry format, you can ask for a listing in its open-source registry index with a pull request. React newsletters and Show HN then bring developers to the docs. Visual proof does more than a feature list, so prepare screenshots and a playground first.
Why does a component library need a demo before a registry?
Developers choose a component library by looking at it. A package page with a version number and a dependency list says nothing about whether a date picker feels right. So the docs site, with every component rendered live and its code beside it, is the actual launch asset, and each place below links to it. Without it, most of these places have little to show.
Registry facts below were read from each service’s own documentation on 13 November 2026. We state only what those pages said.
Which registries and audiences suit component libraries?
The first three are places where code is installed from or catalogued. The rest are where React developers hear about it.
01 npm public registry
The registry React developers install libraries from.
- Account
- An npm user account; two-factor authentication can be required for publishing
- Names
- Unscoped packages are always public; a scope under your name or organisation is available
- Provenance
- Provenance statements link a published package to the repository and build that made it
A scope named after your project keeps related packages together, for example a core package and a themes package. Decide it before the first publish, since people will write it into hundreds of import lines.
Publishing with provenance from GitHub Actions is a small trust signal for a library that people will bundle into products. The npm docs describe how.
02 JSR
A registry for JavaScript and TypeScript packages that encourages publishing TypeScript source.
- Format
- ESM only; CommonJS modules cannot be published
- Source
- Supports and encourages TypeScript source rather than .js plus .d.ts pairs
- npm
- A JSR package can depend on npm packages through npm: specifiers
JSR suits a library written in TypeScript with ES modules throughout. If your build still emits CommonJS, publishing there means changing the build, so treat it as a second registry for later, not a first step.
Because it publishes your TypeScript source, the types a user sees are the ones you wrote, not a generated declaration file. That is useful for a library whose whole value is its prop types.
03 shadcn registry directory
The open-source registry index that lets the shadcn CLI find your registry by namespace.
- Route
- Add your registry to directory.json in the shadcn-ui/ui repository, validate it and open a pull request
- Requirements
- Open source and public; a valid registry.json; a flat registry with no nested items
- Review
- Validated and reviewed by the team; publication is immediate once the pull request is merged
The docs say you do not need to be in the directory to use a public GitHub registry with owner/repo/item addresses; the directory is for namespaces such as @acme. So decide whether you need a short namespace before you ask for a listing.
Run the validation command the page names before you open the pull request, and keep each component in its own JSON file at the root. A registry that follows the format is the closest thing to a one-line install for this audience.
04 React Status
A weekly newsletter on React, which describes itself as hand-picked.
- Run since
- August 2016, with 496 issues counted on its homepage when read
- Our check
- We did not find its submission route on the page we read; look for one on its site
A hand-picked newsletter takes what its editors find interesting, so the best submission is a post about a problem and a technique, with the library as the worked example. A bare release note is easy to skip.
The newsletters that feature new products page lists other places where a short pitch can reach an editor.
05 Show HN
Hacker News’s section for things you made that readers can try.
- Fits when
- The docs site lets a reader try components without installing anything
- Skip when
- The library is a thin restyling of an existing one; the guidelines want non-trivial work
Link the playground, not the package page. Readers will judge the library in the first thirty seconds on the page.
Expect questions about accessibility, bundle size and server rendering. Have measured answers ready, and say what you have not tested yet.
06 DevHunt
A launchpad for developer tools whose FAQ lists frameworks and libraries as accepted.
- Free route
- A free permanent page with a nofollow link
- Paid step
- Choosing a launch week
The voters are developers, which suits a library for developers. Add several screenshots of the components in use, since the page asks for a logo and screenshots.
Use the free page as a stable link for your README and decide on the launch week after you have seen how the free page performs.
07 Post your build ideas (our board)
A free launch board with no account and no queue.
- Use
- A permanent page linking to the docs site, with threaded comments
- Limit
- Four images at most; the full screenshots belong on your docs
Name the design language in the first sentence, such as minimal, dense or playful, so a visitor knows at once if it is for them.
If you are still choosing a project, the design tool ideas category and the React project ideas guide list gaps.
What order works for a component library launch?
- Publish the docs site with a playground, and make every component page linkable.
- Publish to npm with provenance; add JSR if your build is ESM and TypeScript.
- If you ship registry items, prepare the shadcn directory pull request in parallel.
- Create the free launch page and DevHunt page so there are two permanent links.
- Write one technical post about a component’s hardest part, and send it to a newsletter.
- Post to Show HN with the playground link when you can stay for the comments.
The React component library playbook gives dates, the UI kit places to launch cover selling design files instead of code, and the Python package guide shows how a different ecosystem splits the same job.
Frequently asked questions
Do I need to be in the shadcn registry directory?
No. The shadcn documentation says you do not need to submit a public GitHub registry to the directory to use it with owner/repo/item addresses. The directory exists for namespaces such as @acme. If you want that shorter form, add your registry to the directory file and open a pull request that the team will validate and review.
Should a React library be published to npm or JSR?
Start with npm, since that is where most React projects install from. Add JSR if your code is TypeScript and ES modules, because JSR accepts only ESM and encourages TypeScript source. A JSR package can also depend on npm packages, so publishing to both is possible without duplicating code.
How do I show a component library without a big audience?
Make the docs site the demo, with each component rendered live beside its code, and link that site from every listing. A small, reachable audience on a free board or a hand-picked newsletter is enough to start. Measure which link brought visitors by tagging each one, then do more of that.
Post your build ideas publishes this page and runs a free launch board that competes with some of the sites it names. Facts about other sites came from their own pages on the date shown above; terms, queues and prices change, so confirm on their sites before you decide. About the publisher.