[Tapestry 5.4] 5.4 Alpha버전으로 업그레이드 방법.

1) Tapestry 5.4 버전 변경된 사항. (RequireJS,  Prototype/JQuery, Bootstrap)

 : Tapestry 5.4 버전부터 클라이언트 사이드의 지원이 많이 늘어났습니다.

  대표적으로, 

        1. 자바스크립의 의존성관리를 도와주는 RequireJS와

        2. Javascript DOM처리를 과거에는 Prototype으로 구현하였으나, 5.4버전부터 jQuery를 선택할 수 있도록 되었습니다.

        3. 또한, 기본 CSS를 Bootstrap 3.0으로 적용되어있으며, 태피스트리가 제공하는 기본 컴포넌트도 별도 설정 없이도 

           모두 Bootstrap스타일로 나오게 되었습니다. 그럼, 어떤부분의 설정이 추가되었는지 진행하겠습니다.

  1-1. RequireJS 사용 설정방법.

    : Javascript 모듈의 기본 위치는 "/src/META-INF/modules" 아래에 위치하게 되며, 

      과거 이미지나, css의 위치도, /src/META-INF/assets에 위치하도록 정책이 변경되었습니다. 

      (물론, 과거 사용법 대로, /resource 밑에 위치하여도 사용가능합니다.)

    

@Contribute(ModuleManager.class)
public static void setupFoundationFramework(
	MappedConfiguration configuration,
	//생략
	@Path("classpath:/META-INF/modules/fuelux") Resource fuelux)
{
	//생략
   configuration.add("fuelux", new JavaScriptModuleConfiguration(fuelux).dependsOn("jquery-library","jquery","bootstrap/bootstrap").exports("fuelux"));
}

*AppModule.java에서 위 내용을 추가합니다.

*현재 자바스크립트 폴더 구조의 모듈을 지정하여, 추가로 의존성도 줄 수 있습니다.

//Tapestry 5.4 Version
public static void contributeClasspathAssetAliasManager(MappedConfiguration configuration){
	configuration.add("modules", "META-INF/modules");
}

자바스크립트 모듈에 접근하기 위해, classpath 경로의 위치도 추가합니다.

참고한 URL :

  http://tapestryjava.blogspot.kr/2011/11/tapestry-54-focus-on-javascript.html

  http://tapestryjava.blogspot.kr/2012/10/zeroing-in-on-tapestry-54.html

  1-2. DOM 기본 자바스크립트 Provider 선택 : Prototype/jQuery

   : 기존 Prototype 기분으로 지원되었던 Dom을 jQuery로 변경하는 방법입니다.

*변경하는 이유는, 

최근 대부분의 자바스크립트 플러그인이 jQuery를 의존하며, 최근 Prototype에서 jQuery로 이동하는 추세입니다.

Tapestry도 5.5부터는 jQuery를 기본 자바스크립트 DOM으로 사용한다고 합니다.

//Configured Tapestry-JQuery
@Contribute(SymbolProvider.class)
@ApplicationDefaults
public static void switchProviderToJQuery(MappedConfiguration configuration)
{
   configuration.add(SymbolConstants.JAVASCRIPT_INFRASTRUCTURE_PROVIDER, "jquery");
}

*AppModule.java에서 위 내용을 추가합니다.

*태피스트리 5.4에서 추가된 JAVASCRIPT_INFRASTRUCTURE_PROVIDER를 jquery로 지정합니다.

//Configured Tapestry-JQuery
@Contribute(Compatibility.class)
public static void disableScriptaculous(MappedConfiguration configuration)
{
   configuration.add(Trait.SCRIPTACULOUS, false);
   configuration.add(Trait.INITIALIZERS, false);
}

*AppModule.java에서 위 내용을 추가합니다.

*Prototype의 이벤트 역할을 하는 SCRIPTACULOUS와 Tapestry INITIALIZERS의 초기화를 false시킵니다.

@Contribute(ModuleManager.class)
public static void setupFoundationFramework(MappedConfiguration configuration,
											@Symbol(SymbolConstants.JAVASCRIPT_INFRASTRUCTURE_PROVIDER)
											String provider,
											@Path("classpath:org/apache/tapestry5/t5-core-dom-prototype.js")
											Resource domPrototype,
											@Path("classpath:org/apache/tapestry5/t5-core-dom-jquery.js")
											Resource domJQuery
											//생략
){
   	if (provider.equals("prototype"))
	   configuration.override("t5/core/dom", new JavaScriptModuleConfiguration(domPrototype));
	

	if (provider.equals("jquery"))
	   configuration.override("t5/core/dom", new JavaScriptModuleConfiguration(domJQuery));
	
       //생략
}

*AppModule.java에서 위 내용을 추가합니다.

*위 내용에서 provider를 jQuery로 변경했으므로, 기본 태피스트리의 core/dom는 jQuery로 변경합니다.

*참고한 URL

   http://tapestryjava.blogspot.kr/2013/01/tapestry-54-jquery-support-now-in-place.html

   1-3. Bootstrap

     : 태피스트리 5.4에서는 기본적으로 Bootstrap 3.0 을 지원합니다. 

      이전버전에서 유용하게 사용했던 Tapestry-Bootstrap의 경우 커스텀 컴포넌트를 제외하고는 의미가 없어졌다고 할 수 있습니다.

 public static void contributeApplicationDefaults(
		MappedConfiguration configuration)
{
	//생략
	//Tapestry 5.4 Version - Bootstrap ROOT Change
	configuration.add(SymbolConstants.BOOTSTRAP_ROOT, "classpath:/META-INF/assets");
	//생략
}

*AppModule.java에서 위 내용을 추가합니다.

*이렇게 ROOT(최상위 경로)를 지정해주면,  태피스트리는 알아서(규칙/컨벤션) /META-INF/assets밑에 있는 

 js/bootstrap.js , css/bootstrap.css를 찾아 초기에 자동으로 load합니다.

(이렇게 따로 지정하지 않을 경우, tapestry-core.jar에 있는 bootstrap 3.0이 적용됩니다.)

*결론, 태피스트리 5.4 알파버전이 진행되면서 개선된 클라이언트(화면UI) 부분에서 크게 변경된 부분을 위주로 정리하였습니다.

아직도 조금 부족한 점이 있지만, 이제 태피스트리와 자바스크립트 컴포넌트와 결합하여 컴포넌트 개발이 진행될 수 있을 것 같습니다.

*데모사이트의 실제 AppModule.java 입니다. 

http://nkia-tapestry.herokuapp.com/tapestryrequirejs