코드 미리보기

    앱 코드 미리보기 및 생성

    생성된 코드를 미리보고 작업을 Angular 앱으로 다운로드하는 것은 애플리케이션을 설계한 후의 최종 단계입니다. 모든 스타일 및 레이아웃 속성을 포함하여 애플리케이션이 생성되면 디자인 및 개발 사용자 스토리가 완료됩니다.

    코드 미리보기

    미리보기 모드를 사용하면 디자인을 실행 중인 앱인 것처럼 상호작용할 수 있습니다. 예를 들어, 뷰포트의 크기를 조정하여 구성 요소의 위치 지정이 어떻게 동작하는지 확인할 수 있습니다. 하지만 개발자에게 제공하는 실제 가치는 생성될 앱 코드를 미리보는 것입니다. 이를 확인하려면 코드 보기를 켜고 디자인과 나란히 볼 수 있습니다. 읽기 전용 모드이지만 생성된 코드의 품질을 검토하는 데 도움이 됩니다.

    view-code-Indigo-Design-App-Builder

    미리보기 모드에서 코드 보기

    코드 보기를 사용하면 HTML, CSS 및 TS를 별도로 볼 수 있습니다. 이를 통해 픽셀 완벽한 결과물을 만들기 위해 마크업과 CSS를 작성하는 노력을 절약할 수 있습니다. 생성된 코드는 Ignite UI for Angular와 같은 실제 개발자 구성 요소를 사용하므로, 이를 뒷받침하는 포괄적인 개발자 설명서가 있다는 것을 확신할 수 있습니다. 또한 개발자가 시각적 자산을 검사하여 시각적 사양을 추출해야 하는 핸드오프 과정을 건너뛸 수 있으며, 이는 보통 디자이너와 개발자 간의 많은 의사소통과 여러 번의 디자인 폴리싱이 필요합니다.

    preview-files-indigo-design-app-builder

    미리보기 모드에서 HTML, CSS, Typescript 파일 보기

    추가 리소스