콘텐츠 조각 모델 정의

이 장에서는 를 사용하여 콘텐츠를 모델링하고 스키마를 구축하는 방법을 알아봅니다 컨텐츠 조각 모델. 모델의 일부로 스키마를 정의하는 데 사용할 수 있는 다양한 데이터 유형에 대해 알아봅니다.

두 가지 간단한 모델을 만듭니다. 팀 및 개인. 다음 팀 데이터 모델에는 이름, 약식 이름 및 설명이 있으며 개인 전체 이름, 생체 정보, 프로필 사진 및 직업 목록이 있는 데이터 모델.

또한 기본 단계에 따라 나만의 모델을 만들고 GraphQL 쿼리 및 React 앱 코드와 같은 각 단계를 조정하거나 이러한 장에 설명된 단계를 따를 수도 있습니다.

사전 요구 사항

이 자습서는 여러 부분으로 나뉘어져 있으며 AEM 작성자 환경을 사용할 수 있습니다..

목표

  • 콘텐츠 조각 모델을 만듭니다.
  • 모델 구축에 사용할 수 있는 데이터 유형 및 유효성 검사 옵션을 식별합니다.
  • 콘텐츠 조각 모델이 를 정의하는 방법 이해 모두 콘텐츠 조각에 대한 데이터 스키마 및 작성 템플릿.

프로젝트 구성 만들기

프로젝트 구성은 특정 프로젝트와 관련된 모든 콘텐츠 조각 모델을 포함하며 모델을 구성하는 수단을 제공합니다. 하나 이상의 프로젝트를 만들어야 합니다. 다음 이전 콘텐츠 조각 모델을 만드는 중입니다.

  1. AEM에 로그인 작성자 환경(예: https://author-pYYYY-eXXXX.adobeaemcloud.com/)

  2. AEM 시작 화면에서 다음으로 이동합니다. 도구 > 일반 > 구성 브라우저.

    구성 브라우저로 이동

  3. 클릭 만들기, 오른쪽 상단 모서리

  4. 그 결과로 표시되는 대화 상자에서 다음을 입력합니다.

    • 제목*: 내 프로젝트
    • 이름*: 내 프로젝트 (하이픈을 사용하여 모든 소문자를 사용하여 단어를 구분합니다. 이 문자열은 클라이언트 애플리케이션이 요청을 수행하는 고유한 GraphQL 엔드포인트에 영향을 줍니다.)
    • 확인 컨텐츠 조각 모델
    • 확인 GraphQL 지속 쿼리

    내 프로젝트 구성

콘텐츠 조각 모델 만들기

그런 다음 의 두 모델을 만듭니다. 팀 및 a 개인.

개인 모델 만들기

에 대한 모델 만들기 개인: 팀의 일부인 사용자를 나타내는 데이터 모델입니다.

  1. AEM 시작 화면에서 다음으로 이동합니다. 도구 > 일반 > 컨텐츠 조각 모델.

    콘텐츠 조각 모델 로 이동

  2. 다음으로 이동 내 프로젝트 폴더를 삭제합니다.

  3. 누르기 만들기 오른쪽 상단 모서리에서 모델 만들기 마법사.

  4. 위치 모델 제목 필드, 입력 개인 및 탭 만들기. 그 결과로 표시되는 대화 상자에서 열기​를 클릭하여 모델을 구축합니다.

  5. 드래그 앤 드롭 한 줄 텍스트 요소를 기본 패널에 추가합니다. 에서 다음 속성을 입력합니다. 속성 탭:

    • 필드 레이블: 전체 이름
    • 속성 이름: fullName
    • 확인 필수

    전체 이름 속성 필드

    다음 속성 이름 은 AEM에 지속되는 속성의 이름을 정의합니다. 다음 속성 이름 다음을 정의합니다. key 데이터 스키마의 일부로 이 속성의 이름입니다. 이 key 콘텐츠 조각 데이터가 GraphQL API를 통해 노출되는 경우 사용됩니다.

  6. 탭 데이터 유형 을(를) 탭하고 드래그 앤 드롭 여러 줄 텍스트 필드 아래 전체 이름 필드. 다음 속성을 입력합니다:

    • 필드 레이블: 전기
    • 속성 이름: biographyText
    • 기본 유형: 리치 텍스트

  7. 다음을 클릭합니다. 데이터 유형 을(를) 탭하고 드래그 앤 드롭 콘텐츠 참조 필드. 다음 속성을 입력합니다:

    • 필드 레이블: 프로필 사진
    • 속성 이름: profilePicture
    • 루트 경로: /content/dam

    구성 시 루트 경로​를 클릭하고 폴더 아이콘 : 경로를 선택하는 모달을 표시합니다. 이로 인해 작성자가 경로를 채우는 데 사용할 수 있는 폴더가 제한됩니다. /content/dam 모든 AEM Assets(이미지, 비디오, 기타 콘텐츠 조각)가 저장되는 루트입니다.

  8. 에 유효성 검사 추가 그림 참조 의 콘텐츠 유형만 이미지 를 사용하여 필드를 채울 수 있습니다.

    이미지로 제한

  9. 다음을 클릭합니다. 데이터 유형 을(를) 탭하고 끌어다 놓기 열거형 아래에 있는 데이터 형식 그림 참조 필드. 다음 속성을 입력합니다:

    • 렌더링 형식: 확인란
    • 필드 레이블: 직업
    • 속성 이름: occupation

  10. 여러 개 추가 옵션 사용 옵션 추가 단추를 클릭합니다. 에 대해 동일한 값 사용 옵션 레이블 및 옵션 값:

    아티스트, 영향력 있는 사용자, 사진사, 여행자, 작성자, 유튜버

  11. 최종 개인 모델은 다음과 같아야 합니다.

    최종 사용자 모델

  12. 클릭 저장 변경 내용을 저장합니다.

팀 모델 만들기

에 대한 모델 만들기 팀- 사용자 팀의 데이터 모델입니다. 팀 모델은 팀 구성원을 나타내는 개인 모델을 참조합니다.

  1. 다음에서 내 프로젝트 폴더, 탭 만들기 오른쪽 상단에서 모델 만들기 마법사.

  2. 위치 모델 제목 필드, 입력 팀 및 탭 만들기.

    누르기 열기 결과 대화 상자에서 새로 생성된 모델을 엽니다.

  3. 드래그 앤 드롭 한 줄 텍스트 요소를 기본 패널에 추가합니다. 에서 다음 속성을 입력합니다. 속성 탭:

    • 필드 레이블: 제목
    • 속성 이름: title
    • 확인 필수

  4. 탭 데이터 유형 탭을 누른 채 드래그 앤 드롭 한 줄 텍스트 요소를 기본 패널에 추가합니다. 에서 다음 속성을 입력합니다. 속성 탭:

    • 필드 레이블: 짧은 이름
    • 속성 이름: shortName
    • 확인 필수
    • 확인 고유
    • 아래, 유효성 검사 유형 > 선택 사용자 정의
    • 아래, 사용자 지정 유효성 검사 정규식 > 입력 ^[a-z0-9\-_]{5,40}$ - 소문자 영숫자 값과 5-40자 사이의 대시만 입력할 수 있습니다.

    다음 shortName 속성은 축약된 경로를 기반으로 개별 팀을 쿼리하는 방법을 제공합니다. 다음 고유 을 설정하면 이 모델의 콘텐츠 조각당 값이 항상 고유합니다.

  5. 탭 데이터 유형 을(를) 탭하고 드래그 앤 드롭 여러 줄 텍스트 필드 아래 짧은 이름 필드. 다음 속성을 입력합니다:

    • 필드 레이블: 설명
    • 속성 이름: description
    • 기본 유형: 리치 텍스트

  6. 다음을 클릭합니다. 데이터 유형 을(를) 탭하고 드래그 앤 드롭 조각 참조 필드. 다음 속성을 입력합니다:

    • 렌더링 형식: 다중 필드
    • 필드 레이블: 팀원
    • 속성 이름: teamMembers
    • 허용된 컨텐츠 조각 모델: 폴더 아이콘을 사용하여 개인 모델.

  7. 최종 팀 모델은 다음과 같아야 합니다.

    최종 팀 모델

  8. 클릭 저장 변경 내용을 저장합니다.

  9. 이제 다음 두 가지 모델을 사용하여 작업할 수 있습니다.

    두 가지 모델

프로젝트 구성 및 콘텐츠 조각 모델 게시

검토 및 확인 후 Project Configuration 및 Content Fragment Model

  1. AEM 시작 화면에서 다음으로 이동합니다. 도구 > 일반 > 구성 브라우저.

  2. 옆에 있는 확인란을 탭합니다. 내 프로젝트 및 탭 게시

    프로젝트 구성 게시

  3. AEM 시작 화면에서 다음으로 이동합니다. 도구 > 일반 > 컨텐츠 조각 모델.

  4. 다음으로 이동 내 프로젝트 폴더를 삭제합니다.

  5. 누르기 개인 및 팀 모델 및 탭 게시

    콘텐츠 조각 모델 게시

축하합니다!

축하합니다. 방금 첫 번째 콘텐츠 조각 모델을 만들었습니다!

다음 단계

다음 장에서는 컨텐츠 조각 모델 작성, 콘텐츠 조각 모델을 기반으로 새 콘텐츠 조각을 만들고 편집합니다. 콘텐츠 조각의 변형을 만드는 방법도 알아봅니다.

관련 설명서

이 페이지에서는