번역: 이원찬(wonchan.lee@gmail.com)
-------------------------------------------------------
Creating a more advanced RIFE application
- Laying out the structure
이제 가능한 간단한 어플리케이션 부터 시작해서 점점 현실적인 예제로 옮겨갈 것이다. 실세계에 우리는 더욱 동적인 어플리케이션을 필요로 한다.
지금부터 간단한 숫자 맞추기 게임을 이용해 실세계 예제를 좀 더 단순화 해보겠다. 게임은 사용자가 숫자를 추측하게 하고 맞출때 까지 계속 "too high" 또는 "too low"를 출력하며 반응할 것이다.
번호 맞추기 게임은 앞서 살펴본 RIFE예제 다운로드 파일에 포함되어 있다. HelloWorld 예제에서와 같이 Jetty와 RIFE를 설치하는 과정을 반복해 보자.
------------------------------------------------------------------
cd ~/tutorial/rife-examples-{version}
mkdir 03_numberguess/WEB-INF/lib
cp ROOT/WEB-INF/lib/rife-{version}.jar 03_numberguess/WEB-INF/lib/
mv 03_numberguess ../jetty-{version}/webapps/
------------------------------------------------------------------
Jetty를 재시작 한다음 웹브라우저에서 http://localhost:8080/03_numberguess/ 를 확인해 보자.
파일의 갯수가 증가 되었다. 진행하기 전에 디렉토리 구조를 살펴보자.
------------------------------------------------------------------
numberguess 예제의 디렉토리 구조
------------------------------------------------------------------
classes/
rep/
participants.xml
sites/
numberguess.xml
elements/
start.xml
guess.xml
success.xml
templates/
guess.html
success.html
implementations/
tutorial/
numberguess/
Start.java
Guess.java
Success.java
src/
tutorial/
numberguess/
backend/
Contest.java
Game.java
------------------------------------------------------------------
elements 디렉토리를 보면 세계의 XML파일을 볼 수 있다. 이들은 각 게임의 요소(element)를 나타낸다. elements들은 사이트(site) 정의에서 서로간의 실행흐름(flow)을 생성해서 연결된다. 이 흐름을 "Flow links"라 부르며 flowlink 태그로 생성된다. 만약, 각 element간에 데이터를 전달은 "Data links"를 사용하며 datalink 태그를 사용한다.
우리는 element를 다음과 같이 연결 하려고 한다.
[ Start->Guess->Success 흐름도 ]
링크(link)로 다는 요소(element)에 연결을 하려면 element는 반드시 하나 또는 그 이상의 "출구(exits)"를 제공해야 한다. 하나의 exit는 Flow links의 시작점이며 다른 지점에는 다른 element가 존재한다.
위의 그림에서 Data links는 파란선, Flow links는 검은선으로 표현되어 있다. START는 "started"라는 출구를 가짐을 알 수 있고, GUESS는 "start"와 "success"라는 두개의 출구를 가진다. 그리고 SUCCESS는 "start"라는 출구를 가진다. "started"라는 출구가 START라는 element로 부터 GUESS라는 element로 연결됨을 볼 수 있다.
- Linking elements
앞서 언급했듯, element는 다양한 출구를 가질 수 있으며 element가 각각 연결을 할 수 있도록 한다. 이 출구들은 element선언 파일에 정의되어 있다. elements/guess.xml 예제에서 "start"와 "sucess" 출구를 찾아 보자.
------------------------------------------------------------------
element를 위한 출구정의
------------------------------------------------------------------
<element implementation="tutorial.numberguess.Guess">
<exit name="start"/>
<exit name="success"/>
</element>
------------------------------------------------------------------
링크생성
세 요소 Start, Guess, Success 간의 관계는 sites/numberguess.xml 이라는 사이트파일에 정의되어 있다. 여기에 element들은 서로 연결되어 있고 사이트의 흐름이 정의되어 있다. 이 모든것은 적절한 flowlink태그로 완성된다.
------------------------------------------------------------------
Flowlinks 정의
------------------------------------------------------------------
<site>
<element id="Guess" file="guess.xml" url="/guess">
<flowlink srcexit="start" destid="Start"/>
<flowlink srcexit="success" destid="Success"/>
</element>
</site>
------------------------------------------------------------------
GUESS요소는 START요소로 향하는 연결과 SUCCESS요소로 향하는 연결을 가지고 있다. 흐름은 요소의 출구와 요소간에 항상 연결되어 있다. 그리고, 각 요소의 출구는 요소의 정의 파일에 반드시 기술되어 있어야 한다.
이 모든것은 사이트파일만 보면 사이트 내의 요소들간의 관계를 명확하고 쉽게 알 수 있도록 해준다. 이것은 웹어플리케이션을 개발하고 유지보수하는 동안 대단한 매우 큰 장점을 제공한다.
- Passing data between elements
Flow links 설정에 더해 우리는 각 요소간에 데이터를 전달할 필요가 있다. numberguess게임에서는 game ID를 사용한다. 이것은 각 게임을 구분하기 위한 구분자로 사용된다. 우리는 이 ID를 게임이 활성화 되었을ㄹ래 전달하기를 원한다. 이것은 모든 요소가 어떤 게임에 관여되었는지 알수 있게끔 한다. Data links는 이런 목적으로 사용되며 이 정의는 Flow links와 매우 유사하다.
입력과 출력 정의
요소로부터 전달받은 입력변수를 전달하려면 입력값들과 출력값들을 이 변수들에 정의되야 한다. 이것을 하기위해 element선언내에 input 과 output 태그를 사용한다.Guess 요소에 input과 output태그를 추가하면 아래와 같다.
------------------------------------------------------------------
입력과 출력 정의
------------------------------------------------------------------
<element implementation="tutorial.numberguess.Guess">
<input name="gameid"/>
<exit name="start"/>
<exit name="success"/>
<output name="gameid"/>
</element>
------------------------------------------------------------------
Data link 생성
실제로 하나의 출력 요소로부터 다른 입력 요소로 연결하려면 반드시 Data link를 생성해야 한다. 이 예제에서는 Guess요소의 "gameid"라는 출력으로 부터 Start요소의 "gameid"라는 입력으로 연결되었다.
------------------------------------------------------------------
<datalink srcoutput="gameid" destid="Start" destinput="gameid"/>
------------------------------------------------------------------
예제에서 Data link를 추가한 다음에는 아래의 결과를 얻을 수 있다.
------------------------------------------------------------------
GUESS요소에 Data link추가
------------------------------------------------------------------
<site>
<element id="Guess" file="guess.xml" url="guess">
<flowlink srcexit="start" destid="Start"/>
<datalink srcoutput="gameid" destid="Start" destinput="gameid"/>
<flowlink srcexit="success" destid="Success"/>
<datalink srcoutput="gameid" destid="Success" destinput="gameid"/>
</element>
</site>
------------------------------------------------------------------
datalink태그로 연결하는 동안 출력명을 반드시 입력명과 같을 필요가 없다는 점을 주의하라.
댓글 없음:
댓글 쓰기