개요
다른 팀에서 작업하던 MES 개발을 하던 중 인력이 부족하여 인력 추가 요청이 들어와, 추가 투입이 되었다. 다른 팀에서 요청을 한 내용은 프린터기에서 바코드 출력, 바코드 리더기를 통한 입력 라우팅, 기존 시스템에서 멀티 페이지 시스템 구현이였다. 바코드 출력은 프린트 API를 통하여 간단하게 구현 할 수 있었다. 그리고 바코드 리더기는 키보드 형식으로 인식을 하기 때문에 웹 페이지에서 키보드 후킹을 통하여 쉽게 구현 할 수 있었다. [관련 자료는 이와 같다.] 바코드 입력 및 출력 시스템을 라이브러리화 하여 간편하게 쓸 수 있도록 하였다. 그 중 가장 어려운 작업은 “기존 시스템”에서 “새로운 기능”을 추가하는 것 인 멀티 페이지 시스템 구현 이였다. 추가 임금이 적었기 때문에 적은 시간안에 최대의 효율을 낼 수 있는 방법을 고안해야 했다. 그래서 생각 해 낸것이 iframe을 이용하여 멀티 페이지를 구현 하였다.
기존 시스템 및 통합 과정
멀티 페이지란 개념은 초기설계 단계 부터 존재 하지 않던 내용이였다. 그렇다 보니 멀티 페이지 구현을 하기 위한 구현이 되어 있지 않아 어려움이 있었다. 그래서 기존 페이지의 라우팅을 iframe 형식으로 변경한 뒤 상단에 버튼을 만들어 구현하였다. 구현 방식을 최대한 간단하게 만들어야 했다. 구현 방식으로는 아래와 같다.
- Menu 버튼을 누르면 넘어가던 라우팅을 iframe 생성 하는 코드로 변경함.
- iframe 생성과 동시에 상단에 버튼을 추가함.
- 상단에 있는 버튼을 클릭시, 해당 iframe을 최 상단으로 옮김 (간단하게 모두 hidden 한 뒤, 특정 인덱스만 visible 하는 방식)
이러한 방식을 채택한 덕에 엄청 간편하게 구현 할 수 있었으며, 기존 시스템을 쉽게 통합 할 수 있었다.
결과
결과물은 아래와 같다.
마무리
히히 응가뿡뿡 나이쓰띠 >< 외주나, 기업 연계 연구과제는 최대한 심플이 쵝오!