사이버이메지네이션 56

성능 TEST를 위한 보고서 1

1. 성능 TEST ? 서비스 및 서비스 시스템의 성능을 확인하기 위해 실사용 환경과 비슷한 환경에서 테스트를 진행하는 것입니다. 2. 성능 TEST의 종류 성능테스트는 목적에 따라 다음과 같이 나뉩니다. Load 테스트 시스템의 성능을 벤치마크 하기 위한 테스트를 의미합니다. 이 테스트는 부하(Load)를 순차적으로 증가시키면서 응답시간이 급격히 증가하거나 더는 처리량이 증가하지 않거나 시스템의 CPU와 Memory 등이 기준 값 이상으로 증가하는 등 비정상 상태가 발생하는 임계점을 찾아 이를 바탕으로 성능 이슈에 대한 튜닝과 테스트를 반복합니다. Stress 테스트 임계값 이상의 요청이나 비정상적인 요청을 보내 비정상적인 상황의 처리 상태를 확인하고 시스템의 최고 성능 한계를 측정하기 위한 테스트를 ..

유용한 정보 2019.06.18

D3.js를 이용하여 웹차트 만들기2 - 파이그래프

웹차트 만들기 1편에 이어 응용 편으로 파이그래프를 그려보도록 하겠습니다~! 파이그래프 그리기 먼저, 파이그래프의 전체적 윤곽을 잡는 코드와 설명입니다. [line6] D3 라이브러리를 사용하기 위해서 해당 스크립트 링크 주소를 넣어줍니다. [line11 ~ 15] 파이차트를 그려내기 위해서 고정적으로 사용할 변수들을 선언합니다. - 파이차트를 그려내기 위한 바깥쪽반지름(outerRadius), 안쪽반지름(innerRadius) - d3.scale.category20() 으로 d3 표준색상을 지정합니다. [line17 ~ 22] 파이차트에서 사용할 데이터를 dataset변수에 할당합니다. [line24 ~ 30] 해당라인의 코드는 아래와 같은 구조로 후에 그리게 될 파이차트를 감싸는 태그를 만듭니다. s..

프론트엔드 2019.06.05

D3.js를 이용하여 웹차트 만들기1 – 개념 및 예제

D3.js란? 안녕하세요. 자바스크립트 라이브러리 중 하나인 D3.js에 대해서 소개해드리려고 합니다. D3.js란 자바스크립트 라이브러리를 처음 들어보신 분도 또는 자주 사용해보셨던 분들도 계시겠지만, 이번에는 처음 접해보시는 분들을 위해 조금 자세하고 쉽게 설명해드리도록 하겠습니다. (이미 자주 사용하시고 저보다 더 많은 지식을 알고 계시는 분들에게 미리 양해 말씀드립니다^^) 우선 D3는(D3.js를 줄여서 D3라고 함) 완전히 오픈소스이며, Data-Driven-Documents의 약자로 D가 연속으로 3번 들어가서 일명 D3라는 명칭으로 부르며, 웹브라우저상에서 동적이고 인터렉티브한 정보시각화를 구현하기 위한 자바스크립트 라이브러리입니다. D3의 장점은 새로운 언어 형태가 아니라 자바스크립트 문..

프론트엔드 2019.05.29

Java Web Application 에서의 Angular 개발환경 구성 및 배포

약 1년 전쯤 사내 인트라넷의 모바일 웹을 만드는 프로젝트를 진행하였습니다. 당시 기존의 소스를 그대로 활용하여 모바일 화면에 맞춘 웹 퍼블리싱만 작업하면 쉽게 포팅이 가능하였지만, 개인적으로 Angular 를 학습해보고 싶었던 때였습니다. 그래서 Angular를 사용하여 만들기를 건의하여 컨펌받고 작업에 착수하였습니다. 지금까지 Java, JSP를 다뤄오고 JavaScript라고 해봤자 ES5 기반의 문법과 jQuery 라이브러리 정도만 사용하다가 처음으로 Node.js, Angular, ES6, TypeScript 등의 JavaScript 신문물들을 접하게 되니 대체 어떤 것부터 진행해야 할지 막막했었지만 필요한 부분들을 서적과 가이드 문서를 참고하여 차근차근 학습해가다 보니 결국 완성하긴 했습니다...

프론트엔드 2019.05.23

일렉트론 개발환경 구축하기

앞서 Electron 개념을 정리해보았는데요. 오늘은 Electron 개발환경 구축에 대해 정리해보았습니다. Electron 개념에 대한 내용은 아래 링크에서 확인해 볼 수 있습니다. [Electron 개념정리 클릭] Electron 애플리케이션은 근본적으로 Node.js 애플리케이션이라고 할 수 있습니다. 그렇기에 사용자의 데스크톱에 Node.js 와 git이 기본적으로 설치되어 있다는 가정 하에 일렉트론 개발하기를 진행하겠습니다. 일렉트론 설치하기 간단한 프로젝트 생성을 위해 먼저 electron_test라는 폴더를 생성 후 깃헙을 통해 일렉트론 프로젝트를 생성합니다. 프로젝트가 생성이 된다면 생성된 프로젝트 디렉터리로 이동하여 의존성 설치와 애플리케이션 실행을 실행시켜 줍니다. 설치와 실행이 다 되..

프론트엔드 2019.05.03

풋풋한 CI 신입직원 인터뷰

이제 막 수습을 통과한 사이버이메지네이션 신입 직원들의 풋풋한 인터뷰 내용을 지금 공개합니다. 입사지원 동기는 다르지만 열심히 임하는 성실한 자세, 남에게 지기 싫어하는 승부욕 등 몇가지 공통점을 가지고 있어 미래가 더욱 기대되는 직원들입니다. 사이버이메지네이션에서 더 많이 배우고, 더많이 공부하여 전문 개발자, 기획자로 성장하길 응원합니다. Q. 입사지원 계기 (강*민) 입사할 때 가장 크게 생각한 부분이 일이 어렵고 힘들어도 내가 하고 싶은 일을 하자!!, 체계가 정확히 잡혀 있는가?, 배울 점이 많이 있는가? 였어요. 그중에서도 사이버이메지네이션이 업계에서 오래되어서 체계가 정확히 잡혀 있을 거라는 생각을 하였고 회사 자체 프레임워크 등을 개발하여 사용한다는 점에서 입사하게 된다면 많은 부분을 배울..

기타 2019.04.25

(UI컴포넌트)webPonent CHART 2.1.0 버전 업그레이드

안녕하세요. HTML5 기반의 데이터 인포그래픽 컴포넌트 webPonent CHART의 Visual Radar Chart 추가 버전 업그레이드 소식을 안내드립니다. 추가된 Radar 차트의 기능 및 사용환경은 아래와 같습니다. (Radar CHART) - 여러 개의 데이터를 한번에 보여주기 유용 - 데이터 개수에 따라 다각형 세팅 가능 - 차트 눈금 개수 지정 가능 - Tick 모양(원, 사각형, 삼각형, 별, 다이아몬드) 설정 가능 - Tooltip을 이용해서 커서가 틱을 가리킬 때 해당 데이터를 불러올 수 있음 - 시계열 사용 가능 - 애니메이션 효과 사용 가능 - 범례 사용 가능 - 데이터의 크기를 패턴으로 나타낼 수 있음 (사용환경) - 서버: 모든 서버 - 언어: 개발언어에 종속되지 않음(htm..

Electron 개념정리

안녕하세요 데스크톱 애플리케이션을 개발하기 위해 공부한 일렉트론이라는 프레임 워크에 대해서 정리해 보겠습니다. Electron은 2013년 GitHub이 텍스트 편집기인 Atom을 만들기 위해 개발한 프레임 워크입니다. 2014년 Atom과 Electron이 오픈 소스로 공개가 되면서, 지금은 많은 개발자들과, 회사들에게 사랑 받는 인기 있는 도구가 되었습니다. 기본적인 웹 지식만 있다면 누구든 데스크톱 애플리케이션 개발자로 만들어주는 일렉트론에 대해서 지금부터 설명하겠습니다. 1. 일렉트론(Electron)이란? Electron은 Native애플리케이션이며 Chromium과 Node.js를 1개의 런타임으로 통합하여 JavaScript, HTML, CSS만 가지고도 데스크톱 애플리케이션을 만들 수 있도..

프론트엔드 2019.04.11

(API서버)국산 API 솔루션 ‘D-Bridge’ 구축 사례 통해 다양한 정보 확인 가능

사이버이메지네이션의 API서버 D-Bridge 제품관련 기사를 소개해 드리겠습니다 [D-Bridge는 자체 기술로 개발한 국산 API 솔루션으로 마이데이터 기반 사업을 준비 중이거나 외부사업자와 제휴를 통한 판매채널 확대, 어플리케이션을 빠르고 편리하게 변경, 추가할 수 있는 마이크로 서비스 형태의 업무시스템 구축을 고려하는 기업들에 적합하다는 평가를 받고 있다. 또한 온라인 금융 서비스에서 준수돼야 하는 보안 기능 또한 기본으로 제공되어 금융권에서 구매가 이어지고 있다...(중략) 한편 D-Bridge 도입을 통한 API Platform 주요 구축 사례는 다음과 같다. △SK증권: 금융권 공동 핀테크 오픈 플랫폼, 외부사업자 연계 포트폴리오 자산관리 서비스(쿼터백) △코스콤(해외납품): 말레이시아거래소..

OPEN Source를 이용한 검색엔진 개발(2)

지난 포스팅에 OPEN Source를 이용한 검색엔진에 대한 기본적인 내용을 공유 하였고 이번 회차에서는 검색엔진의 수집, 색인, 검색에 대한 내용에 대해 상세히 공유 하도록 하겠습니다. 수집 – 검색엔진의 목적에 맞게 사용자가 필요로 하는 정보를 준비하는 과정 - 다양한 형태로 존재하는 비정형 데이터(정보)를 필요에 따라 추출 - 가장 많이 사용되는 웹 페이지 크롤링과 DBMS에 저장된 데이터를 수집하는 과정을 통해 예를 들어 설명 1. 크롤링 웹 페이지를 그대로 가져와서 데이터를 추출해 내는 행위. 크롤링을 하는 소프트웨어를 크롤러라고 부름 - 검색 엔진에서는 웹 상의 다양한 정보를 자동으로 검색하고 색인하기 위해 사용. - 일일이 해당 사이트의 정보를 검색하는 것이 아닌 끊임없이 새로운 웹 페이지를..

유용한 정보 2019.03.22