컨텐츠 조각 모델 정의

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

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

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

사전 요구 사항

이 튜토리얼은 여러 부분으로 구성된 튜토리얼이며 AEM 작성자 환경을 사용할 수 있습니다..

목표

• 컨텐츠 조각 모델을 만듭니다.
• 모델 작성을 위해 사용 가능한 데이터 유형과 유효성 검사 옵션을 식별합니다.
• 컨텐츠 조각 모델이 정의하는 방법을 이해합니다 둘 다 컨텐츠 조각에 대한 데이터 스키마 및 작성 템플릿입니다.

프로젝트 구성 만들기

프로젝트 구성에는 특정 프로젝트와 연관된 모든 컨텐츠 조각 모델이 포함되어 있으며 모델을 구성하는 방법을 제공합니다. 하나 이상의 프로젝트를 만들어야 합니다 이전 컨텐츠 조각 모델 생성.

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

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

   

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

4. 결과 대화 상자에서 다음을 입력합니다.

   • 제목*: 내 프로젝트
   • 이름*: 내 프로젝트 (단어를 구분하기 위해 하이픈을 사용하여 모두 소문자로 사용하는 것이 좋습니다. 이 문자열은 클라이언트 응용 프로그램이 요청을 수행하는 고유한 GraphQL 끝점에 영향을 줍니다.)
   • 확인 컨텐츠 조각 모델
   • 확인 GraphQL 영구 쿼리

   

컨텐츠 조각 모델 만들기

다음으로, 팀 그리고 개인.

개인 모델 생성

모델 만들기 개인: 팀의 일부인 사람을 나타내는 데이터 모델입니다.

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

   

2. 로 이동합니다. 내 프로젝트 폴더를 입력합니다.

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

4. in 모델 제목 필드, 입력 개인 탭 만들기. 결과 대화 상자에서 열기​를 입력하여 모델을 작성할 수 있습니다.

5. 끌어다 놓기 한 줄 텍스트 요소를 기본 패널에 추가합니다. 에 다음 속성을 입력합니다. 속성 탭:

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

   

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

6. 탭하기 데이터 유형 탭 및 드래그하여 놓기 여러 줄 텍스트 아래 필드 전체 이름 필드. 다음 속성을 입력합니다.

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

7. 을(를) 클릭합니다. 데이터 유형 탭 및 드래그하여 놓기 컨텐츠 참조 필드. 다음 속성을 입력합니다.

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

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

8. 에 유효성 검사 추가 그림 참조 따라서 이미지 를 사용하여 필드를 채울 수 있습니다.

   

9. 을(를) 클릭합니다. 데이터 유형 탭 및 드래그하여 놓기 열거형 아래의 데이터 유형 그림 참조 필드. 다음 속성을 입력합니다.

   • 다음으로 렌더링: 확인란
   • 필드 레이블: 직업
   • 속성 이름: occupation

10. 몇 개 추가 옵션 사용 옵션 추가 버튼을 클릭합니다. 에 동일한 값 사용 옵션 레이블 및 옵션 값:

    아티스트, 영향력 있는 사용자, 사진사, 여행자, 작성기, YouTuber

11. 마지막 개인 모델은 다음과 같습니다.

    

12. 클릭 저장 변경 사항을 저장하려면 을 클릭합니다.

팀 모델 만들기

모델 만들기 팀: 사람 팀의 데이터 모델입니다. 팀 모델은 개인 모델을 참조하여 팀의 멤버를 나타냅니다.

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

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

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

3. 끌어다 놓기 한 줄 텍스트 요소를 기본 패널에 추가합니다. 에 다음 속성을 입력합니다. 속성 탭:

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

4. 탭하기 데이터 유형 탭 및 끌어 놓기 한 줄 텍스트 요소를 기본 패널에 추가합니다. 에 다음 속성을 입력합니다. 속성 탭:

   • 필드 레이블: 짧은 이름
   • 속성 이름: shortName
   • 확인 필수 여부
   • 확인 고유
   • 아래에, 유효성 검사 유형 > 선택 사용자 지정
   • 아래에, 사용자 지정 유효성 검사 RegEx > enter ^[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. 탭 개인 및 팀 모델 및 탭 게시

   

축하합니다!

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

다음 단계

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

관련 설명서

• 콘텐츠 조각 모델

Business.Adobe.com 리소스