Getting started with XULRunner

  • 리비전 슬러그: Getting_started_with_XULRunner
  • 리비전 제목: Getting started with XULRunner
  • 리비전 아이디: 115539
  • 제작일시:
  • 만든이: Suguni
  • 현재 리비전인가요? 아니오
  • 댓글 /* 다른 방법: Firefox3 -app를 이용해 XUL 응용 프로그램을 실행시키기 */

리비전 내용

{{template.Next("Windows and menus in XULRunner")}}

본 기사에서는 XULRunner를 이용하여 기본적인 데스크탑 응용프로그램을 개발해봄으로써 Mozilla 플랫폼에 대해 알아보겠습니다. Firefox, Thunderbird, 기타 다양한 응용프로그램들이 이 플랫폼을 이용하여 작성되었으며, 기본적인 응용 프로그램을 개발하기에 사용될 수 있을 만큼 충분히 안정적입니다.

저는 단순한 XUL 기반의 데스크탑 응용 프로그램을 개발하고자 합니다. 여러분도 XUL 기반의 데스크탑 응용 프로그램을 개발하고자 한다면, 아마도 XULRunner를 설치해야 할 것입니다. 먼저 XULRunner를 설치한 후, 골격만 있는 프로그램을 실행해서 제대로 동작하는지 확인해 보겠습니다.

1단계: XULRunner 다운로드

여러분은 MDC의 메인 XULRunner 페이지에서 다운로드 링크를 찾을 수 있습니다.

Windows 버전의 XULRunner는 인스톨러가 아니고 zip 파일로 제공됩니다. 개발자 입장에서는 내 장비에 압축을 해제하기만 하면 된다는 아이디어가 마음에 듭니다. Windwos 시스템을 건드릴 필요가 없을 것 같아서 좋습니다.

Mac 버전의 경우는 표준 Mac OS X 인스톨러로 배포됩니다.

2단계: XULRunner 설치하기

Windows에서는 적당한 위치에 압축을 해제하세요. 나는 <tt>C:\program files\xulrunner</tt> 폴더를 새로 만들고 이곳에 압축을 풀었습니다. 지금까지는 꽤 간단합니다. Mac의 경우에는 그냥 인스톨러를 실행하면 <tt>/Library/Frameworks</tt> 디렉토리에 <tt>XUL.Framework</tt>로 설치되게 됩니다.

이제 간단한 뼈대만 있는 간단한 응용 프로그램 껍데기를 만들 시간입니다. 괜찮다면 이 프로그램을 XUL 버전의 "Hello World"라고 하겠습니다. Google 검색을 해보면 괜찮은 자습서를 발견할 수 있습니다. 읽어볼만 합니다. 자습서를 읽고서 나는 간단한 시작 응용 프로그램을 만들었습니다. 아래에 있는 내용들은 모두 Ryans의 자습서과 이곳 MDC에 있는 XULRunner에서도 볼 수 있는 내용들입니다.

3단계: 응용 프로그램 폴더 구조 생성

윈도우에서, 내 경우 루트 폴더를 <tt>c:\program files\myapp</tt>로 생성했지만, 아무곳이나 괜찮습니다. 다음은 하위 폴더 구조입니다.

/myapp
  /chrome
    /content
      main.xul
    chrome.manifest
  /defaults
    /preferences
      prefs.js
  application.ini

위의 폴더 구조에 4개의 파일 - <tt>application.ini</tt>, <tt>chrome.manifest</tt>, <tt>prefs.js</tt>, <tt>main.xul</tt> - 이 있다는 것을 명심하세요.

4단계: <tt>application.ini</tt> 설정

<tt>application.ini</tt> 파일은 여러분이 작성하는 응용 프로그램에 대한 XULRunner의 시작점입니다. 이 파일에서는 여러분이 작성한 응용 프로그램이 XULRunner 플랫폼을 어떤 의도로 사용할 것인가를 제시하며, XULRunner가 응용 프로그램을 실행하는데 필요한 정보들에 대한 설정을 포함합니다. 제가 작성한 것은 다음과 같습니다.

[App]
Vendor=Finkle
Name=Test App
Version=1.0
BuildID=20060101
Copyright=Copyright (c) 2006 Mark Finkle
ID=xulapp@starkravingfinkle.org

[Gecko]
MinVersion=1.8
MaxVersion=1.8

not really... You can find more information about the <tt>application.ini</tt> file in the article {{mediawiki.internal('XULRunner:Deploying XULRunner 1.8', "ko")}}.

주의: 2007 nightly trunk XULRunner build에서 본 예제 프로그램을 실행시키기려면 MaxVersion을 1.9로 수정하세요.

5단계: Chrome 선언 설정

Chrome 선언 파일은 응용 프로그램에 포함된 자원(resource)의 위치를 나타내기 위해 XULRunner가 사용하는 URI들을 정의합니다. 이는 "chrome://" URI가 사용되는 방법을 보면 잘 알 수 있습니다. 응용 프로그램 chrome은 하나 혹은 몇개의 JAR 파일로 구성되거나 또는 압축되지 않은 폴더와 파일로 구성될 수 있습니다. 여기서는 압축되지 않은 방법을 사용할 것입니다. 내가 작성한 선언 파일은 다음과 같습니다.

 content myapp file:content/
주의: 응용 프로그램 이름은 소문자이고 3자 이상이어야 합니다.

6단계: 환경 설정 구성

<tt>prefs.js</tt> 파일에는 XULRunner가 메인 윈도우로 사용할 XUL 파일명에 대한 정보가 포함되어 있습니다. 내 것은 다음과 같습니다.

 pref("toolkit.defaultChromeURI", "chrome://myapp/content/main.xul");

XULRunner 환경 설정에는 다음과 같은 것들이 포함됩니다.

toolkit.defaultChromeURI
응용 프로그램이 실행될 때 열릴 기본 윈도우를 지정합니다.
toolkit.defaultChromeFeatures
메인 윈도우가 열릴 때 window.open() 코드에 포함될 기능(feature)들을 지정합니다.
toolkit.singletonWindowType
응용 프로그램이 한번에 하나의 인스터스만을 가지도록 설정합니다.

이 내용들은 XULRunner:Specifying Startup Chrome Window에 좀 더 자세히 설명되어 있습니다.

7단계: XUL 만들기

마지막으로 간단한 XUL 윈도우를 만들어야 하는데, 이는 <tt>main.xul</tt> 파일에 잘 나와 있습니다. 여기 있는 내용은 특별한 건 없고 창을 만들기 위해 필요한 최소한의 것들만 포함되어 있습니다.

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

<window id="main" title="My App" width="300" height="300"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
  <caption label="Hello World"/>
</window>
주의: XML/XUL 파일의 맨 처음에 공백이 있으면 안됩니다.

8단계: 응용 프로그램 실행하기

결정적 순간입니다. 응용 프로그램을 실행하기 위해 XULRunner가 필요합니다. Windows의 명령창을 열고 <tt>C:\program files\myapp</tt> 폴더로 이동한 후 다음의 명령어를 실행하세요.

 xulrunner.exe application.ini

물론, xulrunner.exe는 PATH에 포함되어 있어야 합니다. xulrunner.exe가 경로에 포함되어 있지 않다면 다음과 같이 실행할 수 있습니다.

 ..\xulrunner\xulrunner.exe application.ini

Mac에서는 터미널 창을 열고 <tt>myapp</tt> 디렉토리로 이동한 후 다음과 같이 입력하시면 됩니다.

 /Library/Frameworks/XUL.framework/xulrunner-bin application.ini

여러분은 다음과 같이 생긴 창을 볼 수 있을 것입니다. 다음 화면은 Ubuntu에서의 화면입니다.

Image:XULSampleMyapp.png

다른 방법: Firefox3 -app를 이용해 XUL 응용 프로그램을 실행시키기

Firefox 3에서는 커맨드 라인을 통해 브라우저 대신 XUL 응용 프로그램이 실행되도록 할 수 있습니다. 이는 XULRunner를 이용하여 XUL 응용 프로그램을 실행하는 것과 비슷합니다. See {{template.Bug(388833)}}

예제 프로젝트 다운받기.

{{template.Next("Windows and menus in XULRunner")}}

원본 정보

  • 저자: Mark Finkle
  • 최종 수정일: 2006년 10월 2일
{{ wiki.languages( { "en": "en/Getting_started_with_XULRunner", "ja": "ja/Getting_started_with_XULRunner" } ) }}

리비전 소스

<p>
</p><p>{{template.Next("Windows and menus in XULRunner")}}
</p><p>본 기사에서는 <a href="ko/XULRunner">XULRunner</a>를 이용하여 기본적인 데스크탑 응용프로그램을 개발해봄으로써 Mozilla 플랫폼에 대해 알아보겠습니다. Firefox, Thunderbird, 기타 다양한 응용프로그램들이 이 플랫폼을 이용하여 작성되었으며, 기본적인 응용 프로그램을 개발하기에 사용될 수 있을 만큼 충분히 안정적입니다.
</p><p>저는 단순한 XUL 기반의 데스크탑 응용 프로그램을 개발하고자 합니다. 여러분도 XUL 기반의 데스크탑 응용 프로그램을 개발하고자 한다면, 아마도 XULRunner를 설치해야 할 것입니다. 먼저 XULRunner를 설치한 후, 골격만 있는 프로그램을 실행해서 제대로 동작하는지 확인해 보겠습니다.
</p>
<h2 name="1.EB.8B.A8.EA.B3.84:_XULRunner_.EB.8B.A4.EC.9A.B4.EB.A1.9C.EB.93.9C">1단계: XULRunner 다운로드</h2>
<p>여러분은 MDC의 메인 <a href="ko/XULRunner">XULRunner</a> 페이지에서 다운로드 링크를 찾을 수 있습니다.
</p><p>Windows 버전의 XULRunner는 인스톨러가 아니고 zip 파일로 제공됩니다. 개발자 입장에서는 내 장비에 압축을 해제하기만 하면 된다는 아이디어가 마음에 듭니다. Windwos 시스템을 건드릴 필요가 없을 것 같아서 좋습니다.
</p><p>Mac 버전의 경우는 표준 Mac OS X 인스톨러로 배포됩니다.
</p>
<h2 name="2.EB.8B.A8.EA.B3.84:_XULRunner_.EC.84.A4.EC.B9.98.ED.95.98.EA.B8.B0">2단계: XULRunner 설치하기</h2>
<p>Windows에서는 적당한 위치에 압축을 해제하세요. 나는 <tt>C:\program files\xulrunner</tt> 폴더를 새로 만들고 이곳에 압축을 풀었습니다. 지금까지는 꽤 간단합니다. Mac의 경우에는 그냥 인스톨러를 실행하면 <tt>/Library/Frameworks</tt> 디렉토리에 <tt>XUL.Framework</tt>로 설치되게 됩니다.
</p><p>이제 간단한 뼈대만 있는 간단한 응용 프로그램 껍데기를 만들 시간입니다. 괜찮다면 이 프로그램을 XUL 버전의 "Hello World"라고 하겠습니다. Google 검색을 해보면 <a class="external" href="http://blogs.acceleration.net/ryan/archive/2005/05/06/1073.aspx">괜찮은 자습서</a>를 발견할 수 있습니다. 읽어볼만 합니다. 자습서를 읽고서 나는 간단한 시작 응용 프로그램을 만들었습니다. 아래에 있는 내용들은 모두 Ryans의 자습서과 이곳 MDC에 있는 <a href="ko/XULRunner">XULRunner</a>에서도 볼 수 있는 내용들입니다.
</p>
<h2 name="3.EB.8B.A8.EA.B3.84:_.EC.9D.91.EC.9A.A9_.ED.94.84.EB.A1.9C.EA.B7.B8.EB.9E.A8_.ED.8F.B4.EB.8D.94_.EA.B5.AC.EC.A1.B0_.EC.83.9D.EC.84.B1">3단계: 응용 프로그램 폴더 구조 생성</h2>
<p>윈도우에서, 내 경우 루트 폴더를 <tt>c:\program files\myapp</tt>로 생성했지만, 아무곳이나 괜찮습니다. 다음은 하위 폴더 구조입니다.
</p>
<pre>/myapp
  /chrome
    /content
      main.xul
    chrome.manifest
  /defaults
    /preferences
      prefs.js
  application.ini
</pre>
<p>위의 폴더 구조에 4개의 파일 - <tt>application.ini</tt>, <tt>chrome.manifest</tt>, <tt>prefs.js</tt>, <tt>main.xul</tt> - 이 있다는 것을 명심하세요.
</p>
<h2 name="4.EB.8B.A8.EA.B3.84:_application.ini_.EC.84.A4.EC.A0.95">4단계: <tt>application.ini</tt> 설정</h2>
<p><tt><a href="ko/XUL_Application_Packaging">application.ini</a></tt> 파일은 여러분이 작성하는 응용 프로그램에 대한 XULRunner의 시작점입니다. 이 파일에서는 여러분이 작성한 응용 프로그램이 XULRunner 플랫폼을 어떤 의도로 사용할 것인가를 제시하며, XULRunner가 응용 프로그램을 실행하는데 필요한 정보들에 대한 설정을 포함합니다. 제가 작성한 것은 다음과 같습니다.
</p>
<pre>[App]
Vendor=Finkle
Name=Test App
Version=1.0
BuildID=20060101
Copyright=Copyright (c) 2006 Mark Finkle
ID=xulapp@starkravingfinkle.org

[Gecko]
MinVersion=1.8
MaxVersion=1.8
</pre>
<p><span class="comment">not really... You can find more information about the &lt;tt&gt;application.ini&lt;/tt&gt; file in the article {{mediawiki.internal('XULRunner:Deploying XULRunner 1.8', "ko")}}.</span>
</p><p><i>주의:</i> 2007 nightly trunk XULRunner build에서 본 예제 프로그램을 실행시키기려면 MaxVersion을 1.9로 수정하세요.
</p>
<h2 name="5.EB.8B.A8.EA.B3.84:_Chrome_.EC.84.A0.EC.96.B8_.EC.84.A4.EC.A0.95">5단계: Chrome 선언 설정</h2>
<p><a href="ko/Chrome_Registration">Chrome 선언</a> 파일은 응용 프로그램에 포함된 자원(resource)의 위치를 나타내기 위해 XULRunner가 사용하는 URI들을 정의합니다. 이는 "chrome://" URI가 사용되는 방법을 보면 잘 알 수 있습니다. 응용 프로그램 chrome은 하나 혹은 몇개의 JAR 파일로 구성되거나 또는 압축되지 않은 폴더와 파일로 구성될 수 있습니다. 여기서는 압축되지 않은 방법을 사용할 것입니다. 내가 작성한 선언 파일은 다음과 같습니다.
</p>
<pre class="eval"> content myapp file:content/
</pre>
<div class="note">주의: 응용 프로그램 이름은 소문자이고 3자 이상이어야 합니다.</div>
<h2 name="6.EB.8B.A8.EA.B3.84:_.ED.99.98.EA.B2.BD_.EC.84.A4.EC.A0.95_.EA.B5.AC.EC.84.B1">6단계: 환경 설정 구성</h2>
<p><tt>prefs.js</tt> 파일에는 XULRunner가 메인 윈도우로 사용할 XUL 파일명에 대한 정보가 포함되어 있습니다. 내 것은 다음과 같습니다.
</p>
<pre class="eval"> pref("toolkit.defaultChromeURI", "chrome://myapp/content/main.xul");
</pre>
<p>XULRunner 환경 설정에는 다음과 같은 것들이 포함됩니다.
</p>
<dl><dt> <code><a href="ko/Toolkit.defaultChromeURI">toolkit.defaultChromeURI</a></code>
</dt><dd> 응용 프로그램이 실행될 때 열릴 기본 윈도우를 지정합니다.
</dd><dt> <code><a href="ko/Toolkit.defaultChromeFeatures">toolkit.defaultChromeFeatures</a></code>
</dt><dd> 메인 윈도우가 열릴 때 <code><a href="ko/Window.open">window.open()</a></code> 코드에 포함될 기능(feature)들을 지정합니다.
</dd><dt> <code><a href="ko/Toolkit.singletonWindowType">toolkit.singletonWindowType</a></code>
</dt><dd> 응용 프로그램이 한번에 하나의 인스터스만을 가지도록 설정합니다.
</dd></dl>
<p>이 내용들은 <a href="ko/XULRunner/Specifying_Startup_Chrome_Window">XULRunner:Specifying Startup Chrome Window</a>에 좀 더 자세히 설명되어 있습니다.
</p>
<h2 name="7.EB.8B.A8.EA.B3.84:_XUL_.EB.A7.8C.EB.93.A4.EA.B8.B0">7단계: XUL 만들기</h2>
<p>마지막으로 간단한 XUL 윈도우를 만들어야 하는데, 이는 <tt>main.xul</tt> 파일에 잘 나와 있습니다. 여기 있는 내용은 특별한 건 없고 창을 만들기 위해 필요한 최소한의 것들만 포함되어 있습니다.
</p>
<pre>&lt;?xml version="1.0"?&gt;
&lt;?xml-stylesheet href="chrome://global/skin/" type="text/css"?&gt;

&lt;window id="main" title="My App" width="300" height="300"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"&gt;
  &lt;caption label="Hello World"/&gt;
&lt;/window&gt;
</pre>
<div class="note">주의: XML/XUL 파일의 맨 처음에 공백이 있으면 안됩니다.</div>
<h2 name="8.EB.8B.A8.EA.B3.84:_.EC.9D.91.EC.9A.A9_.ED.94.84.EB.A1.9C.EA.B7.B8.EB.9E.A8_.EC.8B.A4.ED.96.89.ED.95.98.EA.B8.B0">8단계: 응용 프로그램 실행하기</h2>
<p>결정적 순간입니다. 응용 프로그램을 실행하기 위해 XULRunner가 필요합니다. Windows의 명령창을 열고 <tt>C:\program files\myapp</tt> 폴더로 이동한 후 다음의 명령어를 실행하세요.
</p>
<pre class="eval"> xulrunner.exe application.ini
</pre>
<p>물론, xulrunner.exe는 <code>PATH</code>에 포함되어 있어야 합니다. xulrunner.exe가 경로에 포함되어 있지 않다면 다음과 같이 실행할 수 있습니다.
</p>
<pre class="eval"> ..\xulrunner\xulrunner.exe application.ini
</pre>
<p>Mac에서는 터미널 창을 열고 <tt>myapp</tt> 디렉토리로 이동한 후 다음과 같이 입력하시면 됩니다.
</p>
<pre class="eval"> /Library/Frameworks/XUL.framework/xulrunner-bin application.ini
</pre>
<p>여러분은 다음과 같이 생긴 창을 볼 수 있을 것입니다. 다음 화면은 Ubuntu에서의 화면입니다.
</p><p><img alt="Image:XULSampleMyapp.png" src="File:ko/Media_Gallery/XULSampleMyapp.png">
</p>
<h3 name=".EB.8B.A4.EB.A5.B8_.EB.B0.A9.EB.B2.95:_Firefox3_-app.EB.A5.BC_.EC.9D.B4.EC.9A.A9.ED.95.B4_XUL_.EC.9D.91.EC.9A.A9_.ED.94.84.EB.A1.9C.EA.B7.B8.EB.9E.A8.EC.9D.84_.EC.8B.A4.ED.96.89.EC.8B.9C.ED.82.A4.EA.B8.B0"> 다른 방법: Firefox3 -app를 이용해 XUL 응용 프로그램을 실행시키기 </h3>
<p>Firefox 3에서는 커맨드 라인을 통해 브라우저 대신 XUL 응용 프로그램이 실행되도록 할 수 있습니다. 이는 XULRunner를 이용하여 XUL 응용 프로그램을 실행하는 것과 비슷합니다.
See {{template.Bug(388833)}}
</p><p><a class="external" href="http://developer.mozilla.org/samples/xulrunner/myapp.zip">예제 프로젝트</a> 다운받기.
</p><p>{{template.Next("Windows and menus in XULRunner")}}
</p>
<div class="originaldocinfo">
<h2 name=".EC.9B.90.EB.B3.B8_.EC.A0.95.EB.B3.B4"> 원본 정보 </h2>
<ul><li> 저자: Mark Finkle
</li><li> 최종 수정일: 2006년 10월 2일
</li></ul>
</div>
<div class="noinclude">
</div>
{{ wiki.languages( { "en": "en/Getting_started_with_XULRunner", "ja": "ja/Getting_started_with_XULRunner" } ) }}
Revert to this revision