pascalorg/editor

React Three Fiber と WebGPU で構築した 3D 建物エディタで、BIM・フロアプラン設計に対応しています。

完成アプリ自由に使える · MITWeb・Next.js・フルスタックTypeScript難易度
21,264+0今週0
2,721フォーク22Issue
デモ・公式サイトをひらくeditor.pascal.app

中辛 の解説

スタック: React 19・Next.js 16・Three.js(WebGPU レンダラ)・React Three Fiber・Zustand・Zundo(undo/redo)・Turborepo モノレポ。難易度: 中程度。大規模な Turborepo 構成で、core・viewer・editor・nodes など複数パッケージに分かれています。すぐ使える: npx @pascal-app/cli editor 経由のスタンドアロン実行、または パッケージ導入で React アプリに統合可能です。デモ: GitHub リポジトリに動画あり。

이런 레포예요

이럴 때 쓰면 좋아요

  • 建築家・設計者が BIM データを 3D ビジュアルで作成・編集する際に使用できます。
  • Web ベースの CAD・フロアプランツールの基盤として導入し、カスタム機能を追加できます。
  • AI エージェントと連携して自動設計提案を受け取り、その場で修正するワークフローで活用できます。

핵심 기능

Zustand + Zundo による状態管理とアンドゥ・リドゥ機能WallSystem・SlabSystem など複数の 3D 系処理を useFrame で最適化プラグイン API で機能拡張可能(ノード種・UI パネル・ツール追加)

대안 대비 차별점

MCP サーバ統合と LLM ネイティブな設計フロー、ダーティフラグによるフレーム最適化、オープン API で他の BIM ソフトウェアと連携しやすい設計が特徴です。

食べた人たち

実際に使ってみた人の記録です — 一言も完走の記録も、確認のうえで公開しています。

試食評 · 使った人のひとこと

まだ試食評がありません。使ってみたら、最初のひとことをどうぞ。

ほかのリポジトリの試食評を見る →

이 레포로 만든 것들

🖋 완주 인증하기

아직 이 레포로 만든 완주 인증이 없어요. 첫 밥도장을 찍어보세요!

このリポジトリの作り方

はじめてですか? むずかしくありません — 上から順にたどれば、自分の環境で動かして味見できます。

준비물

  • Node.js 22.13 以上
  • Bun(推奨)または npm/pnpm

すぐ動かしてみるNode.js (bun)

ギット飯がリポジトリの構成を確認して組み立てた実行コマンドです。ターミナルに貼り付ければ、取得から実行までまとめて進みます。

git clone --depth 1 https://github.com/pascalorg/editor.git &&
cd editor &&
bun install &&
bun run dev

コードは自分の環境で動きます — はじめて見るリポジトリなら、中身にひととおり目を通してから実行するのがおすすめです。

README가 안내하는 자세한 단계 보기
  1. Node.js 22.13 以上をインストールしクイックスタートコマンドを実行します
npx @pascal-app/cli editor
  1. または、リポジトリをクローンして開発環境を構築します
git clone https://github.com/pascalorg/editor.git
cd editor
bun install
  1. ルートディレクトリから開発サーバを起動します
bun dev
  1. ブラウザで http://localhost:3002 にアクセスしてエディタを起動します
  2. 本番ビルドが必要な場合は全パッケージをビルドします
turbo build
  1. npm にパッケージを公開する際は対象パッケージをビルドして発行します
turbo build --filter=@pascal-app/core --filter=@pascal-app/viewer
npm publish --workspace=@pascal-app/core --access public

ギット飯トライで味見

入れるのが面倒で少し不安だったなら — 安全スキャンからインストールまで、ターミナル一行で終わります。

ターミナルに貼り付ければ、ギット飯の安全スキャン → 隔離フォルダへ clone → インストール → 実行方法の案内まで自動です。はじめてでも大丈夫 — この一行だけです。

npx gitbap-try pascalorg/editor

Node.js さえあれば、インストールなしで動きます · ギット飯トライとは? →

これを仕事に活かす

味見がすんだら次は応用です — 仕事やビジネスに活かす方法をまとめました。

レシピ — AI にこのまま頼んでみてください

レシピを読み込んでいます…

スター推移 · 7日

21,264+0 / 7일

使いやすさ · まねしやすいか

まねしやすいサンプル評点 46/100
  • ゆるいライセンス
  • テストあり
  • サンプル集
  • 最近の更新
  • AGENTS.md
  • llms.txt
  • テンプレート

最近の更新あり · 2025 年に作成

「웹·Next.js·풀스택」 こういうリポジトリを毎週受け取りませんか?

毎週月曜の朝、選んだ一膳だけ。広告なし · いつでも解除。

自分のリポジトリですか? README にギット飯バッジを貼る
[![깃밥](https://www.gitbap.com/badge/pascalorg/editor.svg)](https://www.gitbap.com/r/pascalorg/editor)
Claude からそのまま使う — ギット飯のつなぎ方

ギット飯を Claude につなぐと、こうしたリポジトリを Claude・Cursor・Codex から直接さがして試せます。

方法 ① コネクタ URL

Claude の設定 → コネクタにこのアドレスを貼り付け。

https://www.gitbap.com/api/mcp
方法 ② プラグイン(試用まで)

プラグインを入れると /gitbap-trending·/gitbap-try のスラッシュコマンドで、その場でリポジトリを試せます。Claude Code で下の 2 行を順に実行してください。

/plugin marketplace add jakeparkcolde/gitbap-cowork
/plugin install gitbap-cowork@gitbap
つなぎ方をくわしく →

AI が README をもとに要約しました · 原文を見る