- 대화식 웹 애플리케이션의 제작을 위해 다음과 같은 조합을 이용하는 웹 개발 방법
1. 표현 정보를 위한 HTML(또는 XHTML)과 CSS
2. 동적인 화면 출력 및 표시 정보와의 상호 작용을 위한 DOM, 자바스크립트
3. 웹 서버와 비동기적으로 데이터를 교환하고 조작하기 위한 XML, XSLT, XMLHttpRequest(Ajax 애플리케션은 XML/XSLT 대신 미리 정의된 HTML이나 일반 텍스트, JSON, JSON-RPC를 이용 가능).
- DHTML이나 LAMP와 같이 Ajax는 자체가 하나의 특정을 기술을 말하는 것이 아니며, 함께 사용하는 기술의 묶음을 지칭하는 용어이다.
실제로 AFLAX와 같이 사실상 Ajax에 바탕을 두고 있는 유사/복합 기술들이 속속 나타나고 있다.
- 기존 기술과의 차이점
: 기존의 웹 애플리케이션은 브라우저에서 폼을 채우고 이를 웹 서버로 submit(하나의 요청이 됨)하면, 웹 서버에서 요청된 내용에 따라 데이터를 가공하여 새로운 웹 페이지를 작성하고 응답으로 되돌려 주는 형태이다. 일반적으로, 최초에 폼을 가지고 있던 페이지와 사용자가 이 폼을 채워 결과물로서 되돌려 받은 페이지는 유사한 내용을 가지고 있는 경우가 많다. 결과적으로 중복되는 HTML 코드를 다시 한 번 전송 받게 됨으로써 많은 대역폭을 낭비하게 된다. 대역폭의 낭비는 금전적 손실을 야기할 수 있으며 사용자와 대화(상호 반응)하는 서비스를 만들기 어렵게도 한다.
반면에, Ajax 애플리케이션은 필요한 데이터만을 웹 서버에 요청해서 받은 후 클라이언트에서 데이터에 대한 처리를 할 수 있다. 보통 SOAP이나 XML 기반의 웹 서비스 프로토콜이 사용되며, 웹 서버의 응답을 처리하기 위해 클라이언트쪽에서는 자바스크립트를 쓴다. 웹 서버에서 전적으로 처리되던 데이터 처리의 일부분이 클라이언트 쪽에서 처리되므로 웹 브라우저와 웹 서버 사이에 교환되는 데이터량과 웹 서버의 데이터 처리량도 줄어들기 때문에 애플리케이션의 응답성이 좋아진다. 또한, 웹 서버의 데이터 처리에 대한 부하를 줄여주는 일이 요청을 주는 수많은 컴퓨터에 대해서 일어나기 때문에 전체적인 웹 서버 처리량도 줄어들게 된다.
- 장점
1. 페이지 이동없는 고속 화면 전환
2. 서버 처리를 기다리지 않고, 비동기 요청 가능
3. 수신하는 데이터량을 줄일 수 있고, 클라이언트에게 처리 위임 가능
- 단점
1. Ajax를 쓸 수 없는 브라우저에 대한 문제
2. Http 클라이언트의 한정된 기능
3. 페이지 이동없는 통신에 따른 보안상 문제
4. 지원하는 Charset이 한정됨
5. 스크립트로 작성되므로 Debugging이 용이하지 않음
6. 요청을 남발하면, 역으로 서버 부하가 늘 수 있음
** 참고: 위키백과
2011년 3월 27일 일요일
jQeury
- 새로운 종류의 자바스크립트 라이브러리
- 자바스크립트와 HTML 사이의 상호작용을 강조하는 경량화된 웹 애플리케이션 프레임워크로써, 존 레시그에 의해 2006년 뉴욕시 바캠프(Barcamp NYC)에서 릴리즈되었다.
- MIT 라이선스와 GNU 일반 공중 사용 허가서의 듀얼 라이선스하의 자유 오픈 소프트웨어이다.
- 기능
1. DOM 엘리먼트 선택
2. DOM 트래버설 및 수정(CSS 1-3 지원. 기본적인 XPath를 플러그인 형태로 지원)
3. 이벤트
4. CSS 조작
5. 특수효과 및 애니메이션
6. Ajax
7. 확장성
8. 유틸리티 - 브라우저 버전, "each 함수"
9. 자바스크립트 플러그인
- jQuery는 한 개의 자바스크립트 파일로 존재한다. 공통의 DOM, 이벤트, 특수효과, Ajax 함수를 포함한다.
** 참고: jQuery 사이트(jquery.com)
위키백과
- 자바스크립트와 HTML 사이의 상호작용을 강조하는 경량화된 웹 애플리케이션 프레임워크로써, 존 레시그에 의해 2006년 뉴욕시 바캠프(Barcamp NYC)에서 릴리즈되었다.
- MIT 라이선스와 GNU 일반 공중 사용 허가서의 듀얼 라이선스하의 자유 오픈 소프트웨어이다.
- 기능
1. DOM 엘리먼트 선택
2. DOM 트래버설 및 수정(CSS 1-3 지원. 기본적인 XPath를 플러그인 형태로 지원)
3. 이벤트
4. CSS 조작
5. 특수효과 및 애니메이션
6. Ajax
7. 확장성
8. 유틸리티 - 브라우저 버전, "each 함수"
9. 자바스크립트 플러그인
- jQuery는 한 개의 자바스크립트 파일로 존재한다. 공통의 DOM, 이벤트, 특수효과, Ajax 함수를 포함한다.
** 참고: jQuery 사이트(jquery.com)
위키백과
2011년 3월 24일 목요일
JavaScript
- 객체지향 프로그래밍을 지원하는 인터프리터 방식의 프로그램 언어
- 변수의 타입을 명시할 필요가 없는 타입 제약이 약한 언어
- 자바스크립트가 가장 널리 사용되는 곳은 웹 브라우저!!
- 처리 시점(자바스크립트는 언제 실행될까?)
: 일단, 가장 먼저 우선권을 얻는다고 보면 된다.
그것이 즉시 시행하는 명령이면 실행을 바로 하고, 함수 부분이면 메모리에 기록하였다가 특정한 사용자 이벤트(mouse click, change, select 등)가 발생할 때 해당 함수를 호출하여 사용한다.
따라서, 대부분의 함수는 HEAD 부분에 위치하여 호출되기 전에 메모리에 올라가게 만들고, 즉시 시행되는 부분은 BODY 부분에 위치하여 필요한 곳에 배치하게 된다.
<< 문법 >>
- 대소문자를 구분하는 언어다.
(대소문자를 구분하지 않는 HTML과 혼동하지 말자!)
- 많은 수의 자바스크립트 객체와 프로퍼티가 HTML 태그나 어트리뷰트 이름과 동일하다.
- HTML에서는 태그나 어트리뷰트 이름을 대소문자의 구별 없이 입력해도 되지만, 자바스크립트에서는 모두 소문자로 입력해야 한다.
- C, C++, 자바와 마찬가지로 자바스크립트 또한 각 문장의 구분을 위해 세미콜론을 사용한다.
- 문장들이 서로 다른 줄에 있는 경우, 세미콜론의 생략이 가능하지만, 세미콜론을 생략하는 것은 좋은 프로그래밍 습관이 아니므로 항상 사용하는 것이 좋다.
- 식별자 사용 시, 숫자는 첫 번째 문자로 허용되지 않는다.
(숫자와 식별자를 쉽게 구별할 수 있게 하기 위한 제약 조건)
- 예약어
1. 예약되어 있는 자바스크립트 키워드들
: break
: case, catch, continue
: default, delete, do
: else
: false, finally, for, function
: if, in, instanceof
: new, null
: return
: switch
: this, throw, true, try, typeof
: var, void
: while, with
2. ECMA 확장을 위해 예약되어 있는 단어들
: abstract
: boolean, byte
: char, class, const
: debugger, double
: enum, export, extends
: final, float
: goto
: implements, import, int, interface
: long
: native
: package, private, protected, public
: short, static, super, synchronized
: throws, transient
: volatile
3. 사용하지 말아야 할 기타 식별자들
: arguments, Array, as
: Boolean
: Date, decodeURI, decodeURIComponent
: encodeURI, Error, escape, eval, EvalError
: Function
: Infinity, is, isFinite, isNaN
: Math
: namespace, NaN, Number
: Object
: parseFloat, parseInt
: RangeError, ReferenceError, RegExp
: String, SyntaxError
: TypeError
: undefined, unescape, URIError, use
CSS 스타일시트 정의 방식
1. 임베디드 방식
: <style type="text/css"></style> 을 사용하여 스타일을 지정하는 방식
(type="text/css"는 생략하고 <style>만 써도 됨)
: <head></head> 태그 사이에 정의한다.
: HTML 소스에 그대로 삽입된다.
-> 일반적으로 공통된 스타일시트가 적용되는 웹페이지의 수가 적을 때 사용
<html>
<head>
<style type="text/css">
/* 이 곳에 스타일 정의!! */
</style>
</head>
<body>
...
</body>
</html>
2. 링크 방식(추천!)
: <style></style> 태그는 생략하고, 파일에 스타일 내용만 작성하여 확장자를 css로 저장한 후 <link>태그를 사용하여 불러들이는 방식
: 외부파일(*.css)로 정의한다.
-> 여러 페이지에 동일한 스타일을 적용할 때 사용
(다른 HTML 문서에도 스타일을 링크만으로 일관성있게 만들 수 있음)
<link rel="stylesheet" type="text/css" href="*.css" />
3. 인라인 방식
: 태그 하나하나에 일일이 속성값으로 지정해주는 방식
: 태그내에 스타일을 적용하는 것이다.
->권장하지 않는 형태이나 특정한 스타일만 써야 할 필요가 있다면 사용해도 무방하다.
<font style="font-family: 궁서; font-size:9pt; color:#ff0000>...</font>
: <style type="text/css"></style> 을 사용하여 스타일을 지정하는 방식
(type="text/css"는 생략하고 <style>만 써도 됨)
: <head></head> 태그 사이에 정의한다.
: HTML 소스에 그대로 삽입된다.
-> 일반적으로 공통된 스타일시트가 적용되는 웹페이지의 수가 적을 때 사용
<html>
<head>
<style type="text/css">
/* 이 곳에 스타일 정의!! */
</style>
</head>
<body>
...
</body>
</html>
2. 링크 방식(추천!)
: <style></style> 태그는 생략하고, 파일에 스타일 내용만 작성하여 확장자를 css로 저장한 후 <link>태그를 사용하여 불러들이는 방식
: 외부파일(*.css)로 정의한다.
-> 여러 페이지에 동일한 스타일을 적용할 때 사용
(다른 HTML 문서에도 스타일을 링크만으로 일관성있게 만들 수 있음)
<link rel="stylesheet" type="text/css" href="*.css" />
3. 인라인 방식
: 태그 하나하나에 일일이 속성값으로 지정해주는 방식
: 태그내에 스타일을 적용하는 것이다.
->권장하지 않는 형태이나 특정한 스타일만 써야 할 필요가 있다면 사용해도 무방하다.
<font style="font-family: 궁서; font-size:9pt; color:#ff0000>...</font>
2011년 3월 23일 수요일
vi 에디터 명령어, autotools(by bhbaek)
<< vi 에디터 >>
- u: 이전 저장 상태로 복귀
* 항상 "저장"했던 상태가 기준이 된다.
- 3.3 매우 중요
<<autotools>>
1. configure.ac 파일 작성 및 autoconf 실행하기
- CPP: 전처리기
- LIB: libc, libm(lib가 빠진 것, 빼고 쓰면 됨)
- 탭으로 구분해줘야 함(커맨드 써줄 때)!!
- AC_INIT, AC_OUTPUT 반드시 써줘야 함
- configure 실행하면, config.log(실행 끝난 후, 만들어지는 파일. 에러 발생 시, 자세하게 로그가 나와 있음), config.status(Makefile을 생성하는 장본인, Makefile.in 읽어들여서 Makefile 만듦), Makefile 만든다.
- 사용자 입력을 받는 configuration 파일을 만드는 것은 좋지 않음. (p.17 예제에서 read가 있는 것은 권장하지 않는 형태. 무시하자)
2. autoheader
- .h.in 파일 자동으로 생성
3. automake
- Makefile.in을 자동으로 생성해주는 유틸리티
- 간단히, Makefile.am만 작성하기
- configuration 파일에 automake를 사용한다는 것을 기재하여 알려줘야 함
: AM_INIT_AUTOMAKE(프로젝트 이름, 버전)
: AM_INIT(...) 다음 행에 작성하면 됨
** Cross Compile시, --prefix=경로 옵션 사용하기도 함
2011년 3월 22일 화요일
분산 스트림 컴퓨팅 기술 동향
- 스마트폰, CCTV, RFID, 센서 등 새로운 IT 환경이 사람, 사물, 환경의 스마트화를 가속시키며, 데이터 생성 및 소비에 있어 많은 변화를 주고 있음
- 이는, 데이터의 폭증을 야기함
- 생성 데이터의 대부분은 영상, 음성 등의 비정형 데이터
- 데이터의 적재적소 활용이 기업의 경쟁력 확보에 주요한 요인
- 그러나, 데이터량의 증대는 유용한 정보를 얻는 데 필요한 처리 시간의 지연을 야기하고 있고, 이를 해결하기 위해 분산 병렬 컴퓨팅 기술의 활용이 커지고 있음
- 최신 데이터를 기반으로 전략 수립, 의사 결정 등을 수행하기 위해서 실시간으로 데이터를 처리하여 데이터 처리 지연 시간을 최소화하려는 노력들이 가속화됨. 이를 가능케 하는 기술로 데이터 스트림 연속 처리 기술이 중요해지고 있음
- 비정형 스트림 데이터 처리를 위해 분산 스트림 처리 기술이 연구되고 있음
- 분산 스트림 처리 시스템은 데이터 흐름에 따라 연속 처리, 분산 노드에 단위 업무의 분배 및 부하 분산, 데이터 스트림 분할 및 통합에 의한 병렬 처리, 분산된 업무간의 데이터 스트림 전달 방법, 분산 노드의 장애에 대처하여 연속 서비스 제공 기술 등 분산 컴퓨팅 기술을 기반으로 스트림 연속 처리 기술을 통합하여 제공
- IBM 등 기존 DBMS 업체에서도 스트림 데이터의 폭증에 대한 확장성 제공 및 응용 로직의 유연한 통합을 위해 InfoSphere Streams라는 분산 스트림 컴퓨팅 기술을 제공
(InfoSphere Streams: 분산 스트림 처리 인프라를 기반으로 데이터 모델 기반 데이터 스트림 처리 연산이 통합되어 제공되는 분산 스트림 컴퓨팅 시스템)
- 분산 연속 처리 시스템
1. Sprout: 인텔에서 개발한 비디오 실시간 분석 시스템인 SlipStream의 하부 시스템으로 대량의 데이터에 대한 분산 연속 처리
2. MapReduce Online: 버클리 대학에서 대용량 데이터에 대한 일괄 처리를 지원하는 MapReduce를 확장하여 개발한 시스템
3. S4(Simple Scalable Streaming System): 야후에서 개발 후 오픈소스화한 분산 스트림 처리 시스템
4. iFlow: 한국전자통신연구원에서 2010년부터 개발하고 있는 분산 스트림 처리 시스템
: 클러스터 시스템을 기반으로 폭증하는 데이터 스트림을 실시간으로 처리하는 환경을 지원
: 시스템의 확장성과 스트림 처리 로직의 유연한 통합을 제공
- 분산 스트림 처리 기술은 모니터링&대응 서비스를 위한 기반 기술로, 데이터 처리 지연 최소화, 데이터 폭증에 대한 확장성 및 응용의 유연한 통합 환경을 제공
- 이는, 데이터량의 증가, 이로 인한 처리 시간 지연 등으로 인해 새롭게 각광받고 있는 분산 병렬 처리 기술과 데이터 처리 지연 최소화를 위해 데이터 선처리 후저장 방식의 데이터 처리 모델인 스트림 처리 기술이 통합된 기술
- 컴퓨팅 오버헤드로 인해 실현되기 힘들었던 텍스트, 영상 등 대량의 비정형 데이터 기반의 실시간 서비스를 가능케 하는 기술
** 참고: ETRI 전자통신동향분석 제 26권 제 1호 2011년 2월
- 이는, 데이터의 폭증을 야기함
- 생성 데이터의 대부분은 영상, 음성 등의 비정형 데이터
- 데이터의 적재적소 활용이 기업의 경쟁력 확보에 주요한 요인
- 그러나, 데이터량의 증대는 유용한 정보를 얻는 데 필요한 처리 시간의 지연을 야기하고 있고, 이를 해결하기 위해 분산 병렬 컴퓨팅 기술의 활용이 커지고 있음
- 최신 데이터를 기반으로 전략 수립, 의사 결정 등을 수행하기 위해서 실시간으로 데이터를 처리하여 데이터 처리 지연 시간을 최소화하려는 노력들이 가속화됨. 이를 가능케 하는 기술로 데이터 스트림 연속 처리 기술이 중요해지고 있음
- 비정형 스트림 데이터 처리를 위해 분산 스트림 처리 기술이 연구되고 있음
- 분산 스트림 처리 시스템은 데이터 흐름에 따라 연속 처리, 분산 노드에 단위 업무의 분배 및 부하 분산, 데이터 스트림 분할 및 통합에 의한 병렬 처리, 분산된 업무간의 데이터 스트림 전달 방법, 분산 노드의 장애에 대처하여 연속 서비스 제공 기술 등 분산 컴퓨팅 기술을 기반으로 스트림 연속 처리 기술을 통합하여 제공
- IBM 등 기존 DBMS 업체에서도 스트림 데이터의 폭증에 대한 확장성 제공 및 응용 로직의 유연한 통합을 위해 InfoSphere Streams라는 분산 스트림 컴퓨팅 기술을 제공
(InfoSphere Streams: 분산 스트림 처리 인프라를 기반으로 데이터 모델 기반 데이터 스트림 처리 연산이 통합되어 제공되는 분산 스트림 컴퓨팅 시스템)
- 분산 연속 처리 시스템
1. Sprout: 인텔에서 개발한 비디오 실시간 분석 시스템인 SlipStream의 하부 시스템으로 대량의 데이터에 대한 분산 연속 처리
2. MapReduce Online: 버클리 대학에서 대용량 데이터에 대한 일괄 처리를 지원하는 MapReduce를 확장하여 개발한 시스템
3. S4(Simple Scalable Streaming System): 야후에서 개발 후 오픈소스화한 분산 스트림 처리 시스템
4. iFlow: 한국전자통신연구원에서 2010년부터 개발하고 있는 분산 스트림 처리 시스템
: 클러스터 시스템을 기반으로 폭증하는 데이터 스트림을 실시간으로 처리하는 환경을 지원
: 시스템의 확장성과 스트림 처리 로직의 유연한 통합을 제공
- 분산 스트림 처리 기술은 모니터링&대응 서비스를 위한 기반 기술로, 데이터 처리 지연 최소화, 데이터 폭증에 대한 확장성 및 응용의 유연한 통합 환경을 제공
- 이는, 데이터량의 증가, 이로 인한 처리 시간 지연 등으로 인해 새롭게 각광받고 있는 분산 병렬 처리 기술과 데이터 처리 지연 최소화를 위해 데이터 선처리 후저장 방식의 데이터 처리 모델인 스트림 처리 기술이 통합된 기술
- 컴퓨팅 오버헤드로 인해 실현되기 힘들었던 텍스트, 영상 등 대량의 비정형 데이터 기반의 실시간 서비스를 가능케 하는 기술
** 참고: ETRI 전자통신동향분석 제 26권 제 1호 2011년 2월
피드 구독하기:
글 (Atom)