bidyut10/opensourceui
Developer toolsこのページは AI により自動翻訳されています。技術的な詳細は原文をご確認ください。 原文を見る
オープンソースUI:ReactおよびNext.js向けの無料、オープンソース、本番環境対応のコンポーネント。TypeScript、Tailwind CSS、lucideアイコンで動作します
概要
Tailwind CSSとTypeScriptで構築されたプレミアムフリーのReact/Next.jsコンポーネント。サブスクリプションもペイウォールもありません。/componentsでライブプレビュー、セットアップガイド、コピーレディソースを閲覧できます。 ほとんどのUIキットは見た目が似ているか、1つのボタンを使う前にシステム全体を覚えなければならないものです。私は実際に自分の仕事に近いものが欲しかったです。見た目が良いコンポーネントを見つけて、そのファイルをプロジェクトに入れ、小道具を調整して次に進む、という感じです。 これらのコンポーネントはコピー用で、パッケージとしてインストールするものではありません。プロバイダーラッパーも、テーマ設定もデコードできません。各ファイルは自己完結型です。 アイコンはアイコン/—追加のnpmパッケージは使わず、単なるSVGのReactコンポーネントです。私もそれらを併用して使 nexticons.in。 オープンソースUIはコーディングエージェント—Cursor、Claude Code、Codex、Copilot、Grok、ChatGPTなど—と連携します。 エージェントキットはスキルワークフローと参照ドキュメント(カタログ、設計システム、実装ガイド、ファイルインベントリ)を含み、存在しています。ツールごとのセットアップ手順や例示プロンプトについてはこちらをご覧ください。
概要（AI 翻訳）
プロジェクトにコピーする無料のReactとNext.js UI。200+コンポーネント、30カテゴリ**、TypeScript、Tailwind CSS v4、ライブプレビュー。個人用・商用用MITで、インストール不要、後でペイウォールもありません。
カタログは opensourceui.in/components でご覧いただけます。
なぜコピー&ペーストするのか
ほとんどのキットは、1つのボタンを使う前にシステムを覚えることを求めます。これらのパーツはコピーするものであって、インストールするものではありません:コンポーネントを見つけてファイルを貼り付け、小道具を調整し、出荷するだけです。プロバイダーの設定もテーマ設定も不要です。
クイックスタート
Node.js 22.x。
| コマンド | 何をするか |
|---|---|
npm run dev |
開発サーバー |
npm run build |
静的エクスポート out/(先にcheck:showcaseを実行する) |
npm run lint |
ESLint |
npm run typecheck |
tsc --noEmit |
npm run format |
より綺麗で、テイルウィンドクラスのソート |
npm run test |
ビテストのユニットテスト |
npm run verify |
フルゲート:フォーマット、リント、タイプ、カタログ、デザイン、テスト、製作、劇作家 |
このページは AI により自動翻訳されています。技術的な詳細は原文をご確認ください。
README
以下は原文 README の抜粋です。原文を見る。
Opensource UI
Free React and Next.js UI you copy into your project. 200+ components across 30 categories, TypeScript, Tailwind CSS v4, and live previews. MIT for personal and commercial use — no package to install, and no paywall later.
Browse the catalog at opensourceui.in/components.
Why copy-paste
Most kits ask you to learn a system before one button is usable. These pieces are meant to be copied, not installed: find a component, paste the file, tweak props, and ship. No provider setup and no theme config.
Quick start
Node.js 22.x.
git clone https://github.com/bidyut10/opensourceui.git
cd opensourceui
npm install
npm run dev
- Homepage: http://localhost:3000
- Catalog: http://localhost:3000/components
| Command | What it does |
|---|---|
npm run dev |
Dev server |
npm run build |
Static export to out/ (runs check:showcase first) |
npm run lint |
ESLint |
npm run typecheck |
tsc --noEmit |
npm run format |
Prettier, with Tailwind class sorting |
npm run test |
Vitest unit tests |
npm run verify |
Full gate: format, lint, types, catalog, design, tests, build, Playwright |
npm run verify:quick |
Same gate without build and end-to-end tests |
Husky runs Prettier and ESLint on commit, then npm run verify on push. GitHub CI runs the same checks.
Use a component
There is no opensourceui npm package. Copy the file from components/, then bring along whatever that file imports:
lib/cn.ts, plusclsxandtailwind-merge- Matching files from
icons/ lucide-react, when the source imports it
推奨ツール
別のキーワードを試すか、フィルタを外してください。
インストール
npx skillfish add bidyut10/opensourceui