Skip to content

뷰 디자이너

Doggy 뷰 디자이너는 시각적 페이지 레이아웃 도구로, 드래그 앤 드롭 설계, 데이터 소스 바인딩, 실시간 미리보기, AI 강화, 버전 관리를 지원합니다.

개요

뷰 시스템은 다음 엔티티 기반으로 구축됩니다(src/Entity/Platform/):

  • View.php: 뷰 정의(레이아웃 설정, 데이터 소스, 버전 정보)
  • ViewField.php: 뷰 내 각 필드의 설정

관리 진입점은 App\Controller\Admin\Platform\ViewEditorController, API 진입점은 ViewEditorApiController입니다.

뷰 구조

View
├── 레이아웃 설정(그리드 행/열)
├── 필드 바인딩(ViewField)
│   ├── 데이터 테이블
│   ├── 폼
│   ├── 통계 카드
│   └── 텍스트 콘텐츠
├── 데이터 소스 설정
└── 버전 디렉터리(1_0/, 2_0/...)

사용 방법

  1. 로우코드 플랫폼 → 뷰 관리(/admin/platform/view)로 이동
  2. 새 뷰 클릭
  3. 뷰 레이아웃 편집(editor.html.twig)
  4. 컴포넌트 속성과 데이터 소스 설정
  5. 효과 미리보기(editor_section_properties.html.twig)
  6. 저장 후 게시

AI 강화

뷰 편집기는 AI 어시스턴트와 심층 통합됩니다:

  • 플로팅 AI 패널: 모든 페이지 우하단 플로팅 버튼으로 열기
  • 컨텍스트 등록: 편집기가 view_editor 컨텍스트 자동 등록
  • 자연어 조작: "이 텍스트를 제목 스타일로 바꿔줘"
  • 도구 호출: view.getInfo, view.updateSectionConfig, view.updateFieldConfig, view.listEntityFields
  • 의도 인식 + 서브 Agent: 원클릭으로 폼/보고서/랜딩 페이지 등 시나리오 뷰 생성(AI 뷰 강화 참조)

또한 Tailwind CSS 레이아웃 보조(Twind 런타임 기반)를 지원합니다:

  • 빠른 레이아웃: flex/grid/간격/너비·높이 등 utility class
  • 기존 inline style과 공존, 충돌 없음
  • 프로덕션 프론트엔드는 필요 시 로드, 빌드 단계 없음

데이터 소스 바인딩

뷰 데이터 소스는 DataSource.php 엔티티로 설정하며 다음을 지원합니다:

  • 엔티티 데이터 소스: 동적 모델의 데이터 바인딩
  • API 데이터 소스: 커스텀 API 호출
  • 정적 데이터 소스: 고정 데이터

코드 생성

뷰를 저장하면 시스템이 해당 Twig 템플릿 파일을 templates/views/ 디렉터리에 생성합니다:

templates/views/
├── hello/
│   └── 1_0/
│       ├── hello.html.twig
│       └── hello.design.twig
└── 조직 구조/
    └── post_management/
        └── 1_0/
            ├── post_management.html.twig
            └── post_management.design.twig

생성된 템플릿은 바로 사용하거나 2차 개발할 수 있습니다.

버전 관리

뷰는 다중 버전 관리를 지원합니다(각 버전은 독립된 twig 파일 세트에 대응):

  • 버전 전환: 특정 버전을 현재 버전으로 활성화
  • 새 버전 추가: 현재 버전에서 복사 또는 빈 버전 생성
  • 뷰 삭제 시 휴지통으로 이동(복원 가능)
  • 편집기는 버전 단위로 작업하며 ?version=...을 명시적으로 지정 가능

관련 서비스

  • FormFieldBuilderService.php: 폼 필드 구성
  • ViewFolderType.php, ViewType.php: 폼 유형 정의
  • AiChatController.php: AI 대화 인터페이스
  • ViewAiTaskApiController.php: AI 강화 작업 인터페이스

MIT 라이선스 오픈소스 | Copyright © 2026 Doggy