2006년 10월 30일 월요일
ADSL 돈다주고 쓰면 바보인가 보네요.
친구의 부탁으로 파워콤으로 갈아타게 되었습니다. 하나로ADSL, 해지 신청을하려고 전화를 했었는데 24,000원대까지 떨어지더군요. 그리고 방금 전화가 또 왔는데 20,800원까지 떨어졌습니다. 싸게 해준다는 얘기를 들어서 알고있었지만.. 만원정도까지 가격이 떨어질 줄은 몰랐네요.

중세시대 당신의 직업은? ( 헤럴드 왕국 살리기 프로젝트 )
Chan님의 "중세시대 당신의 직업은?" 이라는 글을 읽고 나도 한번 해보자는 마음이 동해서 해봤습니다~

결과는 '자애로운 군주' ~
좋아하는 것
출처: http://www.wjthinkbig.com/kingdomality/
결과는 '자애로운 군주' ~
좋아하는 것
- 비전 공유하기 [비전에 대해서 좋아하기는 하죠]
- 식견 높은 청중 [음~ 생각있는 사람도 좋아하죠.]
- 충실한 추종자 [ㅡㅡ;;; 이건 경험이 없어서 원~~ ㅋ]
- 남이 자신의 비전을 의심하는 경우 [아직 리더가 된적이 없어서 패스]
- 자신의 리더십에 의문이 제기되는 경우 [리더가 된적이 없어서 패스.. 군대서도 막내생활만 24개월을 했었죠 ㅠㅠ]
- 타인에 대한 헌신 부족 [ㅡㅡ;;; 애인이 없었던 이유가 설마 이것? ]
출처: http://www.wjthinkbig.com/kingdomality/
2006년 10월 27일 금요일
Photolog의 형태 [2]
Photolog의 형태 [1]에서 살펴본 내용을 정리하면 크게 3가지 요소로 나눌 수 있을 것 같습니다.
1. 화면의 정중앙에 위치하는 Main Picture
- onclick : 다음 사진으로 이동
- onclick : 새창을 띄워 원본 사진을 보여주기
- onmouseover/onmouseout : 사진의 정보를 보여주기
- 메인 사진 부근에는 사진간의 이동을 보여주기 위해서 <prev|present|next>같은 이동을 위한 링크가 존재
- Album/Category별 분류
2. 전체 사진을 Category/Album별로 보여주는 Archive
- Category/Album/Month 등의 분류기준으로 이동하기위한 링크가 존재
- onclick: 각각의 썸네일을 클릭 시 1의 메인화면으로 이동하기 위한 링크가 존재

3. 1의 화면에서 앞/뒤의 사진으로 전환을 쉽게 해주기 위한 Sub Navigation
- onclick: 썸네일을 클릭시 1의 메인 화면으로 전환 및 Sub Navigation의 이동
- Sub Navigation 내에서의 이동

P.S:
나름대로 분류한다고 하였지만, 제 멋대로 한것이기에 틀린 구석이 반드시 있을것으로 생각됩니다. (-- )v
1. 화면의 정중앙에 위치하는 Main Picture
- onclick : 다음 사진으로 이동
- onclick : 새창을 띄워 원본 사진을 보여주기
- onmouseover/onmouseout : 사진의 정보를 보여주기
- 메인 사진 부근에는 사진간의 이동을 보여주기 위해서 <prev|present|next>같은 이동을 위한 링크가 존재
- Album/Category별 분류

- Category/Album/Month 등의 분류기준으로 이동하기위한 링크가 존재
- onclick: 각각의 썸네일을 클릭 시 1의 메인화면으로 이동하기 위한 링크가 존재

3. 1의 화면에서 앞/뒤의 사진으로 전환을 쉽게 해주기 위한 Sub Navigation
- onclick: 썸네일을 클릭시 1의 메인 화면으로 전환 및 Sub Navigation의 이동
- Sub Navigation 내에서의 이동

P.S:
나름대로 분류한다고 하였지만, 제 멋대로 한것이기에 틀린 구석이 반드시 있을것으로 생각됩니다. (-- )v
Firefox에서 Style속성 지정할 때 주의할 점[제가 잘못 봤네요 ^^;;]
특정 element에 style속성을 지정할 때 사용할 수 있는 방법은 크게 두가지입니다. (실제로는 더 있기는 합니다 ^^)
Firefox 1.5에서는 실제 테스트를 해보지 않았습니다. (2.0 사용중이라서요...)
게다가, 보통때는 2번 방식으로 코딩을 하기 때문에 이런 문제가 있는지도 오늘 처음 알았네요.
테스트 해본 코드는 다음과 같습니다.

간단하게 table element를 만든 후에 getAttribute와 style의 코드를 출력하는 방법을 사용했는데요.
결과는 다음과 같습니다.

아무 값도 나오지 않습니다. ^^;;;
Firefox 2.0으로 오면서 바뀐건지 아닌지는 모르겠지만 코딩하실 때 주의하신다면 좋을 듯 싶네요.
P.S.1:
style로 값을 준 경우 style.width 또는 style.height으로 값을 꺼낼 수 있습니다.
width/height으로 값을 준 경우 style.width/style.height 값은 사용할 수 없습니다.
ㅠㅠ 어처구니 없는 실수를 저질렀네요.
P.S.2:
style로 값을 설정하는 경우 px를 뒤에 붙여주면 정상적으로 동작합니다. ㅡㅡ
- element.style.width = 700;
- element.setAttribute("width", 700);
Firefox 1.5에서는 실제 테스트를 해보지 않았습니다. (2.0 사용중이라서요...)
게다가, 보통때는 2번 방식으로 코딩을 하기 때문에 이런 문제가 있는지도 오늘 처음 알았네요.
테스트 해본 코드는 다음과 같습니다.
간단하게 table element를 만든 후에 getAttribute와 style의 코드를 출력하는 방법을 사용했는데요.
결과는 다음과 같습니다.
아무 값도 나오지 않습니다. ^^;;;
Firefox 2.0으로 오면서 바뀐건지 아닌지는 모르겠지만 코딩하실 때 주의하신다면 좋을 듯 싶네요.
P.S.1:
style로 값을 준 경우 style.width 또는 style.height으로 값을 꺼낼 수 있습니다.
width/height으로 값을 준 경우 style.width/style.height 값은 사용할 수 없습니다.
ㅠㅠ 어처구니 없는 실수를 저질렀네요.
P.S.2:
style로 값을 설정하는 경우 px를 뒤에 붙여주면 정상적으로 동작합니다. ㅡㅡ
맥북 업그레이드와 관련한 잡담
맥북을 업그레이드할 수 있는 부분은 두군데 메모리와 하드디스크 두곳입니다.
메모리야 667MHz DDR2 SDRAM (PC2-5300, SO-DIMM)으로 구매를 한 후 업그레이드를 하면됩니다.
하드디스크야 Serial ATA 인터페이스를 가진 하드디스크를 구입 후 사용하면 된다지만,
문제는 업그레이드하고 남은 부품을 어떻게 처리 할 것이냐인데.. 메모리는 답이 없을 듯합니다.
667MHz DDR2 SDRAM을 사용하는 노트북에서 256M 메모리를 구입해서 사려는 사람은 없겠죠~
하드디스크가 문제인데요. 하드디스크를 외장으로 사용하려고 생각하시는 분들이 많겠지만,
문제는, 문제는..... SATA 인터페이스를 지원하는 외장케이스가 거의 없다는게 문제입니다. ㅠㅠ

이리저리 뒤진 결과 Valueplus의 SPIO XG만이 현재나와있는 전부인 것 같습니다.
가격대 6만8천원... 배보다 배꼽이 억수로 더 크군요.
메모리야 667MHz DDR2 SDRAM (PC2-5300, SO-DIMM)으로 구매를 한 후 업그레이드를 하면됩니다.
하드디스크야 Serial ATA 인터페이스를 가진 하드디스크를 구입 후 사용하면 된다지만,
문제는 업그레이드하고 남은 부품을 어떻게 처리 할 것이냐인데.. 메모리는 답이 없을 듯합니다.
667MHz DDR2 SDRAM을 사용하는 노트북에서 256M 메모리를 구입해서 사려는 사람은 없겠죠~
하드디스크가 문제인데요. 하드디스크를 외장으로 사용하려고 생각하시는 분들이 많겠지만,
문제는, 문제는..... SATA 인터페이스를 지원하는 외장케이스가 거의 없다는게 문제입니다. ㅠㅠ

이리저리 뒤진 결과 Valueplus의 SPIO XG만이 현재나와있는 전부인 것 같습니다.
가격대 6만8천원... 배보다 배꼽이 억수로 더 크군요.
2006년 10월 25일 수요일
GWT Designer

instantiations.com에서 GWT를 기반으로 'GWT Designer'라는 GUI Creator가 나왔네요. Eclipse, Wepsphere, Rational 등에 플러그 인으로 사용이 가능합니다.
Beta 상태이며 Beta Program에 참여해야 Beta ver을 사용가능한 것 같습니다. 문제는 GWT에서 생산되는 HTML 코드들이 얼마나 최적화되어서 나와줄 것이냐가 관건이 될 것 같네요.

출처: GWT Designer
Photolog의 형태 [1]
Photoblog(Photolog)는 Blog의 형태로서 사진의 공유, 퍼블리싱(Photo sharing and publishing)을 목적으로 합니다. Photolog의 구조는 일반적인 Blog와 동일한 구조를 가지고 있습니다. 가장 최신의 포스트가 가장 위에 보여지며 연대기 순의 리스트를 갖습니다. 과거의 Post의 경우에는 링크를 통하여 접근이 가능하며, 월별 또는 카테고리 별로 나뉘어져있는 아카이브가 옵션으로 제공이 됩니다.
(내용출처: Wikipedia의 Photolog)

위의 형태는 일반적인 블로그에서 사진을 삽입한, 기본적인 블로그 형태를 보여줍니다. 블로그의 본문(사진)이 중앙에 있고 우측에 카테고리로 나뉘어져있는 Archive가 존재하는 형태입니다.

일반적인 포토로그에서 볼 수 있는 가장 일반적인 형태입니다. 블로그의 상단에 '이전 포스트 <현재 보고 있는 포스트 < 다음 포스트'로 이동할 수 있는 링크가 존재하며, 툴팁으로 사진의 내용을 요약해서 보여줍니다. 메인 화면은 사진을 중점으로 두고 Archive는 맨 아래쪽의 링크만 두어서 사진에 집중하는 형태로 구성되어 있습니다.

2번과는 달리 1번의 일반적인 블로그 형태에 집중하며 사진과 글을 함께 보여주는 형태의 포토로그도 있습니다. 사진을 중심으로 이전/다음 사진을 옆에 놔두어서 사진간의 이동이 쉽게 이루어질 수 있도록 해놨습니다. Archive의 경우 이동을 위한 썸네일 아래쪽에 링크로서 존재합니다.

2번의 포토로그에 3번의 쉬운 이동을 위한 Navigation을 아래에 두었으며 좌측 상단에 Archive링크를 두어서 Archive로 들어갈 경우 전체 사진을 쉽게 감상할 수 있게 해놨습니다. 포스트 자체도 좌우이동이 쉽게 이루어질 수 있으면서 사진에 집중할 수 있는 구조가 아닌가 생각이 됩니다.
위의 4가지 형태가 가장 일반적인 포토로그가 아닐까 생각이 되네요 ^^
최근에 나오고 있는 포토로그는 확인해보지 않았구요. Wikipedia에 링크되어 있는 포토로그 위주로 조사해봤습니다. 좋은 사이트 블로그가 있는 경우 추천 부탁 드립니다.
(내용출처: Wikipedia의 Photolog)

위의 형태는 일반적인 블로그에서 사진을 삽입한, 기본적인 블로그 형태를 보여줍니다. 블로그의 본문(사진)이 중앙에 있고 우측에 카테고리로 나뉘어져있는 Archive가 존재하는 형태입니다.

일반적인 포토로그에서 볼 수 있는 가장 일반적인 형태입니다. 블로그의 상단에 '이전 포스트 <현재 보고 있는 포스트 < 다음 포스트'로 이동할 수 있는 링크가 존재하며, 툴팁으로 사진의 내용을 요약해서 보여줍니다. 메인 화면은 사진을 중점으로 두고 Archive는 맨 아래쪽의 링크만 두어서 사진에 집중하는 형태로 구성되어 있습니다.

2번과는 달리 1번의 일반적인 블로그 형태에 집중하며 사진과 글을 함께 보여주는 형태의 포토로그도 있습니다. 사진을 중심으로 이전/다음 사진을 옆에 놔두어서 사진간의 이동이 쉽게 이루어질 수 있도록 해놨습니다. Archive의 경우 이동을 위한 썸네일 아래쪽에 링크로서 존재합니다.

2번의 포토로그에 3번의 쉬운 이동을 위한 Navigation을 아래에 두었으며 좌측 상단에 Archive링크를 두어서 Archive로 들어갈 경우 전체 사진을 쉽게 감상할 수 있게 해놨습니다. 포스트 자체도 좌우이동이 쉽게 이루어질 수 있으면서 사진에 집중할 수 있는 구조가 아닌가 생각이 됩니다.
위의 4가지 형태가 가장 일반적인 포토로그가 아닐까 생각이 되네요 ^^
최근에 나오고 있는 포토로그는 확인해보지 않았구요. Wikipedia에 링크되어 있는 포토로그 위주로 조사해봤습니다. 좋은 사이트 블로그가 있는 경우 추천 부탁 드립니다.
2006년 10월 24일 화요일
BlogFish의 Tooltip 라이브러리

BlogFish의 Tooltip 라이브러리는 Tooltip 클래스 하나로 구성됩니다.
1. Attribute
- element : Tooltip의 대상이 되는 element입니다.
- tool_tip : Tooltip의 내용이 들어갈 element입니다.
- options : Tooltip 클래스에서 사용될 속성들이 들어갑니다. (Tooltip의 위치, z-index 등)
2. Method
- destory : Tooltip의 내용을 바꾸거나 Tooltip을 제거할 때 element와 Tooltip간에 연결되어 있는 이벤트를 제거합니다.
- registerEvents : element에서 Tooltip을 띄우는데 사용할 이벤트를 등록합니다. (mouseover, mouseout)
- showTooltips : Tooltip의 내용을 화면에 띄웁니다. (Tooltip을 띄울 위치를 계산합니다.)
- setStyles : Tooltip의 위치를 설정하는데 사용됩니다. (Style설정하는데 사용되지 않습니다.)
- getWindowHeight/getWindowWidth : 내부에서 window의 크기를 알아내기 위해서 사용되는 메소드입니다.
사용법은 간단합니다. 스크립트 태그안에서 Tooltip을 생성하고 Tooltip의 대상과 Tooltip에 들어갈 element를 인자로 넣어주면 됩니다.
<script type="text/javascript">
var my_tooltip = new Tooltip('scr element', 'tooltip element');
</script>
var my_tooltip = new Tooltip('scr element', 'tooltip element');
</script>
2006년 10월 23일 월요일
Tooltip library
Web에서 Tooltip이란 일반적으로 특정 아이템위에 마우스를 가져갔을 때 아이템을 설명하는 내용이 뜨는 것을 의미합니다. 간단하게는 태그의 title이나 desc등의 속성을 이용하는 방법에서 Floating 가능한 div 태그를 사용하는 법까지 여럿 있습니다. 여기에서는 JavaScript에서 제공되는 라이브러리에 대해서 요약 정리합니다.

출처 :

BoxOver library
BoxOver library는 다른 라이브러리들과 다르게 version이 2.1이며, 대부분의 코드가 div의 css를 꾸미는데(?) 사용되고 있습니다. fadein/fadeout시에도 alpha값을 직접 줘서 페인팅하고 있습니다. 10kb도 안되는 용량에 가벼운 라이브러리로 소개 되어 있네요. DIV의 title 태그에 option을 받아서 세부 동작을 지정할 수 있도록 해놨습니다. - 라이센스 : GNU license
- Tooltip 이벤트 : onClick/onMouseOver/onMouseOut등의 이벤트
- 필요 라이브러리 : 없슴
- version : 2.1
- Tooltip 설정 : Page loading시 전체 tag를 파싱하여 Tooltip(div태그 및 내용)을 생성하여 출력
Tooltip.js
Tooltip.js는 Tooltip에서 제공될 수 있는 기능을 단순하면서도 모두 제공하는 것을 목표로 하고 있습니다. 화면에 출력 및 감추기 위한 이벤트를 따로 설정이 가능하며 Script.aculo.us에서 제공하는 Effect를 사용하여 나타내고/사라지게 하는 Effect를 따로 설정할 수 있게 했으며, 나타나고 사라지는 시간에 대한 설정도 가능합니다. - 라이센스 : MIT-style license
- Tooltip 이벤트 : onClick(default로 설정)을 비롯하여 설정 가능한 모든 이벤트
- 필요 라이브러리 : Prototype.js, Script.aculo.us
- version : 0.6
- Tooltip 설정 : Page loading시간 또는 script 내부에서 자유로이 설정 가능
- mouseover/mouseout 이벤트로 tooltip을 생성할 때 toggle 메소드로 인하여 이벤트가 계속 발생하는 버그존재
BlogFish의 Tooltip.js
BlogFish의 Tooltip library는 Ajaxian.com에서도 언급하고 있는 것처럼 Tooltip.js에서 Tooltip의 기본적인 기능만을 추출하여 제공하고 있습니다. - 라이센스 : BSD license
- Tooltip 이벤트 : onmouseover/onmouseout 이벤트
- 필요 라이브러리 : Prototype.js, Script.aculo.us
- version : 0.1
- Tooltip 설정 : Script 내부에서 호출하여 자유로이 설정 가능
YUI library
YUI library의 경우에는 Yahoo의 core라이브러리가 기본적으로 필요하며(상속) Tooltip은 Module을 상속받은 Overlay를 상속받아 만드러져 있어서 라이브러리 자체가 무겁게 되어 있습니다. YUI로 모든 서비스를 구축한다면 문제가 될만할 것 같지는 않군요. 코드 내부를 보면 잘 설계되어 있는 것을 확인할 수 있습니다. 그러나, YUI를 전부 가져다 쓸 생각이 없으므로 패스 ^^- 라이센스 : BSD license
- Tooltip 이벤트 : onmouseout/onmouseover/onmousemove 이벤트
- 필요 라이브러리 : YUI 라이브러리
- version : 0.11.4
- Tooltip 설정 : Script 내부에서 호출하여 자유로이 설정 가능
출처 :
JS 라이브러리는 무엇이 좋을까?
Ajaxian등의 여러 사이트에서 언급하는 JavaScript라이브러리를 보면 너무 많아서 무엇을 사용해야할 지 참 난감할 때가 있습니다. Prototype이 Defacto Standard로서 사용되기는 하지만, Dojo나 YUI 라이브러리도 나름 매력적이고, Google Gadget이나 다른 라이브러리들도 나름 장점을 가지고 있는게 많습니다.

Prototype을 선택하더라도, Prototype이 제공하는 핵심은 상속이나 , Class개념, Utillity 메소드 등에 대해서만 제공하기 때문에 Graphic 적인 요소를 지원하기 위해서는 Script.aculo.us나 Moo.fx등을 선택해야 합니다. 여기에서도 또 다른 컴포넌트를 사용하기 위해서는 여러 라이브러리를 선택을 해야겠죠 ㅠㅠ.
뭐.. 내년에 나올 OpenAjax Alliance에서나올 표준안(?)이 나오면 여기에 맞게 수정이 또 이루어질 수도 있을거구요.. 라이브러리 추천 받습니다. ㅋㅋ ^^
P.S: Tattertools는 어떻게 했나 살펴보니 Dojo라이브러리를 사용했군요.
이미지 출처:

Prototype을 선택하더라도, Prototype이 제공하는 핵심은 상속이나 , Class개념, Utillity 메소드 등에 대해서만 제공하기 때문에 Graphic 적인 요소를 지원하기 위해서는 Script.aculo.us나 Moo.fx등을 선택해야 합니다. 여기에서도 또 다른 컴포넌트를 사용하기 위해서는 여러 라이브러리를 선택을 해야겠죠 ㅠㅠ.
뭐.. 내년에 나올 OpenAjax Alliance에서나올 표준안(?)이 나오면 여기에 맞게 수정이 또 이루어질 수도 있을거구요.. 라이브러리 추천 받습니다. ㅋㅋ ^^
P.S: Tattertools는 어떻게 했나 살펴보니 Dojo라이브러리를 사용했군요.
이미지 출처:
2006년 10월 18일 수요일
왜 이럴까?
추석 끝나고 집에 돌아와보니 컴퓨터가 부팅이 안되더군요. CMOS까지 안들어오길래 이놈을 들고서(셔틀이랍니다.) 용산 선인상가까지 들고가서 확인한 결과 메모리와 메인보드 사이에 먼지가 끼어서 접촉불량이라고 하더군요. 고대로 들고 돌아왔습니다.
안경나사 조이는 드라이버가 필요해서 별드라이버와 같이 파는 것을 구매했더니만. 배송보낼 생각도 없는 지 감감 무소식에 택배 송장번호가 적혀는 있으나 검색해도 나오지가 않네요.
맥북 업글을 위해서 큰돈 들여서 1GB메모리를 샀는데 인식이 안되서 연락했더니 반품하라고 하네요.
H사는 14일 까지가 기한이라던데 14일이 지나도, 근무날짜로 14일이 지나도 아직 먼 퇴직금에다....
이리저리 삐꺽이는 10월입니다.
어디론가 도망가버리고 싶군요. ㅠㅠ
안경나사 조이는 드라이버가 필요해서 별드라이버와 같이 파는 것을 구매했더니만. 배송보낼 생각도 없는 지 감감 무소식에 택배 송장번호가 적혀는 있으나 검색해도 나오지가 않네요.
맥북 업글을 위해서 큰돈 들여서 1GB메모리를 샀는데 인식이 안되서 연락했더니 반품하라고 하네요.
H사는 14일 까지가 기한이라던데 14일이 지나도, 근무날짜로 14일이 지나도 아직 먼 퇴직금에다....
이리저리 삐꺽이는 10월입니다.
어디론가 도망가버리고 싶군요. ㅠㅠ
옥탑방 == 인간 이하의 주거환경?
"160만명 지하.옥탑방서 산다"
[연합뉴스 2006-10-17 22:23]
(서울=연합뉴스) 국회 재정경제위 소속 민주노동당 심상정 의원은 17일 통계청이 제출한 국정감사 자료를 인용,
(서울=연합뉴스) 국회 재정경제위 소속 민주노동당 심상정 의원은 17일 통계청이 제출한 국정감사 자료를 인용,
..중략..
그는 "집은 남아돌지만 주택소유 편중현상이 심한 탓에 무려 160만명이 인간 이하의 주거환경에 시달리고 있다"고 지적했다.
제대하고 6년 가까이... 인간이하의 거주시설에서 살았구나.. ㅡㅡ;;
그래도, 인간이하는 좀 거시기 하잖소..
출처 :
네이버 연합뉴스 '160만명 지하.옥탑방서 산다.'
2006년 10월 17일 화요일
퇴직금 제도..
제2장 퇴직금제도
제10조 (퇴직금의 시효) 이 법에 의한 퇴직금을 받을 권리는 3년간 행사하지 아니하면 시효로 인하여 소멸한다.
제11조 (퇴직금의 우선변제) ①퇴직금은 사용자의 총재산에 대하여 질권 또는 저당권에 의하여 담보된 채권을 제외하고는 조세·공과금 및 다른 채권에 우선하여 변제되어야 한다. 다만, 질권 또는 저당권에 우선하는 조세·공과금에 대하여는 그러하지 아니하다.
②제1항의 규정에 불구하고 최종 3년간의 퇴직금은 사용자의 총재산에 대하여 질권 또는 저당권에 의하여 담보된 채권, 조세·공과금 및 다른 채권에 우선하여 변제되어야 한다.
③제2항의 규정에 의한 퇴직금은 계속근로기간 1년에 대하여 30일분의 평균임금으로 계산한 금액으로 한다.
.. 중략 ..
제9조 (퇴직금의 지급) 사용자는 근로자가 퇴직한 경우에는 그 지급사유가 발생한 날부터 14일 이내에 퇴직금을 지급하여야 한다. 다만, 특별한 사정이 있는 경우에는 당사자간의 합의에 의하여 지급기일을 연장할 수 있다. <개정 2005.7.29>제10조 (퇴직금의 시효) 이 법에 의한 퇴직금을 받을 권리는 3년간 행사하지 아니하면 시효로 인하여 소멸한다.
제11조 (퇴직금의 우선변제) ①퇴직금은 사용자의 총재산에 대하여 질권 또는 저당권에 의하여 담보된 채권을 제외하고는 조세·공과금 및 다른 채권에 우선하여 변제되어야 한다. 다만, 질권 또는 저당권에 우선하는 조세·공과금에 대하여는 그러하지 아니하다.
②제1항의 규정에 불구하고 최종 3년간의 퇴직금은 사용자의 총재산에 대하여 질권 또는 저당권에 의하여 담보된 채권, 조세·공과금 및 다른 채권에 우선하여 변제되어야 한다.
③제2항의 규정에 의한 퇴직금은 계속근로기간 1년에 대하여 30일분의 평균임금으로 계산한 금액으로 한다.
JavaScript에서 script 태그를 코드로 생성하는 이유는?
TinyMCE 같은 경우도 동일하게 document.write을 사용하여 script를 로딩하게 됩니다. 이 때 '<script로 하지 않고 '<sc' + 'ript로 적용한 부분에 주의, '<script로 사용하는 경우 특정 브라우저에서 로딩이 안되는 경우가 있다고 하네요. ^^
출처:
2006년 10월 15일 일요일
2006년 10월 13일 금요일
상속(Inheritance)
언어에서 상속이 가지는 의미는 크게 몇 가지로 나눌 수 있습니다.

장점: 상속 기능 제공 시 사용자가 원하는 argument를 생성자에 넣을 수 있습니다.
단점: 상속을 emulation하는 것이기 때문에 instanceof 사용 시 false를 리턴합니다.
장점: prototype을 이용하여 상속하므로 instaneof를 사용하는 경우 true값이 리턴됩니다.
단점: Class를 만들 때 argument를 지정할 수 없습니다.
# 위의 코드를 실험해보다 var objB = new ClassB("blue", "Nicholas");라는 코드를 호출 해 보았습니다. 이 때, 위의 코드에서 에러는 발생하지 않습니다. - firefox에서- 위의 코드처럼 new ClassB(); 를 호출한 효과와 동일한 효과를 얻습니다.

Prototype extend
prototype.js에서는 상속을 Object의 extend 메소드를 사용하여 처리를 하고 있습니다.
Object Masqerading이나 Prototype Chaining하고는 다르게 파라미터와 관련된 문제를 Class.create()를 사용하여 생성자 호출 부분을 변경하였고, 상속에 필요한 기능은 extend 메소드에서 property의 내용을 복사합니다.
※ 실제로 상속하는 것이 아니라, prototype을 copy함으로서 상속을 시뮬레이션하게 됩니다.
※※ 부모의 prototype을 child의 prototype으로 복사하게 됩니다.
※※※ 제가 알고있던 기존의 상속방법에서 instanceof가 동작하기는 하였으나 하나의 부모를 여러 자식들이 상속받을 때, 부모의 메소드를 덮어써버리는 문제가 발생하였습니다.
prototype.js의 파일들을 뒤져서 상속코드들을 다시 살펴보니, prototype의 method들만 상속받고 Class자체를 상속받지는 않더군요. prototype.js의 파일들을 살펴보면 다음과 같은 방식으로 정의되어 있습니다.
공유할 메소드들을 정의를 합니다. (즉, 부모 클래스에 해당하는 내용들이겠죠.)
공유할 메소드들을 받을 클래스를 생성합니다.
생성한 클래스에 공유할 메소드들을 상속받습니다. (복사합니다.)
새로운 메소드들을 추가합니다. (순서는 중요합니다. 순서가 바뀔경우 (이름이 같다면) 공유할 메소드들이 새로운 메소드들을 덮어쓸 수 있겠죠.)
prototype.js를 사용해서, 상속의 조건 중 하나인 instanceof를 만족하는 상속의 방법은 없는 것 같습니다...
출처 :
P.S:
※ JavaScript의 Object에 관해서 설명해 놓은 Objectifying JavaScript에 대한 글을 봤습니다.
글의 내용은 JavaScript에서 어떻게 Object를 생성할 것인가에 대한 글이였구요. Object를 생성하기 위해서는
※※ Objectifying JavaScript와 관련하여 보다가 ECAM-262 표준(4.2.1 Objects)도 살펴보았습니다. 모든 생성자는 explicit하게 prototype chain이라 불리는 prototype에 레퍼런스를 가지고 있습니다. 그리고, 동일한 생성자를 통해서 생성된 객체들의 경우 implicit하게 prototype chain을 레퍼런스하고 있습니다.

CF - 생성자, Cfp - prototype chain, cf1, cf2, .. cf5 - 객체
※※※ Object를 생성하기 위해서 new 연산자를 사용하여 생성자를 호출하는 경우에, prototype property를 저장하기 위한 __proto__ 라는 property를 생성합니다 . 이를 이용해서 prototype chain에 접근할 수 있게 됩니다. 다음은 Mozilla에 올라와 있는 관련 글입니다.
이러한 속성을 이용해서 instanceof 메소드를 만들 수도 있습니다. prototype을 비교하기 때문에 상속관계를 체크할 수 있습니다.
- 부모의 속성과 메소드를 자식들이 가진다.
- 부모의 메소드를 재정의할 수 있어야 한다. (Overriding)
- 부모를 호출 할 수 있어야 한다. (Java에서의 super키워드)
Object masquerading
(masquerading는 '가장 무도회', '가장', '겉치레'라는 의미를 가지고 있습니다. )
장점: 상속 기능 제공 시 사용자가 원하는 argument를 생성자에 넣을 수 있습니다.
단점: 상속을 emulation하는 것이기 때문에 instanceof 사용 시 false를 리턴합니다.
Prototype Chaining
prototype을 이용한 상속으로 prototype에 생성자를 대입하는 방법을 사용합니다. 
단점: Class를 만들 때 argument를 지정할 수 없습니다.
# 위의 코드를 실험해보다 var objB = new ClassB("blue", "Nicholas");라는 코드를 호출 해 보았습니다. 이 때, 위의 코드에서 에러는 발생하지 않습니다. - firefox에서- 위의 코드처럼 new ClassB(); 를 호출한 효과와 동일한 효과를 얻습니다.
Hybrid Method
Hybrid Method는 Object Masqerading과 Prototype Chaining을 섞은 방법입니다. 
Object Masqerading이나 Prototype Chaining하고는 다르게 파라미터와 관련된 문제를 Class.create()를 사용하여 생성자 호출 부분을 변경하였고, 상속에 필요한 기능은 extend 메소드에서 property의 내용을 복사합니다.
※ 실제로 상속하는 것이 아니라, prototype을 copy함으로서 상속을 시뮬레이션하게 됩니다.
※※ 부모의 prototype을 child의 prototype으로 복사하게 됩니다.
※※※ 제가 알고있던 기존의 상속방법에서 instanceof가 동작하기는 하였으나 하나의 부모를 여러 자식들이 상속받을 때, 부모의 메소드를 덮어써버리는 문제가 발생하였습니다.
prototype.js의 파일들을 뒤져서 상속코드들을 다시 살펴보니, prototype의 method들만 상속받고 Class자체를 상속받지는 않더군요. prototype.js의 파일들을 살펴보면 다음과 같은 방식으로 정의되어 있습니다.
공유할 메소드들을 정의를 합니다. (즉, 부모 클래스에 해당하는 내용들이겠죠.)
var Enumerable = {
each: function((iterator) {},
eachSlice: function((number, iterator) {},
all: function((iterator) {},
...
}
each: function((iterator) {},
eachSlice: function((number, iterator) {},
all: function((iterator) {},
...
}
공유할 메소드들을 받을 클래스를 생성합니다.
ObjectRange = Class.create();
생성한 클래스에 공유할 메소드들을 상속받습니다. (복사합니다.)
Object.extend(ObjectRange.prototype, Enumerable);
새로운 메소드들을 추가합니다. (순서는 중요합니다. 순서가 바뀔경우 (이름이 같다면) 공유할 메소드들이 새로운 메소드들을 덮어쓸 수 있겠죠.)
Object.extend(ObjectRange.prototype, {
initialize: function((start, end, exclusive) {},
_each: function(iterator) {},
...
}
initialize: function((start, end, exclusive) {},
_each: function(iterator) {},
...
}
prototype.js를 사용해서, 상속의 조건 중 하나인 instanceof를 만족하는 상속의 방법은 없는 것 같습니다...
출처 :
P.S:
질문: object를 array로 출력하는 경우 prototype자체가 나올까요?
정답: 안나옵니다.
정답: 안나옵니다.
※ JavaScript의 Object에 관해서 설명해 놓은 Objectifying JavaScript에 대한 글을 봤습니다.
글의 내용은 JavaScript에서 어떻게 Object를 생성할 것인가에 대한 글이였구요. Object를 생성하기 위해서는
- Object 자체를 생성하는 방법 var obj = new Object(); obj.property = "sample"; 과 같이 생성하는 방법과
- Function을 사용하는 방법 function Object() {...} var obj = new Object();
※※ Objectifying JavaScript와 관련하여 보다가 ECAM-262 표준(4.2.1 Objects)도 살펴보았습니다. 모든 생성자는 explicit하게 prototype chain이라 불리는 prototype에 레퍼런스를 가지고 있습니다. 그리고, 동일한 생성자를 통해서 생성된 객체들의 경우 implicit하게 prototype chain을 레퍼런스하고 있습니다.

CF - 생성자, Cfp - prototype chain, cf1, cf2, .. cf5 - 객체
※※※ Object를 생성하기 위해서 new 연산자를 사용하여 생성자를 호출하는 경우에, prototype property를 저장하기 위한 __proto__ 라는 property를 생성합니다 . 이를 이용해서 prototype chain에 접근할 수 있게 됩니다. 다음은 Mozilla에 올라와 있는 관련 글입니다.
- Local versus Inherited Values
- Determining Instance Relationships
- Global Information in Constructors
- No Multiple Inheritance

function instanceOf(object, constructor) {
while (object != null) {
if (object == constructor.prototype)
return true;
object = object.__proto__;
}
return false;
}
JavaScript Object Basics
Object is "unordered collection of properties each of which contains a primitive value, object, or function" in ECMA-262
1. ECMAScript에서는 object에 대해서 reference만 유지할 수 있습니다.
2. ECMAScript에는 Garbage Collection이 존재합니다.
3. dereferencing하기 위해서는 null을 대입해주면 gc가 동작하는 시점에서 dereferencing하게 됩니다.
var obj = new Object();
obj = null;
obj = null;
4. parseInt()나 isFinite() 메소드의 경우 메소드만 존재하는 것으로 보이나 실제로는 Global이라는 object의 메소드입니다. (Global에는 접근이 불가능합니다.)
5. escape()와 unescape()는 BOM에서 사용되는 메소드로 encodeURI(), encodeURIComponent(), decodeURI(), decodeURIComponent()를 사용해야 합니다.
6. encodeURI()는 전체 URI를 encoding하기 위해서 사용되고, encodeURIComponent()는 URI의 부분(segment)를 인코딩하기 위해서 사용됩니다. encodeURI는 colon이나 slach같은 URI에 사용되는 케릭터들은 인코딩하지 않습니다.
7. JavaScript에는 public scope만 존재합니다. private scope임을 표시하기 위해서 두개의 언더스코어(underscore)를 컨벤션으로서 앞 뒤로 붙여줍니다. (일부 개발자들은 앞에 하나의 언더스코어만 사용하기도 합니다.)
obj.__color__ = "red";
or
obj._color = "red";
or
obj._color = "red";
출처 :
P.S.
위 책의 3장 중 필요한 것만 요약했습니다. 클래스를 어떻게 사용할 것인가에 대한 과정에 대해 책에 재미있게 잘 설명되어 있으니 책을 보시면 더 좋을 것 같네요 ^^
Professional JavaScript for Web Developers
제가 들어간 SK컴즈에는 FT(Friday Teamply)라는 제도가 있어서 금요일 오후 4시부터는 다양한 스터디를 진행하고 있습니다.
SK 들어가기 전에 내심 해보고 싶었던 바 들어가자말자 'JavaScript 사로잡기'라는 FT에 들었습니다. Professional JavaScript for Web Developers는 여기 FT에서 진행하고 있는 교제인데요.
사실.. 제대로 보지 않고 있다가 오늘 있을 FT 때문에 어제 잠시 읽어보았습니다. 그런데, 재미있더군요. 상속을 어떻게 한다는 것만 알고 있었는데 왜 이렇게 발전했는지에 대해서 단계적으로 설명을 하면서 장점, 단점을 들면서 다양하게 설명을 해주는 점이 가장 재미있었던 것 같습니다.
아직 보는 중이라서 뭐라 말할 수 없지만 별 4개 이상은 되지 않을까 생각이 되네요.
목차는 다음과 같습니다.
P.S. 정보문화사에서 나온 Beginning Java(Ivor Horton님의 )를 보고서 좌절한 이래로 손도 안댔던 빨간책이... 이렇게 재미있을 줄은 몰랐습니다!!(에이콘에서 번역해줬으면 좋겠네요.)
SK 들어가기 전에 내심 해보고 싶었던 바 들어가자말자 'JavaScript 사로잡기'라는 FT에 들었습니다. Professional JavaScript for Web Developers는 여기 FT에서 진행하고 있는 교제인데요.
사실.. 제대로 보지 않고 있다가 오늘 있을 FT 때문에 어제 잠시 읽어보았습니다. 그런데, 재미있더군요. 상속을 어떻게 한다는 것만 알고 있었는데 왜 이렇게 발전했는지에 대해서 단계적으로 설명을 하면서 장점, 단점을 들면서 다양하게 설명을 해주는 점이 가장 재미있었던 것 같습니다.
아직 보는 중이라서 뭐라 말할 수 없지만 별 4개 이상은 되지 않을까 생각이 되네요.
목차는 다음과 같습니다.
ch1 What Is JavaScript
ch2 ECMAScript Basics
ch3 Object Basics
ch4 Inheritance
ch5 JavaScript in the Browser
ch6 DOM Basics
ch7 Regular Expressions
ch8 Browser and Operating System Detection
ch9 All about Events
ch10 Advanced DOM Techniques
ch11 Forms and Data Integrity
ch12 Sorting Tables
ch13 Drag and Drop
ch14 Error handling
ch15 XML in JavaScript
ch16 Client-Server Communication
ch17 Web Services
ch18 Interacting with Plugins
ch19 Deployment Issues
ch20 The Evolution of JavaScript
ch2 ECMAScript Basics
ch3 Object Basics
ch4 Inheritance
ch5 JavaScript in the Browser
ch6 DOM Basics
ch7 Regular Expressions
ch8 Browser and Operating System Detection
ch9 All about Events
ch10 Advanced DOM Techniques
ch11 Forms and Data Integrity
ch12 Sorting Tables
ch13 Drag and Drop
ch14 Error handling
ch15 XML in JavaScript
ch16 Client-Server Communication
ch17 Web Services
ch18 Interacting with Plugins
ch19 Deployment Issues
ch20 The Evolution of JavaScript
P.S. 정보문화사에서 나온 Beginning Java(Ivor Horton님의 )를 보고서 좌절한 이래로 손도 안댔던 빨간책이... 이렇게 재미있을 줄은 몰랐습니다!!(에이콘에서 번역해줬으면 좋겠네요.)
2006년 10월 11일 수요일
ZohoX와 Google docs
![]() |
Zoho의 Office suite(이름하야~ ZohoX, Zoho에서 제공되던 기존의 서비스에 e-mail 솔루션과 calendar가 추가)와 Google의 Office suite(이름하야~ Docs, Writely와 Google spreadsheet이 통합)가 Closed beta service/출시될 예정이라고 합니다.
※ 그 중에서도 Word에 해당하는 Editor는 모두 iframe의 native한 속성들을 사용한 것 같습니다. 아직 소스를 보는 중이라서 쿨헉~
※ Writely라고 해도.... TinyMCE가 가지고 있는 버그들과 동일한 버그들을 가지고 있는게 있군요. 오호 (-.- ;;)
※ Zoho에서는 추후 다운로드 가능한 서비스도 준비중이라고 하네요.
출처 :
라벨:
잡학사전,
Web,
Web Office
2006년 10월 10일 화요일
IE에서 디폴트 폰트는?
이번에 회사에서 UTF-8변경 작업을 하다보니 '폰트가 변경되었어요'라는 문의가 들어왔습니다. 확인해보니 (다른분이 하셨답니다.) css를 따로 적용하지 않은 곳이라서 인코딩에 영향을 받는게 아닌가 하는 얘기가 나와서 몇가지 실험을 해봤습니다.
textarea를 html 페이지 상에 삽입한 다음에 content-type을 안준경우와 euc-kr과 utf-8로 설정을 한 경우 세가지를 놓고서 실험을 해봤습니다.
head태그에는 아무것도 적용하지 않은 경우 디폴트로 'Courier New'가 설정되었습니다.
{저의 경우에는 ie에서 디폴트로 UTF-8로 받도록 설정을 하였습니다. }
당연히~ UTF-8로 Content-type을 설정한 경우에도 Courier New가 나오겠죠.마지막으로 euc-kr로 설정한 경우입니다. 이 때는 인코딩이 한글로 설정되고 '굴림체'로 설정이 됩니다. 별 차이가 없는 듯 하지만... 어떤 분에게는 중요한 차이일 수 있습니다.
textarea를 html 페이지 상에 삽입한 다음에 content-type을 안준경우와 euc-kr과 utf-8로 설정을 한 경우 세가지를 놓고서 실험을 해봤습니다.
head태그에는 아무것도 적용하지 않은 경우 디폴트로 'Courier New'가 설정되었습니다.
{저의 경우에는 ie에서 디폴트로 UTF-8로 받도록 설정을 하였습니다. }
당연히~ UTF-8로 Content-type을 설정한 경우에도 Courier New가 나오겠죠.마지막으로 euc-kr로 설정한 경우입니다. 이 때는 인코딩이 한글로 설정되고 '굴림체'로 설정이 됩니다. 별 차이가 없는 듯 하지만... 어떤 분에게는 중요한 차이일 수 있습니다.
ABC
ABC
P.S. 영어모양이 눈에 띄게(?) 차이가 나죠.. ^^ABC
asp의 FormatDateTime을 php로 변환하기
asp에서 FormatDateTime() 호출하면 다음과 같은 형식으로 출력됩니다.
현재시간을 "2006년 10월 10일 오전 10시 13분"로 가정한다면 다음의 형식으로 출력이 됩니다.
해당코드는 php의 date()로 변환이 가능합니다.
관련 링크: PHP메뉴얼 : date()
현재시간을 "2006년 10월 10일 오전 10시 13분"로 가정한다면 다음의 형식으로 출력이 됩니다.
- FormatDateTime(Now, 4) => 10:14
- FormatDateTime(Now, 2) => 2006-10-10
- FormatDateTime(Now, 0) => 2006-10-10 오전 10:13:10
해당코드는 php의 date()로 변환이 가능합니다.
관련 링크: PHP메뉴얼 : date()
왜 refactoring인가?
사전에서 'refactor' 또는 'refactoring'을 검색하면 검색 결과가 없다고 나온다.
아~! 먼저, 내가 이런 의문을 갖게 된 것은 butunclebob.com에서 The Morality of Error Checking의 글을읽다 'factor'란 단어를 발견했기 때문이다.
'factor'를 사전에서 찾아보면 (동사이므로) '인수 분해하다', '채권을 싸게 매입하다.'이다.
ㅡㅡ;; 전혀 말이 맞지 않으므로 Wikipedia의 사전인 Wiktionary에서 'factor'를 검색을 해봤다.
음.. 이제야 맞는 것 같다. (맞는감?) 그럼 refactor는 To find all of a number's factors again 정도 되지 않을까?
(ㅡㅡ;; 아침부터 뭐하는 짓이지~ . 좋은 하루들 되세요...)
출처:
도대체 일반적으로 refactoring이라고 하는 것은 어디에서 비롯된 것일까?
검색어 'refactoring' 에 대한 검색결과가 없습니다.
아~! 먼저, 내가 이런 의문을 갖게 된 것은 butunclebob.com에서 The Morality of Error Checking의 글을읽다 'factor'란 단어를 발견했기 때문이다.
The Morality of Error CheckingSo,I'm working on this set of classes that generate Java code. In theprocess, I discover that I have a bunch of private methods on a classand I choose to factor them out into a new class that looks like this:
'factor'를 사전에서 찾아보면 (동사이므로) '인수 분해하다', '채권을 싸게 매입하다.'이다.
ㅡㅡ;; 전혀 말이 맞지 않으므로 Wikipedia의 사전인 Wiktionary에서 'factor'를 검색을 해봤다.
Verb
factor, factors, factored, factoring
1. To find all of a number's factors (the numbers which divide into the first number evenly), often used in encryption
음.. 이제야 맞는 것 같다. (맞는감?) 그럼 refactor는 To find all of a number's factors again 정도 되지 않을까?
(ㅡㅡ;; 아침부터 뭐하는 짓이지~ . 좋은 하루들 되세요...)
출처:
라벨:
의미,
잡학사전,
etc,
Refactoring
2006년 10월 9일 월요일
Scrybe
Scrybe라는 일정관리 웹 애플리케이션이 나왔습니다. 부드럽게 움직이는 UI가 매력적이네요.
뭘로 만들어졌는지가 제일 궁금하네요 ^^;;;; 10월달에 Beta 출시니 아직 공개된 내용은 없습니다.
제공되는 특징은 다음과 같습니다.
- 설치 없이 오프라인에서 사용 가능
- 데스크탑 애플리케이션처럼 풍부하고 빠른 기능제공
- 달력 화면을 줌기능으로 조절가능
- 북마크, 이미지나 파일, html파일과 함께 메모작성
- To-do 리스트 통합
- 일정 공유기능 제공
- 프린트시 엘레강스하며 퍼펙트한 포멧 제공~
- Multiple timezone을 제공
- 다른 애플리케이션 포멧을 쉽게 임포트/익스포트 가능
출처:
Scrybe로 연결되는 Joel의 reddit.com 링크 : http://joel.reddit.com/goto?rss=true&id=lcl0
Scrybe 사이트 : http://www.iscrybe.com/
라벨:
일정관리,
잡학사전,
Web,
Web Application
2006년 10월 2일 월요일
또 한주의 시작입니다.

이글루스 점검화면
그 시작을 회사와 함께 하고 있습니다. ㅋㅋ
플랫폼 변경 작업 때문에 일하기 시작한지12일째만에 두번째 밤을 보내고 있네요 ^^;;;
오늘 근무만 끝나면 추석이네요.
추석 잘 들 보내시고.. 건강하게 추석 끝나고 보아요 ^----^*
피드 구독하기:
글 (Atom)