Back-end/FrontEnd

웹스퀘어 Web Square 란? (프론트 소스를 알아서 짜준다고?)

cheersHena 2022. 2. 4. 16:32
반응형

웹스퀘어 Web Square 란?

웹 표준을 준수한 UI프레임워크로 UI컴포넌트와 Util API, 통합 개발 도구 제공하는 솔루션이라고 한다. 쉽게 말해 프론트 화면 개발 툴이다. 프론트개발을 그켬하는 백엔드 개발자인 나에게는 신세계일 따름...
마치 대딩 때 처음 접했던 자바 스윙 업그레이드 버젼 같기도 하고..;

디자인 탭에서 화면을 미리 볼 수 있는데 PPT에서 개체 추가 해주듯이 만들고자 하는 요소들을 추가하고,

속성에서 ID 지정 등 데이터를 입력한 뒤, Source 탭에 들어가보면 방금 마우스로 끄적거린 작업들이 HTML/JS 소스로 완성되어있다. WOW .... 

화면 노가다를 해야하는 수고는 확실히 덜어주기는 하지만 디자인 등이 정형화 되어있고 모든 문법이 websquare에 종속되어 있어서 자유도는 매우 떨어진다.. 장단점은 좀 더 써보아야 알겠지만 개인적인 생각은 기업을 타겟으로 만들어진 정형화된 솔루션이라는 생각이다.

 js는 안그래도 못하는데 더 까먹을 것 같다 크흨..

구성 및 설정

웹 표준 준수로 설치과정에 별도의 installer 및 Active-x등이 존재하지 않음
별도 설치과정 없이 Web Resource와 함께 포함되어 구성되며, 이때 WebSquare를 구동하기 위한 Servlet,

즉 웹스퀘어 엔진을 등록하고 서버설정 디렉토리를 지정해주면 된다.

web.xml )

<servlet>
    <servlet-name>websquareDispatcher</servlet-name>
    <servlet-class>websquare.http.DefaultRequestDispatcher</servlet-class>
    <init-param>
        <param-name>WEBSQUARE_HOME</param-name> 
        <param-value>~/~/~/websquare_home</param-value>
    </init-param>
</servlet>	

<servlet-mapping>
    <servlet-name>websquareDispatcher</servlet-name>
    <url-pattern>*.wq</url-pattern>
</servlet-mapping>
    

 

화면 호출 방식

웹스퀘어로 개발 된 화면파일은 단독으로 브라우저에서 실행할 수 없음.
화면 파일은 웹스퀘어 javaScript 엔진을 통해 실시간 해석되어 브라우저에 표시된다.
웹스퀘어 엔진은 서버에 배포된 websqaure.html파일을 통해 호출되고 엔진 로딩이 끝나면 실행된다
즉, 모든 웹스ㅞ어 화면 파일은 websquare.html을 통해 실행된다.
일반적으로 화면 파일의 정보는 Get방식의 파라미터를 통해 웹스퀘어 엔진에 전달된다.

웹스퀘어 화면을 브라우저에서 호출해 보자.
ex)

http://domain.com/websquare/websquare.html?w2xPath=/MA/MA01M01.xml

http://domain.com :서버 도메인
/websquare/websquare.html :웹스퀘어 엔진 로딩 및 실행파일
HTML 의 DocType, Meta 등 정의
파일명 변경 가능하여 용도에 따라 파일 여러개 사용 가능
파일 확장자를 jsp로변경할 수 있다.
?w2xPath=/MA/MA01M01.xml :웹 스퀘어 화면 파일 경로.
웹 스퀘어 엔진이 xml(UI grid)파일을 해석하여 HTML과 JavaScript를 생성하고 실행.

 

 

서버 통신 플로우 


 

 
반응형