UI Builder 용어집

  • 릴리스 버전: Washingtondc
  • 업데이트 날짜 2024년 02월 01일
  • 읽기8분
  • UI Builder(UIB)에 고유한 용어 및 개념에 대해 알아봅니다.

    동작

    작업은 플랫폼의 ServiceNow® 일부입니다. UI 빌더의 작업은 구체적으로 페이지 또는 페이지 구성요소 내에서의 활동입니다. 이벤트 및 이벤트 처리기는 작업을 추가하는 데 사용됩니다. 예를 들어, 페이지에 단추 구성 요소를 추가한 다음, 웹 페이지를 여는 것과 같은 단추에 대한 작업을 적용하는 이벤트 처리기를 추가합니다.

    앱 셸

    앱 셸은 웹 환경의 정적 요소(예: 머리글, 바닥글 및 메뉴 탐색)로, 최종 사용자가 환경 전체를 탐색할 때 함께 유지됩니다. 앱 셸은 주로 작업 공간 및 포털 환경에서 사용되고 지원됩니다.

    바인드

    데이터 바인딩을 참조하십시오.

    브랜딩

    테마를 참조하십시오.

    CSS 스타일시트(CSS)

    CSS 스타일시트는 웹 표준 스타일시트 언어입니다. UI Builder에서 CSS는 작업 공간 또는 포털 경험의 구성요소 또는 페이지의 시각적 스타일을 변경하는 데 사용됩니다. 예를 들어, 페이지 또는 컨테이너 구성요소에 배경색을 추가합니다.

    CSS 사용자 지정 속성도 참조하십시오.

    클라이언트 스크립트

    페이지의 구성요소 및 클라이언트 상태 매개변수와 상호작용하는 클라이언트측 JavaScript 클라이언트 스크립트는 UI Builder의 이벤트 및 이벤트 핸들러에 매핑됩니다. 예를 들어, 목록 구성요소에서 클라이언트 스크립트가 있는 버튼을 추가하여 목록에서 열린 기록과 닫힌 기록 사이를 전환합니다. UI Builder에 통합된 Now 코드 편집기를 사용하여 클라이언트 스크립트를 추가합니다.

    클라이언트 상태 매개변수

    해당 페이지에 대한 데이터(클라이언트 상태)만 저장하기 위해 페이지에 대해 정의된 페이지 변수입니다. 예를 들어, 기록을 생성하는 데 필요한 입력을 저장하는 세 개의 클라이언트 상태 매개변수를 생성하고 목록을 새로 고칠 시기를 지정합니다. 클라이언트 스크립트와 이벤트를 사용해 페이지 변수를 업데이트하여 페이지를 동적으로 만들 수 있습니다.

    구성요소

    구성요소의 UI Builder 라이브러리를 사용하여 페이지를 빌드합니다. 구성요소에는 최종 사용자가 보고 상호 작용할 수 있는 인터페이스가 있습니다. 구성 요소는 이벤트와 속성을 통해 서로 통신할 수 있습니다. 일반적으로 사용되는 구성 요소에는 제목, 이미지, 목록, 양식 및 버튼이 있습니다.

    구성요소 수식 편집기

    수식을 바인딩하거나 변경할 때 사용합니다. 텍스트, 데이터 바인딩 또는 수식을 입력합니다. 편집기는 논리, 산술, 비교, 부정 및 함수 변환 유형을 지원합니다.

    구성요소 ID

    스크립트를 추가하거나 데이터를 구성요소에 바인딩할 때 구성요소를 참조하는 데 사용됩니다. 구성요소를 페이지에 추가하면 구성요소 레이블에 따라 구성요소 ID가 자동으로 생성되지만 구성요소 ID를 편집할 수 있습니다.

    구성요소 사전 설정

    미리 정의된 구성 값과 이벤트 매핑을 구성요소에 적용하는 데 사용합니다. 사전 설정은 사전 구축된 구성을 구성요소 속성 및 이벤트 핸들러에 적용합니다. 사전 설정은 특정 구성 요소에만 사용할 수 있습니다.

    구성요소 속성

    구성 패널에서 사용할 수 있으며 구성 요소를 구성하는 데 사용됩니다. 각 구성 요소에는 고유한 속성이 있습니다. 구성요소 속성은 구성 패널의 각 탭(구성, 스타일 및 이벤트)에서 지정됩니다. 일부 구성 요소에는 사전 설정을 사용할 수 있습니다. 구성요소 사전 설정을 사용하여 구성요소 속성을 자동으로 설정합니다.

    복합 데이터 자원

    여러 데이터 리소스(예: GraphQL 및 변환)를 재사용 가능한 단일 데이터 리소스로 결합합니다.

    구성 가능한 작업 공간

    클래식 환경 양식과 목록을 대체한 새로운 작업 방식입니다. 구성 가능한 작업 공간은 Next Experience UI 이전에 도입되었지만 별도의 브라우저 탭에서 열렸습니다.

    컨트롤러
    데이터 및 이벤트 논리를 포함하고 구성요소 사전 설정을 활성화하는 데이터 자원의 유형입니다. 컨트롤러는 페이지 템플릿을 사용할 때 자동으로 추가됩니다. 컨트롤러에는 두 가지 유형이 있습니다.
    • 데이터 컨트롤러는 데이터 자원을 포함하며 페이지에 수동으로 추가할 수 있습니다
    • UI 컨트롤러는 페이지 템플릿을 사용할 때 페이지에 추가되며 수동으로 추가할 수 없습니다. 컨트롤러 만들기는 현재 지원되지 않습니다.
    CSS

    CSS(Cascading Style Sheet)를 참조하십시오.

    CSS 사용자 지정 속성

    테마 설정에 사용할 수 있는 Next Experience 고객 CSS 속성입니다.

    데이터 바인딩

    데이터(테이블, 기록 또는 페이지의 다른 요소에서)를 정보를 표시하는 UI 요소와 연결하는 프로세스입니다.

    데이터 자원

    페이지와 서버 간의 중재자 역할을 합니다. 데이터 자원은 데이터를 가져와 구성요소를 채우고 사용자 상호작용을 기반으로 서버 데이터를 업데이트합니다. 데이터 자원 유형에는 컨트롤러(데이터 컨트롤러 및 UI 컨트롤러), GraphQL, 변환, 클라이언트 상태, 복합 및 REST가 포함됩니다.

    데이터 시각화

    차트 또는 그래프(예: 단일 점수 또는 열 그래프)로 데이터를 봅니다. 뷰어에 따라 다른 데이터를 표시하도록 데이터 시각화를 구성할 수 있습니다.

    엔티티 뷰 작업 매퍼(EVAM)

    카드와 목록에 다양한 데이터 소스가 표시되는 방식을 표준화하는 애플리케이션입니다. UI Builder는 EVAM 데이터 소스를 사용하여 구성요소의 정보를 카드 그리드 뷰 또는 정보 목록으로 표시합니다.

    이벤트

    UI Builder 이벤트를 참조하십시오.

    이벤트 핸들러

    구성요소, 페이지 또는 데이터 자원에서 이벤트가 트리거될 때 수행되는 작업입니다.

    이벤트 매핑

    이벤트가 발생할 때 실행할 이벤트 핸들러를 식별하는 프로세스입니다. 구성요소, 페이지 또는 데이터 자원 이벤트에 하나 또는 여러 개의 이벤트 핸들러를 추가합니다.

    플렉스 박스

    UI Builder의 1차원 페이지 레이아웃 시스템입니다. 컨텐츠 또는 구성요소를 행별(왼쪽에서 오른쪽 또는 오른쪽에서 왼쪽) 또는 열별(위/아래 또는 아래/위)로 페이지에 추가할 수 있습니다.

    GraphQL

    API에 대한 오픈 소스 쿼리 언어입니다. UI 빌더에서 GraphQL 데이터 자원은 GraphQL 쿼리 및 변형을 실행합니다.

    iFrame

    문서 내에서 다른 HTML 페이지를 로드하는 HTML 요소입니다.

    레이아웃

    (밴쿠버 이전 릴리스) 컨테이너 내에서 구성요소를 정렬하는 방법을 제어합니다. 컨테이너에 구성 요소를 추가한 후 그리드(Flexbox가 기본 레이아웃임)를 사용하는 것과 같은 고급 방식으로 레이아웃을 구성할 수 있습니다.

    (Vancouver 이상 릴리스) 구성요소를 정렬하기 위해 페이지에 추가할 수 있는 요소입니다.

    Macroponent

    UI Builder 페이지를 구동하는 핵심 데이터 구조입니다. 필드에는 페이지를 빌드하는 JSON이 포함되어 있습니다.

    이벤트 매핑

    이벤트 매핑을 참조하십시오.

    모달

    작업이 수행될 때까지 사용자가 페이지의 나머지 부분을 사용하지 못하게 하는 페이지 오버레이입니다. 예를 들어 사용자가 기록을 삭제하는 버튼 구성요소를 선택하면 작업 확인을 요청하는 모달을 추가할 수 있습니다.

    알림

    어떤 일이 발생했음을 ServiceNow 사용자에게 알리기 위해 인스턴스에서 보낸 통신(이메일, 짧은 메시지 서비스, 알림 또는 푸시 알림)입니다.

    Now 코드 편집기

    CSS, HTML, JavaScript, XML 및 JSON을 지원하는 서식 있는 텍스트 편집기입니다. Now 코드 편집기를 사용하여 Next Experience UI Builder 구성요소에서 UI 구성, 데이터 자원 구성, 스타일, 이벤트, 클라이언트 측 스크립트 및 서버 측 스크립트를 변경합니다.

    페이지

    UI 빌더 페이지를 참조하십시오.

    페이지 컬렉션

    탭 또는 모달 내의 경험에서 재사용할 수 있는 페이지 그룹입니다.

    팝오버

    사용자가 페이지의 나머지 부분을 계속 사용할 수 있도록 하는 페이지 오버레이입니다. 팝오버는 텍스트, 구성요소, 이미지, 필드 및 메뉴 항목이 있는 UI Builder 페이지와 마찬가지로 구성할 수 있습니다.

    사전 설정

    구성 요소 사전 설정을 참조하십시오.

    반복자

    여러 구성요소에서 제공하는 데이터를 반복하는 기본 루프 역할을 하는 구성요소입니다. 반복자는 배열 또는 객체 배열을 사용합니다. 반복자는 값을 데이터 배열 속성에 바인딩합니다. 예를 들어 [{"task": "A"},{"task": "B"}]는 그 안의 콘텐츠를 두 번 반복합니다.

    서로 다른 데이터 세트 사이를 탐색하기 위한 가로 또는 세로 탭 메뉴를 표시하는 구성요소입니다.

    템플릿(페이지)

    UI Builder 페이지를 채우기 위해 미리 정의된 값입니다. 템플릿을 사용하여 페이지를 더 빠르게 만들 수 있습니다.

    테마

    기본 색상, 보조 색상, 로고 및 글꼴을 포함하여 환경에 있는 모든 UI Builder 페이지의 시각적 스타일입니다.

    변환

    스크립트를 사용하여 입력 데이터를 다른 형식으로 변환하는 데이터 자원의 유형입니다. JSON 형식으로 속성을 지정합니다.

    UI Builder

    개발자가 Next Experience UI Framework 구성요소를 사용하여 새 페이지를 작성하거나 기존 페이지를 사용자 지정할 수 있는 웹 인터페이스 작성기입니다.

    UI Builder 이벤트

    사용자가 수행하는 동작(예: 버튼 선택) 또는 페이지에서 발생하는 항목입니다. 대부분의 UI Builder 구성요소, 페이지 및 데이터 자원에는 기본적으로 연결된 이벤트가 있습니다. 이벤트와 함께 이벤트 핸들러를 사용하여 페이지에 추가 작업을 추가합니다.

    UI 빌더 페이지
    열 레이아웃, 열 및 구성요소의 컬렉션입니다. 작업 공간 및 포털 환경을 위해 여러 UI Builder 페이지를 만들거나 사용자 지정합니다.
    변형

    역할 또는 조건에 따라 통제되는 접근 권한이 있는 UI Builder 페이지의 버전입니다. 페이지의 변형을 생성하여 다양한 대상의 경험을 대상으로 합니다. 예를 들어, 에이전트용 홈페이지와 관리자를 위한 변형을 같은 URL에서 만듭니다. 또는 사용자가 다른 조건에서 볼 수 있는 페이지 변형을 만듭니다.

    뷰포트

    UI Builder에서 상위 페이지를 소유할 필요 없이 환경을 확장할 수 있는 특수 구성요소입니다. 뷰포트 구성요소를 페이지에 추가하거나, 페이지에 뷰포트 지원 탭을 추가하거나, 상황별 사이드바 구성요소에 뷰포트를 추가하는 세 가지 방법으로 뷰포트를 사용할 수 있습니다.

    워크플레이스

    애플리케이션 사용자 유형에 대한 대상 지정 경험입니다. 사용자가 애플리케이션과 상호작용할 수 있도록 하는 구성요소를 포함합니다.