React.js (http://facebook.github.io/react/)
: Facebook, Instagram 에서 사용하는 View Library. Data binding 이 가능하고, Light-Weight 로 강력한 성능을 자랑합니다.
요녀석 한번 써보겠다고, 삽질 좀 했네요 ;ㅂ; 여차저차 세팅을 완료 하긴 했는데, 썩 만족스럽지는 않습니다 ㅠㅠ
JSX 지원.
React.js 에서는 Human-Readable 한 코드 작성을 위해 JSX 란 문법을 지원합니다. 이놈이 문젭니다 ㅠㅠ
Developing 중에는 JSXTransformer.js 를 통해서 실시간 Compiling 을 하는데요, Production 에서는 pre-complie 후에 배포 하길 권고 합니다.
여기서 Dev와Production간의 설정이 달라집니다.
1. JSXTranformer.js 를 include 해줘야함.
2. 개발에는 JSX 파일, Production 에는 JS파일을 include해야함.
2-1 script path가 달라짐
2-2 include 시에 JSX 는 type="text/jsx", JS는 type="javascript"가 되어야함.
3. Package 시에 시에 JSX -> JS compile을 해줘야함.
자 그럼 하나씩 해결해볼까요 ㅠㅠㅠ
1. JSXTranformer.js 를 include 해줘야함.
maven-resource-plugin과 property configure를 통해 include 여부 결정
jsp 는 template engine (tiles)를 통해 골격을 관리하고 있기 때문에 base template에서만 들어 있으니 쉽게 해결.
2-1 script path가 달라짐
2-2 include 시에 JSX 는 type="text/jsx", JS는 type="javascript"가 되어야함.
[1]번 과 같은 방법으로 해결하고자 했으나, 해당 코드는 base template 에서 사용되는게 아니라 화면별로 들어 가야 되서 삶이 고달파짐 ㅠㅠ
maven-resource-plugin 과 property 를 통해 DEV/PRODUCT을 분기 하고, custom taglib를 통해서 코드 생성토록 함.
3 Package시에 JSX -> JS compile
Facebook에서 제공하는 jsx command 를 maven exec plugin 으로 실행하도록 함.
bds 에서 build 할때 goal 을 clean package -> clean exec:exec package으로 변경하여 deploy 하도록함.
* 이부분이 특히 마음에 안듬 ㅠㅠ