webPonent 6

[웹포넌트 차트] webPonent Visual Gauge Chart

[웹포넌트 차트] webPonent Visual Gauge Chart webponent CHART 2.0.6 버전이 릴리즈 되었습니다. (짝짝짝)2.0.6버전에 맞추어 새롭게 추가된 Gauge Chart에 대해 작성해보려 합니다. gauge chart는 크게는 원형 게이지(angular), 선형 게이지(Linear), 실린더(cylinder), 온도계(thermometer) 이렇게 크게는 4가지, 세부적으로는 8가지 타입으로 구성되어져 있습니다. 디자인 테마로는 기본 디자인(Basic), 블랙 디자인, 라이트 그레이 디자인 3가지 종류가 있습니다. 여기에 option과 style을 주어 원하는 색상의, 모양의 게이지를 만드실 수 있습니다.예를 들면, 하나의 실린더도 필요에 맞게, 나만의 스타일로 변경 가..

[웹포넌트 가상키보드] 다운로드부터 설치까지!!

[웹포넌트 가상키보드] 다운로드부터 설치까지 같이 해볼까요? 두달전쯤 webPonent VIRTUAL KEY(웹포넌트 가상키보드)를 출시하고 '박토끼' MD가 직접 소개글을 써주셨는데요. 이번글에서는 제가 가상키보드를 다운로드에서 부터 설치까지 진행해보고 직접 사용까지 해보겠습니다. 웹포넌트 가상키보드는 가격이 저렴할뿐만 아니라 30일간 사용 할 수 있는 트라이얼 버전을 제공해서 무료로 현재 서비스하는 페이지에 직접 적용 시켜 바로 확인 할 수 있습니다. 바로 다운로드할 수 있는 페이지로 가볼게요! 웹사이트로 이동 을 누르시면 웹포넌트 사이트로 이동하는데요 아래와 같이 중간쯤에 보면 CHART, GRID 제품외에 가상키보드 제품 메뉴가 보입니다. 위에 빨간색 네모박스 버튼을 누르면 트라이얼 다운로드 페이..

HTML5 로 데스크탑 어플리케이션 만들기 3

HTML5 로 데스크탑 어플리케이션 만들기3 안녕하세요. CX 사업본부 MD 왓썹입니다.지난 포스팅에서는 node-webkit 을 이용하여 간단한 데스크탑 어플리케이션을 만들어 테스트해보는 시간을 가졌는데요. 이번 포스팅에서는 node-webkit이 실제 프로젝트에 적용되어 어떻게 사용되는지 알아보도록 하겠습니다. 1. 프로젝트 소개먼저 node-webkit 을 적용할 프로젝트는 웹포넌트 팀에서 개발한 webPonent-publisher 로 조금은 생소하지만 아주 편리한 웹 코드 편집 툴 입니다. 웹포넌트 퍼블리셔는 프로토타입 및 샘플 소스 작성 등에 특화된 실시간 웹 코드 에디터로, 웹포넌트 차트&그리드의 각 기능에 해당하는 다양한 샘플 코드 (HTML, CSS, JS) 를 사용자에게 제공하고 있으며,..

프론트엔드 2016.01.15

TypeScript를 이용하여 javascript를 객체지향 언어처럼 사용해보자

TypeScript란?TypeScript는 대형 자바스크립트 애플리케이션에 적합한 대안 언어이다. TypeScript를 활용하여 개발하여도 기존의 소프트웨어 컴포넌트와 자바스크립트 라이브러리의 동작 방식과는 충돌하지 않는다. 또한, 동적인 모듈 로딩을 지원하여 네이밍 충돌 문제를 줄일 수 있게 해주며, 추가된 타입 체계를 바탕으로 생산성을 높여주는 여러가지 툴과 사례(정적 타이핑, 심볼 기반 네비게이션, 구문 완성, 코드 리펙토링 등)를 활용할 수 있다.TypeScript는 ES5 (ECMAScript 5) 문법의 상위 집합(Super Set)이다. 모든 자바스크립트 프로그램은 TypeScript 프로그램이기도 하다. TypeScript 컴파일러는 TypeScript 문법을 자바스크립트 문법으로 변환시켜..

프론트엔드 2015.11.19

영화에 관한 흥미로운 통계들

영화 선택에도 기준이 있다, 통계로 알아본 영화 선택의 A to Z 이미지 출처 http://longer.tistory.com/22 하루동안 자신이 원하는 방식으로 선택할 수 있을까? 기본적으로 7~8시간은 잠을 자야하고 1시간 정도는 밥을 먹어야 하며 생계를 위해서 8시간 이상은 일을 해야 합니다. 그렇게 퇴근을 하고 집에 돌아와 드라마 한 편을 보는 "선택의 시간"은 그리 많지 않습니다. "선택의 시간"이 적은 상황이라면 사람들은 좀 더 효율적이고 적극적인 자극을 추구할 것입니다. 극장 영화는 사람들이 "선택의 시간"에 가장 많이 투자하는 문화 생활 중 하나 입니다. 하지만 '나에게 맞는 영화', '좋은 영화'를 선택하기란 쉽지 않습니다. 귀중한 시간에 관람한 영화를 통해 재미를 못 느꼈다면 그 실망..

유용한 정보 2015.09.11

PhantomJS로 GRID&CHART를 PDF 출력하기 (1편 : 시작하기)

웹포넌트 그리드와 차트는 웹 상에서 표현된 데이터를 Excel, CSV, PDF 등의 파일로 추출하는 기능을 가지고 있습니다. 데모 보러가기 클릭!! 그 중 PDF를 추출하는 기능은 PhantomJS 라는 툴을 이용하여 만들었는데요, PDF추출 기능을 구현하며 처음 사용해 된 PhantomJS! 세상 모든것들이 그렇듯 잘 사용하기만 하면 아주 유용한 녀석입니다. 만들면서 많은 시행착오를 겪게 되었는데요, 앞으로 몇 회에 걸친 글을 통해 구현하면서 얻게 된 Know How와 Tip들을 공유해보도록 하겠습니다. 그 첫 시간으로 PhantomJS란 과연 무엇인지에 대한 간략한 설명과 함께 기본적인 Screen capture에 대해 설명하도록 하겠습니다. 1. PhantomJS 란? PhantomJS 공식 홈페..