캐모마일 UI Adapter 가이드

개요

타 프레임워크에서 상용 UI 솔루션과 연동을 위한 모듈을 제공하나, 해당 프레임워크에 종속적인 형태로 개발이 된다.

Chamomile에서는 프레임워크에 대한 종속성을 탈피하기 위해 Spring MVC에서 제공하는 기술들을 이용하여 상용 UI 솔루션과 연동할 수 있는 방법을 제시한다.

즉, 다시말해 백엔드에서 개발되어지는 코드 자체가 프레임워크에 대한 종속성, 상용 UI 솔루션에 대한 종속성이 제거된다. 상용 UI 솔루션을 사용하지 않는 경우에도 동일한 코드로 서비스를 제공할 수 있다. (단, 예외적인 경우도 존재한다.)

현재 가장 많이 사용되는 UI 상용 솔루션인 Nexacro N을 지원한다.

흐름도

UIAdapter는 상용 UI 솔루션과 연동하기 위한 모듈이다.

adapter 들은 java의 SPI (Service Provider Interfaces) mechanism을 이용하여 확장 가능하도록 구성되어져 있다.

UIAdapter의 로드는 Java의 java.util.ServiceLoader에 의해 이루어지고, 해당 jar 파일은 아래와 같은 설정 정보를 포함한다.

UiAdapter의 설치 및 제거는 클래스패스에 존재하는 경우 자동으로 설치되며, 클래스패스에서 삭제하는 경우 제거 된다.

Spring MVC에서 제공하는 기술들을 그대로 사용할 수 있도록 구성된다.

기능 Overview

1. 다중 UI Adapter를 지원한다.
   동적으로 UI Adapter의 변경을 지원한다.
   예) 하나의 Controller가 존재할 때 여러 UI 솔루션에서 호출할 수 있다.

2. 클래스패스에 존재하는 UIAdapter를 자동으로 로드한다.

3. 상용 UI 솔루션이 제공하는 통신타입 처리를 지원한다.

4. Spring의 Controller 관련 기술 및 annotation을 지원한다.

   • @RequestParam, @ModelAttribute, @RequestBody, @ResponseBody, HttpEntity, RequestEntity, ResponseEntity

5. 입/출력 데이터 변환, 및 에러처리를 지원한다.

기능설명

데이터 변환

• 상용 UI 솔루션에서 제공되는 데이터 형식은 아래와 같다.

  • 단일 데이터 (e.g. Variable)

    • Primitive 형식의 데이터이며, 식별자(name)와 값(value)를 가지고 있다.

  • 2차원 데이터 (e.g. DataSet)

    • DB의 테이블 형식과 유사한 형태이며, 단일 데이터를 복수개를 가지고 있는 데이터이다.

    • 데이터 형식에 따라 복수의 행을 가지고 있을 수 있다.

    • websquare의 경우 map 형식과 list 형식으로 구분할 수 있다.

• UI 솔루션의 종속성을 탈피하기 위해 Spring의 Controller 레벨에서 데이터 변환을 수행하게 된다. (UI 솔루션 ↔ Java Bean)

  • 단일 데이터 변환

    • byte[], int, float, double, Boolean (Support wrapper class)

    • java.lang.String, java.math.BigDecimal, java.util.Date, java.util.Object

    • UI 솔루션에서 제공되는 타입만을 변환한다.

  • 2차원 데이터

    • List\<Java Bean \| Map\>

    • Java Bean (ValueObject) \| java.util.Map

    • Java Bean으로 변환하게 되는 경우 멤버 변수의 변환 가능한 타입은 단일 데이터 변환 시 지원하는 타입만을 제공한다. (Bean에 getter/setter가 존재 해야 한다.)

• 2차원 데이터 변환 시 상세한 내용은 아래와 같다.

  • 2차원 데이터의 열의 명칭은 Java Bean의 멤버변수와 대응된다.

  • Map으로 변환하게 되는 경우 식별자로 사용된다.

    • 첫 번째 행만을 대상으로 하며, 나머지 행의 데이터는 무시된다.

  • 복수개의 행으로 구성되는 경우 List 형태로 변환할 수 있다.

    • 모든 행의 데이터가 변환된다.

[그림] 데이터 변환

프로젝트 설정

캐모마일 3.0에서는 스프링 부트 기반으로 캐모마일 UIAdapter가 적용된 샘플을 제공한다.

프로젝트 구성에 필요한 빈과 컴포넌트는 AutoConfiguration을 통해 자동으로 주입 되어 개발 시에 신경 쓰지 않아도 된다.

따라서, UI Adapter를 사용하기 위해선 다음의 절차를 거치면 된다.

1. 캐모마일 샘플 프로젝트 생성(ex. chamomile-sample-boot-security-adapter-nexacro)

2. pom.xml 확인

   <dependencies> <dependency><!-- 벤더에 맞는 어댑터 적용 --> <groupId>net.lotte.chamomile.module</groupId> <artifactId>chamomile-adapter-nexacro</artifactId> </dependency> <dependency> <groupId>net.lotte.chamomile.module</groupId> <artifactId>chamomile-security-adapter</artifactId> </dependency> </dependencies>

3. application.yml 파일 확인 후 excludePatterns 적용

   chmm: uiadapter: excludePatterns: /index.html,/favicon.ico

업무시스템 개발하기

캐모마일 UIAdapter를 사용하면 특정 벤더사의 어댑터에 종속 될 필요 없이 스프링 WebMVC를 사용하여 개발하듯이 개발을 진행하면 된다.

샘플 프로젝트에 나와있는 방식대로 개발을 진행하면 빠르게 개발을 수행할 수 있다.

1. Controller 구성

   demo.user.controller.UserController.java

   import com.nexacro.uiadapter.spring.core.data.NexacroResult; import demo.user.controller.dto.SearchRequest; import demo.user.controller.dto.UserRequest; import demo.user.controller.dto.UserResponse; import demo.user.domain.User; import demo.user.service.UserService; import lombok.RequiredArgsConstructor; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.ModelAttribute; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.servlet.ModelAndView; import java.util.List; import java.util.stream.Collectors; @Controller @RequiredArgsConstructor @RequestMapping(path = "/model-attribute") public class UserController { private final UserService userService; @RequestMapping(value = "/user/list") public ModelAndView getUserList(@ModelAttribute(name = "input1") SearchRequest request) { List<User> userList = userService.getUsersBySearchRequest(request); List<UserResponse> results = userList.stream().map(UserResponse::of).collect(Collectors.toList()); ModelAndView mv = new ModelAndView(); mv.addObject("output1", results); return mv; } @RequestMapping(value = "/user/update") public ModelAndView updateUserList(@ModelAttribute(name = "input1") List<UserRequest> request) { userService.updateUserList(request); return new ModelAndView(); } }

2. Service 구성

   demo.user.service.UserService.java

   import demo.user.controller.dto.SearchRequest; import demo.user.controller.dto.UserRequest; import demo.user.domain.User; import java.util.List; import java.util.Map; public interface UserService { List<User> getUsersBySearchRequest(SearchRequest searchRequest); void updateUserList(List<UserRequest> userRequests); }

   demo.user.service.UserServiceImpl.java

   import com.nexacro.java.xapi.data.DataSet; import demo.user.controller.dto.SearchRequest; import demo.user.controller.dto.UserRequest; import demo.user.domain.User; import demo.user.domain.UserMapper; import lombok.RequiredArgsConstructor; import org.springframework.stereotype.Service; import java.util.List; @Service @RequiredArgsConstructor public class UserServiceImpl implements UserService { private final UserMapper userMapper; @Override public List<User> getUsersBySearchRequest(SearchRequest searchRequest) { return userMapper.findUsers(searchRequest); } @Override public void updateUserList(List<UserRequest> userRequests) { for (UserRequest userRequest : userRequests) { User user = userRequest.convertToUser(); if (isInsertType(userRequest)) { userMapper.insertUserList(user); continue; } if (isUpdateType(userRequest)) { userMapper.updateUserList(user); continue; } if (isDeleteType(userRequest)) { userMapper.deleteUserList(user); } } } private boolean isDeleteType(UserRequest userRequest) { return userRequest.getRowType() == DataSet.ROW_TYPE_DELETED; } private boolean isUpdateType(UserRequest userRequest) { return userRequest.getRowType() == DataSet.ROW_TYPE_UPDATED; } private boolean isInsertType(UserRequest userRequest) { return userRequest.getRowType() == DataSet.ROW_TYPE_INSERTED; } }

3. VO 구성

   demo.user.domain.User.java

   import lombok.*; import javax.persistence.*; @Entity @Getter @Setter @NoArgsConstructor @AllArgsConstructor @Builder @EqualsAndHashCode public class User { @Id @GeneratedValue(strategy = GenerationType.IDENTITY) @Column(name = "ID") private Long id; @Column(name = "NAME") private String name; @Column(name = "DESCRIPTION") private String description; @Column(name = "USE_YN") private Boolean useYn; @Column(name = "REG_USER") private String regUser; }

4. Mapper 구성 demo.user.domain.UserMapper.java

   import demo.user.controller.dto.SearchRequest; import org.apache.ibatis.annotations.Mapper; import java.util.List; @Mapper public interface UserMapper { List<User> findUsers(SearchRequest request); void insertUserList(User sample); void updateUserList(User sample); void deleteUserList(User sample); }

5. XML 매퍼 구성 resources/sql/service/UserMapper.xml

   <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd"> <mapper namespace="demo.user.domain.UserMapper"> <resultMap id="user" type="demo.user.domain.User"> <id column="ID" property="id"/> <result column="NAME" property="name"/> <result column="DESCRIPTION" property="description"/> <result column="USE_YN" property="useYn"/> <result column="REG_USER" property="regUser"/> </resultMap> <select id="findUsers" parameterType="demo.user.controller.dto.SearchRequest" resultMap="user"> SELECT * FROM USER WHERE 1=1 <if test="keyword != null and keyword != ''"> <choose> <when test="searchType == 'ID'"> AND ID = #{keyword} </when> <when test="searchType == 'NAME'"> AND NAME LIKE #{keyword} </when> </choose> </if> ORDER BY ID ASC </select> <insert id="insertUserList" parameterType="demo.user.domain.User"> INSERT INTO USER ( ID , NAME , DESCRIPTION , USE_YN , REG_USER) VALUES ( #{id} , #{name} , #{description} , #{useYn} , #{regUser}) </insert> <update id="updateUserList" parameterType="demo.user.domain.User"> UPDATE USER SET ID=#{id} , NAME=#{name} , DESCRIPTION=#{description} , USE_YN=#{useYn} WHERE ID = #{id} </update> <delete id="deleteUserList" parameterType="demo.user.domain.User"> DELETE FROM USER WHERE ID = #{id} </delete> </mapper>

특이사항

UI Adapter 샘플코드

캐모마일 UI Adapter와 넥사크로 UI Adapter를 쉽게 활용하여 프로젝트를 시작할 수 있도록 샘플 코드를 만들어두었다.

캐모마일 IDE의 다음 archetype을 생성하여 프로젝트를 시작하면 넥사크로N 예제를 실행해볼 수 있다.

• chamomile-sample-boot-adapter-nexacro

  • 스프링 시큐리티 기반 캐모마일 어댑터를 활용한 넥사크로 프로젝트 샘플

• chamomile-sample-boot-nexacro

  • 넥사크로 어댑터를 활용한 캐모마일 넥사크로 프로젝트 샘플

• chamomile-sample-boot-security-adapter-nexacro

  • 캐모마일 시큐리티 기반 캐모마일 어댑터를 활용한 넥사크로 프로젝트 샘플

• chamomile-sample-boot-security-nexacro

  • 캐모마일 시큐리티 기반 넥사크로 어댑터를 활용한 넥사크로 프로젝트 샘플