{"id":50639704,"url":"https://github.com/yeongseon/kpubdata-studio","last_synced_at":"2026-06-07T07:04:14.818Z","repository":{"id":349255267,"uuid":"1201361105","full_name":"yeongseon/kpubdata-studio","owner":"yeongseon","description":"Korea Public Data Studio — Visual interface for authoring and running KPubData builder workflows","archived":false,"fork":false,"pushed_at":"2026-05-23T00:23:30.000Z","size":253,"stargazers_count":0,"open_issues_count":9,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-05-23T01:24:17.425Z","etag":null,"topics":["dashboard","korea","kpubdata","nextjs","public-data","typescript"],"latest_commit_sha":null,"homepage":"https://yeongseon.github.io/kpubdata-studio","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/yeongseon.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":"ROADMAP.md","authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":"AGENTS.md","dco":null,"cla":null}},"created_at":"2026-04-04T15:18:48.000Z","updated_at":"2026-05-23T00:23:32.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/yeongseon/kpubdata-studio","commit_stats":null,"previous_names":["yeongseon/kpubdata-studio"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/yeongseon/kpubdata-studio","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yeongseon%2Fkpubdata-studio","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yeongseon%2Fkpubdata-studio/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yeongseon%2Fkpubdata-studio/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yeongseon%2Fkpubdata-studio/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/yeongseon","download_url":"https://codeload.github.com/yeongseon/kpubdata-studio/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yeongseon%2Fkpubdata-studio/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34011815,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-07T02:00:07.652Z","response_time":124,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["dashboard","korea","kpubdata","nextjs","public-data","typescript"],"created_at":"2026-06-07T07:03:51.282Z","updated_at":"2026-06-07T07:04:14.806Z","avatar_url":"https://github.com/yeongseon.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# KPubData Studio — Korea Public Data Studio\n\n[![Vite](https://img.shields.io/badge/Vite-8-646CFF)](https://vite.dev/)\n[![TypeScript](https://img.shields.io/badge/TypeScript-5-blue)](https://www.typescriptlang.org/)\n[![License: MIT](https://img.shields.io/badge/license-MIT-green)](LICENSE)\n\n**KPubData Studio (Korea Public Data Studio)**는 KPubData 제품군의 시각적 인터페이스(UI — 사용자가 보고 조작하는 화면)입니다.\n\n이 프로젝트는 사용자가 복잡한 설정 파일을 직접 수정하지 않고도 한국 공공데이터 빌드 과정을 기획, 미리보기, 실행 및 검사할 수 있도록 돕는 웹 기반 작업실입니다.\n\n---\n\n## 소개\n\nKPubData Studio는 `kpubdata-builder` 출판사에서 만드는 **책(데이터셋)을 기획하고 미리보는 작업실**과 같습니다. 코딩 없이 버튼 몇 번으로 어떤 데이터를 가져올지 정하고, 결과가 어떻게 나올지 눈으로 확인하며 최종 출판까지 관리하는 웹 화면입니다.\n\nKPubData Studio는 데이터셋을 설계·미리보기·실행하는 dataset workbench UI입니다.\n\n## 이 프로젝트가 존재하는 이유\n\n한국 공공데이터를 다루는 과정은 종종 복잡하고 기술적인 진입장벽이 존재합니다.\n- **YAML 편집의 어려움**: [YAML](https://ko.wikipedia.org/wiki/YAML)은 들여쓰기로 구조를 표현하는 텍스트 설정 파일인데, 빈칸 하나만 잘못 넣어도 오류가 나서 직접 수정하기 어렵습니다.\n- **시각적 피드백의 부재**: 데이터를 실제로 빌드하기 전에 결과물이 어떻게 보일지 미리 확인하는 기능이 중요합니다.\n- **비개발자 접근성**: 코딩 경험이 없는 사용자나 기획자도 공공데이터 처리 과정을 손쉽게 구성하고 관리할 수 있어야 합니다.\n\n## 핵심 개념\n\n| 용어 | 설명 |\n| :--- | :--- |\n| **Draft** | 아직 저장되지 않은 임시 기획 상태 (편집 중) |\n| **Build Run** | 실제로 빌드를 돌려 데이터를 가져오는 과정 |\n| **Preview** | 빌드 결과물을 미리 눈으로 확인하는 화면 |\n| **State Model** | 기획(Draft)부터 실행(Run), 출판(Publish)까지의 상태 흐름도 |\n| **Studio Shell** | 전체 웹 화면을 구성하는 기본 틀과 내비게이션 |\n| **UI Spec** | 화면의 각 요소가 어떻게 보이고 반응해야 하는지에 대한 약속 |\n\n## 상태 모델 (State Model)\n\n사용자가 작업을 시작하면 데이터는 다음 순서로 상태가 변합니다:\n\n```mermaid\nstateDiagram-v2\n    [*] --\u003e Draft: 수정 중\n    Draft --\u003e Build_Run: 실행 버튼 클릭\n    Build_Run --\u003e Published: 검증 및 전송 완료\n    Build_Run --\u003e Draft: 실패 시 수정\n    Published --\u003e [*]\n```\n\n- **Draft**: 사용자가 내용을 고치고 있는 상태입니다. (수정 중)\n- **Build Run**: '실행' 버튼을 눌러 실제로 데이터를 모으는 중입니다.\n- **Published**: 모든 검증을 마치고 결과물이 공유된 상태입니다.\n\n## 기술 스택\n\n| 기술 | 버전 | 설명 |\n| :--- | :--- | :--- |\n| **[Vite](https://vite.dev/)** | 8 | 빠른 개발 서버와 번들링을 제공하는 프런트엔드 빌드 도구 |\n| **[React](https://ko.react.dev/)** | 19 | 화면을 작은 조각(컴포넌트)으로 나누어 만드는 UI 라이브러리 |\n| **[React Router](https://reactrouter.com/)** | 7 | 브라우저에서 클라이언트 사이드 라우팅을 담당하는 내비게이션 라이브러리 |\n| **[TanStack Query](https://tanstack.com/query)** | 5 | 서버 상태를 관리하고 Builder API 데이터를 가져오며 캐싱하는 데이터 패칭 라이브러리 |\n| **[Zustand](https://zustand-demo.pmnd.rs/)** | 5 | 경량 전역/로컬 UI 상태를 관리하는 스토어로, 편집기 임시 저장과 UI 세션 상태에 사용 |\n| **[TypeScript](https://www.typescriptlang.org/ko/docs/)** | 5 | 자바스크립트에 타입(자료형)을 추가하여 실수를 줄여주는 언어 |\n| **[Tailwind CSS](https://tailwindcss.com/docs)** | 4 | HTML에 직접 디자인 클래스를 적용하는 스타일링 도구 |\n\n## 설치 및 실행 방법\n\n개발 환경을 설정하려면 [npm](https://docs.npmjs.com/about-npm)(Node.js 패키지 관리 도구)을 사용하여 다음 명령어를 실행하세요:\n\n```bash\ngit clone https://github.com/yeongseon/kpubdata-studio.git\ncd kpubdata-studio\nnpm install\nnpm run dev\n```\n\n`npm run dev`는 Vite 개발 서버를 실행합니다. 그 후 브라우저에서 [http://localhost:5173](http://localhost:5173)을 엽니다.\n\n## 주요 기능 소개\n\n- **빌드 기획서 작성**: 화면에서 클릭과 입력만으로 데이터셋 빌드 규칙을 간편하게 설정합니다.\n- **실시간 미리보기**: 설정한 규칙에 따라 데이터가 어떤 모습으로 정리될지 즉시 확인합니다.\n- **빌드 실행 및 모니터링**: `kpubdata-builder`와 연동하여 실제 데이터 수집 과정을 실시간으로 추적합니다.\n- **결과물 검사**: 생성된 데이터 파일의 구조와 내용을 눈으로 확인하고 검사합니다.\n\n## 애플리케이션 실행 흐름\n\n```mermaid\ngraph TD\n    Main[src/main.tsx] --\u003e App[src/app/App.tsx]\n    App --\u003e Router[src/app/router.tsx]\n    Router --\u003e Pages[src/pages/*]\n    Pages --\u003e Features[src/features/*]\n    Features --\u003e Shared[src/shared/*]\n    Features --\u003e Entities[src/entities/*]\n    Features --\u003e BuilderAPI[Builder API]\n```\n\n```text\nsrc/main.tsx -\u003e src/app/App.tsx -\u003e src/app/router.tsx -\u003e src/pages/* -\u003e src/features/* -\u003e Builder API\n```\n\n## 파일 구조 가이드\n\n```mermaid\ngraph TD\n    src[src/] --\u003e main[main.tsx]\n    src --\u003e app[app/: 앱 조립 및 라우터]\n    src --\u003e pages[pages/: 라우트 단위 페이지]\n    src --\u003e features[features/: 기능별 모듈]\n    src --\u003e shared[shared/: 공통 유틸/타입/UI]\n    src --\u003e entities[entities/: 핵심 도메인 모델]\n\n    app --\u003e AppFile[App.tsx]\n    app --\u003e RouterFile[router.tsx]\n    features --\u003e FeatureApi[features/*/api/index.ts]\n```\n\n```text\nsrc/\n├── main.tsx                    # Vite 엔트리 포인트\n├── app/\n│   ├── App.tsx                # RouterProvider 연결\n│   └── router.tsx             # React Router 설정 및 App Shell\n├── pages/                     # 라우트 단위 페이지 컴포넌트\n├── features/                  # 기능별 UI/API/상태 모듈\n│   └── */api/index.ts         # 기능별 Builder API 연동 진입점\n├── shared/                    # 공통 config, hooks, lib, types, ui\n└── entities/                  # build, dataset, manifest, artifact 도메인 모델\n```\n\n## 개발 스크립트\n\n| 스크립트 | 설명 |\n| :--- | :--- |\n| `npm run dev` | Vite 개발 서버 실행 |\n| `npm run lint` | ESLint 검사 |\n| `npm test` | Vitest 테스트 실행 |\n| `npm run build` | Vite 프로덕션 빌드 |\n| `npm run preview` | 빌드 결과 로컬 프리뷰 |\n\n---\n\n## 문서 가이드 (Document Guide)\n\n### 핵심 설계\n| 문서 | 설명 |\n| :--- | :--- |\n| [ARCHITECTURE.md](./ARCHITECTURE.md) | Studio 시스템 아키텍처 및 설계 원칙 |\n| [STATE_MODEL.md](./STATE_MODEL.md) | 빌드 상태 전이 및 UI 상태 관리 모델 |\n| [UI_SPEC.md](./UI_SPEC.md) | 사용자 인터페이스 컴포넌트 및 디자인 규격 |\n| [USER_FLOWS.md](./USER_FLOWS.md) | 주요 사용자 시나리오 및 화면 흐름도 |\n| [INFORMATION_ARCHITECTURE.md](./INFORMATION_ARCHITECTURE.md) | 메뉴 구조 및 데이터 계층 구조 |\n| [API_CONTRACT.md](./API_CONTRACT.md) | Builder API와의 통신 규약 및 데이터 모델 |\n\n### 개발 가이드\n| 문서 | 설명 |\n| :--- | :--- |\n| [AGENTS.md](./AGENTS.md) | AI 에이전트 협업 가이드 및 프롬프트 지침 |\n| [CONTRIBUTING.md](./CONTRIBUTING.md) | 프로젝트 기여 방법 및 개발 환경 설정 |\n\n### 프로젝트 관리\n| 문서 | 설명 |\n| :--- | :--- |\n| [PRD.md](./PRD.md) | 제품 요구사항 정의 및 목표 |\n| [ROADMAP.md](./ROADMAP.md) | 향후 개발 계획 및 마일스톤 |\n\n### 자세한 참고\n| 문서 | 설명 |\n| :--- | :--- |\n| [docs/adrs/0001-studio-as-control-surface.md](./docs/adrs/0001-studio-as-control-surface.md) | 결정 기록: Studio를 제어 인터페이스로 정의 |\n| [제품군 전체 아키텍처](https://github.com/yeongseon/kpubdata/blob/main/docs/product-family-architecture.md) | **KPubData 3개 저장소의 전체 시스템 아키텍처** |\n\n---\n\n## KPubData Product Family\n\n| 패키지 | 역할 |\n| :--- | :--- |\n| [kpubdata](https://github.com/yeongseon/kpubdata) | 한국 공공데이터 접근 + 파싱 + 정규화 코어 |\n| [kpubdata-builder](https://github.com/yeongseon/kpubdata-builder) | 데이터셋 조립 + 내보내기 파이프라인 |\n| [kpubdata-studio](https://github.com/yeongseon/kpubdata-studio) | 빌드 작성 및 실행을 위한 시각적 인터페이스 |\n\n---\n\n## 관련 문서\n\n### 이 저장소 내 문서\n| 문서 | 설명 |\n| :--- | :--- |\n| [ARCHITECTURE.md](./ARCHITECTURE.md) | 시스템 아키텍처 설계 |\n| [STATE_MODEL.md](./STATE_MODEL.md) | 상태 관리 모델 |\n| [UI_SPEC.md](./UI_SPEC.md) | UI 디자인 규격 |\n| [USER_FLOWS.md](./USER_FLOWS.md) | 사용자 흐름도 |\n| [INFORMATION_ARCHITECTURE.md](./INFORMATION_ARCHITECTURE.md) | 정보 구조 설계 |\n| [API_CONTRACT.md](./API_CONTRACT.md) | API 연동 규약 |\n| [AGENTS.md](./AGENTS.md) | 에이전트 가이드 |\n| [CONTRIBUTING.md](./CONTRIBUTING.md) | 기여 가이드 |\n| [PRD.md](./PRD.md) | 제품 요구사항 |\n| [ROADMAP.md](./ROADMAP.md) | 개발 로드맵 |\n\n### KPubData Product Family\n| 저장소 | 문서 | 설명 |\n| :--- | :--- | :--- |\n| [kpubdata](https://github.com/yeongseon/kpubdata) | [ARCHITECTURE.md](https://github.com/yeongseon/kpubdata/blob/main/ARCHITECTURE.md) | Core 아키텍처 |\n| [kpubdata-builder](https://github.com/yeongseon/kpubdata-builder) | [ARCHITECTURE.md](https://github.com/yeongseon/kpubdata-builder/blob/main/ARCHITECTURE.md) | Builder 아키텍처 |\n\n---\n\n## 초기 배포 목표\n\n- **v0.1**: Vite + React SPA 셸 구성, React Router 기반 화면 전환, feature 기반 모듈 구조 정착, Builder API 연동 기초 작업\n- **v0.2**: 실시간 미리보기 기능, 데이터 검증 뷰, 빌드 결과물 뷰어 구현\n- **v0.3**: 최종 게시(Publish) 워크플로우 완성 및 전체 프로젝트 대시보드 제공\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyeongseon%2Fkpubdata-studio","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyeongseon%2Fkpubdata-studio","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyeongseon%2Fkpubdata-studio/lists"}