컴포넌트
컴포넌트는 플러그인을 통해 등록할 수 있는 XE의 구성요소를 통틀어 지칭하는 용어입니다. XE에는 여러가지 타입의 컴포넌트가 있으며 테마, 스킨, 에디터, 위젯 등이 대표적입니다. 각 타입의 컴포넌트들 간에 별다른 공통점은 없습니다. 오직 플러그인 개발자에 의해 등록됨으로써 XE에 추가될 수 있다는 점이 유일한 공통점입니다.
플러그인 개발자들은 컴포넌트를 제작하여 XE에 등록할 수 있습니다. 만약 자신만의 컴포넌트를 만들어 사용하고 싶다면 먼저 플러그인을 하나 생성한 다음 플러그인에 컴포넌트를 추가해 넣습니다. 그 다음, 플러그인을 활성화하면 자신이 제작한 컴포넌트를 XE에서 사용할 수 있습니다.
예를 들어 새로운 테마를 만들어서 자신의 사이트에 적용하고 싶다면, 먼저 빈 플러그인을 하나 생성합니다. 그 다음 플러그인 안에서 테마 컴포넌트를 만듭니다. 만약 테마와 함께 게시판 스킨과 위젯도 만들어서 사이트에 적용하고 싶다면, 이 두가지 컴포넌트도 같은 플러그인에 추가합니다. 플러그인을 활성화하면 플러그인에 포함된 컴포넌트들을 XE에서 모두 사용할 수 있습니다.
XE1에서는 각 컴포넌트를 따로 XE에 추가해야 했습니다. XE3에서는 하나의 플러그인에 컴포넌트를 모두 포함하여 한번에 추가할 수 있습니다. 배포할 때에도 마찬가지로 각 컴포넌트를 따로 배포하지 않고, 플러그인 하나에 담아서 배포하면 됩니다.
컴포넌트 인터페이스
모든 컴포넌트는 Xpressengine\Plugin\ComponentInterface 인터페이스를 구현한 클래스 형태여야 합니다. 이 인터페이스는 컴포넌트를 XE에 등록할 때 필요한 규칙을 한정해주는 역할을 합니다.
컴포넌트 타입
XE는 기본적으로 10개 타입의 컴포넌트를 가지고 있습니다. 각 타입의 컴포넌트는 모두 \Xpressengine\Plugin\ComponentInterface를 구현한 추상클래스를 정의하고 있습니다. 여러분이 어떤 타입의 컴포넌트를 제작하고 싶다면, 그 타입의 추상클래스를 상속받는 클래스를 작성하면 됩니다.
만약, 테마 컴포넌트를 제작하려고 한다면 테마 타입의 추상클래스인 \Xpressengine\Theme\AbstractTheme를 상속받는 클래스를 작성하십시오.
플러그인 개발자는 10개의 타입 이외에 플러그인에서 필요한 타입을 직접 생성하여 사용할 수도 있습니다. 플러그인에서 필요한 컴포넌트 타입을 정의해 놓으면, 다른 플러그인 개발자들이 정의한 타입의 컴포넌트를 제작하여 등록할 수 있습니다.
11개의 XE의 기본 컴포넌트 타입에 대해 간략히 설명해 보겠습니다.
테마
테마는 웹사이트의 디자인과 웹페이지의 전체적인 레이아웃을 결정합니다.
모든 웹사이트는 요청받은 URL에 해당하는 메인 콘텐츠를 출력합니다. 예를 들어 특정 포스트를 출력하는 웹페이지라면, 포스트의 제목, 내용, 댓글목록이 메인 콘텐츠에 해당됩니다. XE는 출력할 메인 콘텐츠를 작성한 후 웹브라우저로 보내기 전에 지정된 테마에게 메인 콘텐츠를 전달합니다. 테마는 웹사이트에서 공통적으로 필요한 헤더, 푸터, 사이드바 영역과 전달받은 메인 콘텐츠 영역을 조립하여, 완성된 웹페이지를 만듭니다. 이때 테마는 웹페이지에 디자인을 결정짓는 마크업을 생성하고, 스타일시트를 로드합니다.
테마 컴포넌트의 제작법은 이 문서를 참조하세요.
스킨
스킨의 목적은 출력되는 웹브라우저에서 출력되는 모든 html을 교체 가능하도록 만들기 위함입니다. 가령, 게시판 플러그인은 글 목록 보기, 글 보기 등의 페이지를 제공합니다. 만약 게시판 플러그인에 스킨을 적용하지 않았다면, 게시판 플러그인의 제작자가 처음 제작한 페이지 디자인을 바꿀 수 없습니다. 하지만 게시판에 스킨 시스템이 적용되어 있다면 사이트 관리자는 다른 개발자가 제작한 게시판 스킨을 선택하고, 사용할 수 있습니다. 자신이 만든 플러그인의 디자인을 사이트 관리자가 교체할 수 있도록 하려면 스킨 시스템을 적용하십시오.
스킨 컴포넌트의 제작법은 이 문서를 참조하세요.
다이나믹 필드
다이나믹 필드는 사용자가 관리자에서 입력필드를 추가해 사용할 수 있도록 해줍니다.
이는 코어의 패키지나 개별 플러그인 별로 지원여부를 결정하며 회원 패키지, Board 플러그인에서 지원하고 있습니다. 다이나믹 필드를 이용해 회원 가입할 때 나이를 입력 받거나 게시물을 작성할 때 주소를 입력받을 수 있습니다.
다이나믹 필드 스킨
다이나믹 필드 스킨은 다이나믹 필드를 출력할 때 사용하는 스킨 입니다.
모든 확장 필드에 스타일을 변경할 수 있도록 합니다.
UI오브젝트
XE에서는 화면에 자주 출력되는 UI 요소들이 있습니다. 텍스트 인풋박스나 셀렉트 박스(select)와 같은 기본적인 폼 요소들이 있고, 테마 선택기나 메뉴 선택기, 또는 권한 설정 UI와 같이 XE에서만 사용되는 특별한 요소들도 있습니다. UI오브젝트는 이렇게 자주 사용되는 UI 요소를 개발자들이 쉽게 출력할 수 있는 방법을 제공합니다.
직접 UI요소의 마크업을 작성하는 대신, uio() 함수를 사용하여 UI오브젝트를 출력하십시오. 선택된 UI오브젝트는 알아서 html 마크업을 생성하여 출력하고, 스타일시트와 스크립트 파일도 자동으로 로드합니다.
위젯
위젯은 다양한 컨텐츠를 사이트의 어느 곳에서나 반복적으로 출력할 수 있는 방법을 제공합니다. 위젯은 출력할 컨텐츠에 대한 설정 정보를 사용자로부터 입력받고, 입력받은 설정 정보를 이용하여 컨텐츠를 생성합니다. 그 다음, 미리 정해진 템플릿을 통해 컨텐츠를 출력합니다. 사용자는 화면에 위젯을 추가하기 위해 위젯 생성 UI를 사용할 수 있습니다. 위젯 생성 UI에 추가할 위젯의 종류와 스킨을 선택하고, 위젯의 설정정보를 입력하면 XML 형식의 위젯코드가 생성됩니다. 이 위젯코드를 테마나 페이지의 원하는 위치에 삽입하면, XE는 최종적으로 위젯코드를 HTML로 변환하여 화면에 출력합니다.
Last updated