내일부터 연수(?) 들어갑니다.

경

력직 사원들을 대상으로 한 일촌캠프에 참가하기 위해서 사라집니다.
뭐.. 이틀 뿐이기는 하지만.. 오늘로서 이번주는 마감이랍니다. 므흣~

Virtual Earth API가 공개되었습니다.

InfoQ의 기사에 Virtual Earth 2lines of JavaScript라는 기사가 올라왔습니다. Google Map을 사용할 때보다 훨씬 빠른 느낌에 드네요. 3D로 보면서 방향 전환도 가능하네요 ^^

위 이미지는 Virtual Earth의 Hello World에서 캡쳐한 사진입니다. 동작은 Google Map과 동일합니다. div에 image를 감싼 형태로 마우스 이동시 이미지를 받아오는 기법을 사용하고 있구요.  파폭에서본 화면입니다.

출처 : InfoQ - Virtual Earth 2 lines of JavaScript


P.S.
IE에서는 프로그램을 설치하라고 하는군요!! .Net Framework 2.0이 함께 설치됩니다.

당신의 블로그 예절 지수는??

당신의 블로그 예절 지수는
0점 입니다.

바르게살자!!!


=> 블로그 예절 캠페인

데이터뉴스(DataNews)

(주)데이터뉴스는 통계를 전문으로하는 인터넷 미디어 업체입니다. 코리아 닷컴을 오픈하였던 네티비전(현재는 데이터뉴스로 사명을 변경)에서 제공하는 서비스로 서베이, 투표를 통해서 얻은 데이터를 바탕으로 통계와 관련된 뉴스를 제공하는 서비스를 하고 있습니다.

블로그와 관련된 기사는 11월24일에 올라온 기사 하나밖에 없기는 하지만, 기사기사마다 상당히 재밌는 내용을 많이 담고 있네요. ^^

출처 : 네이버 백과사전 데이터뉴스 항목

Ohpy.com

Introduction
나우콤에서 개발한 Ohpy(Open + Homepy의 합성어)는 기존의 카페, 블록, 미니홈피 등을 통합한 서비스로서 모든 서비스를 포함한 홈페이지 서비스를 제공하는 것을 목표로 하고 있습니다. 그렇기 때문에 형태 자체도 기존의 블로그나 미니홈피와는 다르며 카페의 형태에 더 가까운 것 같습니다.

특이사항으로는 상거래 기능을 지원하기 위해서 공동구매, 장터 게시판이 따로 카테고리로 제공되고 있으며 안전한 거래를 위해서 오피 안전거래 서비스를 도입하고 있습니다. 수수료는 저렴하게 받겠다고 하는 군요. ^^

Homepage

우측 메뉴의 Visitor, Ranking, 동보쪽지를 봤을 때는 카페같은 커뮤니티 지향적인 모습을 볼 수 있습니다.

Ohpy에서 가입을하고 (--;; 클럽박스에서 1300point를 준다길래 덜컥 가입해 버렸습니다. 쿨헉~) 홈페이지를 만들고 나면 제공되는 기본 게시판은 3개입니다. [공지사항, 자유게시판, 사진첩] 세개의 게시판이 겉으로 보기에는 동일한 모양새를 취하고 있고 내부 에디터의 경우에도 동일하게 사용됩니다.

에디터의 마지막을 보면 Creative Commons License에 대한 조항이 눈에 띄는데요. Creative Commons License를 보여주는 건 좋은데 사용자한테 대놓고서 '저작물의 영리적 이용 허락을 허락합니까?'로 묻는다면, 기분 좋다할 유저는 별로 없을 것으로 생각됩니다.. (나만 그런가? ^^;;;)

트랙백이나, 덧글(제가 못찾은건지 모르겠습니다)은 지원하지 않으며 거의 Zeroboard와 형태가 유사합니다. Zeroboard의 데이터를 임포트 가능하게 되어있습니다.

아.. 블로그와 다른 홈페이지이기 때문에 대문에 대한 관리를 따로 두고 보여줄 게시판의 글들이나, thumbnail들을 보여줍니다. 기존 카페의 대문이랑 큰 차이는 없으며 Naver의 프롤로그 같은 형태라 보시면 될 듯 싶습니다.

관리 모드의 경우, 오피마법사와 구성요소마법사라는 것을 두어서 관리 메뉴를 처리하고 있습니다. (개인적인 의견입니다만... 오피스의 Wizard같은 의미로 사용했는지는 모르겠지만, 관리메뉴를 굳이 마법사라고 바꾸는 -기존 블로그나 카페의 관리메뉴와 차이도 없으면서- 이유는 도통 이해를하지 못하겠군요. 제가 무식한건지 ㅡㅡ;)

오피 마법사를 클릭하게 되면 관리모드에 들어가고, 구성요소 마법사를 클릭하게 되면 다이얼로그가 뜨면서 배경 및 기타 내용에 대한 세부설정 다이얼로그가 나옵니다. (따로 둔 이유도 잘 모르겠네요.)

관리모드는 다섯 단계로 이루어집니다.

• 기본설정
• 디자인관리
• 메뉴관리(메뉴는 Tatter 1.1처럼 Drag &Drop이 추가되었답니다.)
• 게시판관리(장터 및, 공동구매 게시판이 포함되어 있습니다.)
• 회원관리(시삽 및 회원관리도 따로 있구요.)

Implementation
기다리던 소스 분석으로 들어가보면 눈에 익숙한 코드들이 눈에 많이 띄입니다. 사용된 라이브러리들은 다음과 같습니다.

• prototype.js
• Lightbox  JS 2.0
• script.aculo.us의 Effect
• Tooltip.js
• Mr.Proto님의 Prototype Window class를 축소한 window
• dhtmlHistory
• whizzywig 에디터
  

소스코드는 Obfuscating이나 Minifying을 하지 않은 코드들입니다. 오픈 소스를 많이 사용하였구요. 아쉬운 점은 prototype을 사용했다면 좀 더 재사용가능하게 Class로 상속받으면 낳지 않을까 싶은데.. 대부분이 function기반으로 구현이 되어 있네요.


출처 :

Ohpy.com

dhtmlHistory는 Koders.com에서 찾았습니다.

'만원'의 행복

엘레베이터에 20명이타서 20층에서 1층까지 한번에 내려가기 ㅋㅋ
'만원입니다~'

그림출처 : http://www.flickr.com/photos/14009972@N00/90926163/

P.S : 표정이 예술이네요. ^^

Remember The Milk

Remember The Milk는 나온지는 좀 되었기는 하나 가입할 때의 UI가 (@hof님에 따르면) 아주 직관적이며 알기 쉽게 되어있다고 하여서 나름 분석에 들어가 보았습니다.

Remember The Milk는?
할일 목록을 웹상 또는 이메일 상에서 쉽게 관리하기 위한 서비스입니다.

Implementation
Remember The Milk의 js파일은 크게 두가지로 구성되어 있습니다. 리소스를 관리하기 위해서 사용된 ko.hompage.32.js는 'HOMEPAGE_'로 시작되는 116개의 연관배열이 들어있습니다.

또 하나의 파일은, rtm.signup.9.js로 obfuscating은 되어 있지 않고 minifying만 되어 있습니다. prototype같은 라이브러리를 사용하지 않고 자신들의 코드만으로 18810 bytes의 적은 용량의 js만 사용하고 있습니다.

동작은 간단합니다. 각각의 input element에서 keyup 이벤트가 발생하는 경우 이를 체크하여서 input 옆의 span 태그에 성공메시지 또는 실패메시지의 html코드를 innerHTML로 삽입하는 구조를 취하고 있습니다.

코드 상에서 확인하는 것도 크게 어렵지는 않습니다만, 코드 주석에 Don't steal, Please라 되어 있네요. ^^;;
스크립트 상의 코드만 보고 이렇다 저렇다 말하긴 어렵겠지만, 단순하면서도 필요한 곳에만 사용한 스크립트 코드가 참 마음에 드네요.

• 리소스 관리를 통해서, 영어권 외의 시장까지 노릴 준비를 했다는 점,
• 필요한 곳에만 스크립트 사용을 함으로써 파일 전송과 관련된 리소스를 대폭 줄였다는 점,
• 이미지와 텍스트만 사용했지만 사용자에게 무엇이 문제인지를 알 수 있게하는 직관적인 인터페이스

이러한 점이 Remember The Milk만의 큰 장점이 아닐까 싶네요. 아... 가입쪽만 분석해봤습니다. TODO List 쪽은 보지 않았습니다.

짜증나는 GS이숍

평소 집에서 스티로폼으로된 매트 하나만 깔고 사는 저에게 무슨 바람이 들었는지 대방석을 하나 질렀습니다. [매트도 야외용의 얇은 스티로폼으로 한 2년 썼죠.] 사실 사게된 동기는 GS이숍에서 12%나 할인된다는 쿠폰이 왔길래 신나는 기분으로 질렀습니다. 거기에 배송일 지정이 가능하다고 되어 있더군요.

그러나!!

결제할 때 배송일지정과 관련된 내용을 보게되면 전화를 따로 해줘야 한다고 합니다.
고로 기분좋게 결제하고 전화를 했습니다. 전화하시는 분 친절하게 배송가능한지 확인하고 내일 전화준다고 하더군요.

다음날, 연락 안왔습니다.

그 다음날, 이전에 구입했던 전자렌지 때문에 택배회사에서 난데없이 전화와서 배송하겠다고 하더군요.
[물론 GS이숍에서 저저번주정도에 구매했었습니다만 제품이 없다며 업체에서 입고되는 되로 배송일지정 연락주겠다고 했었습니다. 당연 이것도 연락안왔죠.]

화가나서 전화하니, 상담원분이 하시는 얘기가...
배송일지정이 가능한 경우는 가전제품같이 업체에서 출고되는 제품만 가능하다고 하는군요. 방석같은 제품은 자신들의 물류창고에서 나가서 배송일지정이 안된다고 합니다.

이말이 맞다면, 업체에서 출고되지 않는 작은 제품들은 배송일지정이 전혀 불가능하다는 얘기가 되죠.
상담중에 더욱더 황당했던 것은 이전에 상담하셨던 분이 배송가능 여부 전화주겠다는 기록자체도 남아있지 않다고 하시더군요.

상담은 왜하고 기록은 왜하는지...

아이디어가 아무리 좋아도 서비스가 따라오지 못하면 안하느니 못할거라는 생각도 못하나 봅니다.

Snap.com

Service

Snap.com은 Read/WriteWeb에 얼마전 소개된 사이트로 Snap.com에서 검색을 하는 경우 검색 리스트와 검색 결과의 preview를 제공하는 서비스를 제공합니다. 여기에 더해서 블로거나 회사에서 자신들의 페이지에 코드를 추가할 경우 이 preview를 무료로 사용가능하게 하는 서비스를 제공하고 있습니다.

The Idea

이 서비스는 무료이기는 합니다. 그러면, Snap.com은 어떤 방법으로 수익을 창출할까요? Preview에 답이 있습니다. Preview안에는 작은 검색창이 존재하는데 이를 통해서 traffic을 얻는 방법을 사용하고 있습니다.

Implementation

snap.com의 기본 코드는 prototype.js를 기본으로 하고 있습니다.
snap.com의 코드를 추가하는 경우, 페이지 로딩 시 모든 anchor 태그를 읽어들이고 class가 snap_preview이거나 config가 '전체 anchor에 대해서 preview를 설정'으로 되어 있으면 여기에 preview가 붙을 수 있도록 Observer를 추가합니다.

preview의 경우에도 여러 겹의 div와 투명 png를 사용하여 출력하고 있습니다. snap.com의 코드들은 Obfuscating와 minifying 및 js, css페이지를 html확장자로 바꿔서 살펴보기 어렵게 되어 있더군요. 그래서.. 많이는 보지 못했습니다만, 향후 개발을 위해서인지 Widget 클래스가 존재하더군요.

코드를 보다 재미있는 것도 발견했는데요.

위처럼 gif파일에 필요한 아이콘을 모두 넣어서 배포하고 css상에서 이미지의 위치를 지정해서 필요부분만 출력시키는 형태를 취했습니다. 이런 방법이 있다는 것은 알고 있었지만~ 실제로 이런 형태로 전체가 구성되어 있는 코드를 보니 매우 재미있네요. ^^

출처:

Sanp.com과 Sanp.com의 기사가 실린 ReadWriteWeb의 In B.E.D with TechCrunch - literally

P.S 1:
개인적으로 코드만 봐서든 느낌은 개발진의 역량이 뛰어나서 추후 나올 서비스가 상당히 기대되네요.

P.S 2:
남이 애써서 못보게하는 코드를 보는 나쁜 짓(?)에 죄책감을 느낍니다. (__)

P.S 3:
Snap.com에서 'Get Info Now' >'Get it Free Now'로 들어오게 되면 mail address와 주소를 넣고 라이센스 동의 페이지가 나옵니다.

가입을하고 나면 Script를 보여주는 페이지가 나옵니다. 여기에서 Script를 Copy해서 자신의 블로그 페이지에 삽입하면 됩니다. 저의 경우에는 Tatter tools의 Skin 페이지의 header에 삽입하는 방식으로 처리했습니다.(이전에 Google Map에 사용했을 때는 안되었는데.. 모르죠.. 다시 막을지도 ㅠㅠ)

Talkr

평소에는 Bloglines.com에서 feed만 읽다가 오랜만에 Read/Write Web에 들어가서 글을 읽었습니다. 읽던 중 글의 하단에 보니 마이크 처럼 생긴 아이콘이 하나 보이더군요.  클릭을 해보니 talkr.com에 있는 mp3파일이 재생이 되더군요.

talkr.com이 뭐하는 곳인지 찬찬히 읽어보니, 다음의 특징이 있었습니다

• 특정 Feed의 text를 mp3로 변환해줍니다.
• 유명한 블로그의 글들은 mp3를 무료로 제공해줍니다. (Free Audio Feeds)
• membership에 가입하는 경우 3개의 feed까지는 무료로 들을 수 있습니다. (그 이상은 유료구요.)

영어만 제공되어서 아쉬운 면이 [설마 제가 듣고 해석할 수 있겠습니까?] 매우  많지만, 아이디어는 재미있네요.
간만의 뒷북이 아닐까 싶기도 하구요 ^^

'웹 진화론'

가격비교

'우메다 모치오'씨가 지은 웹진화론은 웹에 관한글이다. 'Web 2.0'이라는 트렌드로 보여지고 있는 현재의 웹 변화에 대해서 설명(나열이라고 생각된다.)하는 책이다.

책 자체는 232쪽이라는 작은 분량이라서 쉽게 읽을 수는 있으나, 2006년 1월에 출판된 책이라서인지는 모르겠으나 현재의 웹 상황과는 좀 동떨어져 있다는 느낌이 많이 든다.

'제1장 '혁명'의 진정한 의미' - 오픈소스, cheap 혁명(본문에서 명확하게 정의를 내리진 않았으나, 컨텐츠 생산에 따른 비용의 감소를 의미하는 것 같다.), 인터넷이 상승효과를 내서 다음의 세가지 법칙이 나왔다고 한다.

제1 법칙: 신의 시점에서 세계를 이해한다.
- 검색엔진을 통해서 사람들의 인터넷 사용에 대한 행태를 알 수 있다.
제2 법칙: 인터넷상에 만든 인간의 분신이 돈을 벌어주는 새로운 경제권의 탄생
- Adsense 같은 광고를 자신의 홈페이지에 붙임으로 새로운 수익창출이 가능하다.
제3 법칙: 무한대 * 무 = Something, 또는 사라졌어야 할 가치의 집적
- 사용자들이 신경도 안쓸 시간을 모아서 가치있는 것의 재 창출이 가능하다.

이 외의 몇가지 예를 들면서 정보혁밍이 도래했다고 저자는 얘기를 한다. 정보혁명이 도래했다는 얘기에 동의하지 않는 것은 아니나... 제 1법칙은 Web 1.0하고 차이가 없고 제 2법칙은 실제 Adsense로 돈버는 사람이 극히 드물다는 것을 본다면 말도 안되는 얘기고 제3법칙은 spam 같다는 생각이 든다.

'제2장 구글, 지식 세계를 재편한다.' - 구글이 실현하는 민주주의, 정보발전소, 새로운 부의 분배 메커니즘, 구글의 조직 메니지먼트, 야후와 구글의 차이 등을 sub chapter로 가지고 가고 있다. 구글에 대한 발전과정이나 조직에 대해서는 하고 싶은 말은 없다. 그러나 구글이 실현하는 민주주의가 과연 저자가 말하는 민주주의라고 말하기는 어렵다.

구글 차이나에서 발생했던 검열문제 등을 봤을 때 구글도 이익을 추구하는 기업임을 여실히 보여주었다고 생각이 들며, 민주주의를 추구하기 위해서라기보다는 데이터의 정확성을 더 높이기 위한 객관성이 더 제목과 어울린다고 생각이 든다.

새로운 부의 분배 메커니즘에서 드는 구글 애드센스, 과연 부를 재편할 수 있는가? 저자는 개발도상국의 돈 없는 젊은이들이 돈을 벌기 위한 하나의 직업으로 구글 애드센스가 도움이 된다고 주장한다. 그러나, 구글 애드센스로 어느정도 돈을 버신다는 분이 이삼구글님이나, 구글 애드센스를 블로그 하시는 분외에 돈번다고 하시는 분 본 적없다. 너무 이른 결론이 아닐까 싶다.

그리고, 마지막에 든 야후와 구글이 비교. 야후는 인간에 중점을 두고 구글은 기계에 중점을 둔다. 야후는 미디어 기업이며, 구글은 검색기업이다. 그러나, 구글이 챕터안에 대부분의 구글 찬양글로 가득찬 글의 마지막으로 채우기에는 좀.. 거시기하다.

'제3장 롱테일과 Web2.0' - 롱테일, Open API등에 대한 설명으로 Web 2.0에서 롱테일부분과 Open API를 하면 돈을 벌 수 있다라는 식으로 얘기가 진행된다. 그러나, 우리는 안다. Web 2.0 == Google 2.0임을. 일반인을 대상으로한 책이라는 것을 가정했을 때, Web 2.0이 가지고올 밝은 미래에 대한 얘기만 해놓은 것 같다는 생각이 매우 강하게 든다.

'제4장 블로그와 총표현사회' - 저자가 블로그를 운영해서인지 이 책을 사고나서 가장 볼만했다고 드는 생각이 드는 챕터다. 본인의 경험담이 포함되어 있어서인지 내용도 풍부하다.

'제5장 오픈소스 현상과 대중의 지혜' - 오픈소스 현상과 대중이 지혜에 대해서 얘기를 하고 있다. 그냥, 대중의 지혜책을 사보는게 더 낳다는 생각이다.

6장까지 더 내용은 있다. 그러나, 저자가 말하고 싶은게 뭔지는 도저히 이해가 안된다. 바뀌긴 바뀌었는데 저자 자신도 명확하게 정리는 못한것 같다는 생각이 든다. (Web 2.0에 대해서 명확하게 정의 내릴 사람은 아마 없지 않을까 싶다.)

결론:

돈주고 사서보기에는 아까운 책이다.
O'Reilly의 Web 2.0을 보거나 zdnet에서 기사를 찾아서 보거나 대중의 지혜 책을 보거나 롱테일 경제학 책을 보는게 더 낳을 것 같다는 생각이 든다. 요약에 실패한 요약책이다.

내가 찾던 사무용품..

책이 여러권 있을 때 쓰러지지 않게 받치는데 사용하는 물건은?
북스텐드, 책 꽂이, 책 받침도 아니었다.. 북앤드였다. --;; 뭐이리 종류가 많은지..

이미지 출처 : tinalamb's photostream

Check valid email address using regural expression.

JavaScript에서 가장 많이 쓰이는 기능 중 하나는 정규표현식을 사용하는 것입니다.
정규표현식(RegExp)에는 test()를 가지고 있어서 인자로 받는 string이 test를 만족하는지 만족하지 않는지를 boolean 값으로 리턴해줍니다.

var booleanValue = (RegExp).test([str]);

그 중에서도 가장 많이 쓰이는 것이 e-mail을 체크하는 기능입니다. QuirksMode에서는 이러한 e-mail을 체크하는 정규표현식에 관한 기사가 있습니다. 이를 사용하면 쉽게 e-mail을 체크하는 코드를 다음과 같이 만들 수 있습니다.

function checkMail(mailAddress){
  var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
  return filter.test(mailAddress);
}

Url을 체크하는 것도 가능합니다. 비록 완벽하지는 않지만요.

function checkURL(urlString){
  var filter =/(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/
  return filter.test(urlString);
}

출처:

QuirksMode의 Valid email address
validate a url(regexp)

호빵을 통해 본 소비 패턴의 분석

Mr.Proto님의 Carousel 라이브러리(Scrolling-Object)

한 눈에 봐도 강렬한 뽀스가 느껴지는 Mr.Proto님(본명은 Sébastien Gruhier)은 13년간의 C++과 Java로  OO계를 주름 잡으셨다가 최근에 Ruby on Rails로 전향하셨다고 합니다. 흰눈썹에서 품어져 나오는 이미지는 그의 나이를 궁금케 하는군요. ^^

Bookmark manager, Transparent message, Prototype window, Prototype carousel 라이브러리가 Mr.Proto님의 홈페이지에서 제공되고 있습니다. 이번에 살펴볼 라이브러리는 Prototype carousel로서 스크롤링 라이브러리입니다.

Consulting, Training, Development Ruby on Rails/AJAX/JavaScript가 직업이라고 되어 있는데 현재는 free라고 되어있네요. 코드를 보시면 알겠지만 이 분의 코드는 상당히 깔끔하게 객체화도 잘되어있고, 읽기도 편합니다.

먼저, 코드의 Outline을 살펴보면 다음과 같습니다.

위의 property 중에 대부분의 코드는 option항목을 저장하기 위해서 사용됩니다.
스크롤링이 되는 대상들은 페이지 로딩 시에 로딩이되고 각각이 li태그로 감싸져서 반영이 됩니다. 이들 li태그들은 가로방향으로 생성이 됩니다. 다음은 li태그임을 보여주기 위해서 모든 css를 제거한 화면입니다.

css를 모두 제거한 화면

이 화면에 carousel.css를 적용하게 되면 다음과 같이 가로바 형태의 모습이 나오게 됩니다. 여기에서 다시 appliecation.css를 적용하여서 스크롤링하기 위한 Object만 나오게 합니다.

이 때 사용하는 방법이 li들이 저장되어 있는 ul객체를 div로 감싸고 이 div의 크기를 줄인다음 overflow:hidden으로 처리함으로써 나머지 영역을 클리핑하게 됩니다.

carousel.css만 적용한 상태로 div에 overflow:hidden이 적용되어있으나 width는 정하지 않은 상태입니다.

이 상태에서 스크롤 버튼을 누를 때 li의 위치만 변경시켜주면 스크롤이 되게 됩니다. 내부에서는 Clipping되어 안보이기는 하나 li태그들의 위치가 좌우로 움직이게 됩니다. 이 때 사용자는 Clipping 영역만 보기 때문에 스크롤이 되었다고 느끼게 되는거죠.

new Effect.MoveBy(this.carouselList,
      0, delta * this.elementSize, this.options.animParameters);

위의 코드는 script.aculo.us이 코드로 this.carouselList element를 x좌표 0, y좌표 delta * this.elementSize만큼 옮겨줍니다. this.options.animParameters는 script.aculo.us에서 사용되는 설정값들을 저장하는 array들입니다.

개념 자체는 상당히 simple합니다만, 실제 적용하기 위해서는 좌표 계산등에 대해서 상당히 신경써야 되는 부분이 있습니다.  Mr. Proto님께 감사의 마음을 갖고(센스와 디자인 감각도 상당함을 느끼세요) 라이브러리를 사용하셔야 합니다. ^^

• 이 라이브러리는 Bill Scott's Carousel Component(YUI 라이브러리 사용)의 Prototype/script.aculo.us버전입니다.
• 버전은 0.26입니다.
• 라이센스는 MIT 라이센스입니다.
• IE6, Firefox(Mac, PC), Opera, Camino, Safari에서 테스트되었습니다.

출처 : http://www.xilinus.com/

조직을 들여다보면..

특정 그룹으로 나뉘어져 있다. 기존멤버 vs 새로 유입된 멤버, 젊은사람 vs 나이든 사람, 미혼 vs 기혼 등등등...
이글루스는 특이하게 남 vs 여로 나뉘어져 있다. 밥도 따로, 커피도 따로 그 중에 예외이신분도 있긴 하지만 ^^

이미지 출처 : Flickr

Sun에서 Java SE, ME, Glassfish를 GPL v2로 공개했네요.

It has finally happened. Sun today announced that Java SE, Java ME, and Glassfish are being open sourced under the GNU General Public License v2 (GPLv2) with Sun today releasing an early build of the Java SE 7 HotSpot JVM, the javac compiler, and JavaHelp in the new OpenJDK project at Java.NET (link to be added later today once it's public) which will be the project site for future JDK development, releases, bug fixes, etc.  The fully buildable Java SE 7 JDK classlibraries will be available in Q1 2007.

오픈소스를 한다고 들었지만.... 했군요 ^^
Java ME 사용에 따른 라이센스비는 없어지는걸까요?

출처 : http://www.infoq.com/news/2006/11/open-source-java

Tattertools 1.1 업데이트

Tattertools 1.1 정식 버전이 나왔습니다. ^^
가장 눈에 띄는 기능은 관리자 모드의 스킨이 바뀌었다는 것
[--;;;; 그냥 제일 먼저 눈에 띄네요. - 관리자 스킨을 따로 설정 가능하게하였습니다.]

이전 버전의 경우에는 메뉴에 대해서 "새 글을 씁니다.", "글을 봅니다." 등의 서술형 식으로 사용되었다면 1.1에 오면서 변경된 내용은 일반 프로그램처럼 명사형으로 "글", "댓글" 등의 명사형으로 변경되었습니다.

그리고, 이전 버전에서는 관리자 모드로 들어갈 때 글쓰기에 첫 포커스를 가지고 갔다면 지금은 센터에 첫 포커스를 가지고 갔다는 점입니다. 이전에는 블로그가 글쓰기 툴이라는 점이 강조되었고 지금은 블로그의 전반적인 상황을 한번에 알 수 있게하는 페이지를 강조했다는 점입니다.

[차후에 어떻게 변화할지는 모르겠습니다만, 플러그인을 통해서 센터페이지를 꾸미게 하였다는 점을 생각한다면... 테터 사용자간의 네트워크 구성을 위한 기본 틀이되지 않을까 하는 생각도 듭니다. 현재는 공지사항과 통계 및 글과 관련된 정보를 제공해 줍니다. ]

글쓰기에서도 몇가지가 변경되었습니다. 글의 주소를 절대 주소로 잡는다거나 글을쓰는 창의 크기를 조절한다거나 트랙백을 "글을 걸 수 있게 합니다."로 변경을 하거나 링크 삽입 시 새 창으로 띄우지 않고 처리한 점이 눈에 띕니다.

[개인적으로는 링크에 관련된 정보가 글의 중간에 나오는게 더 편했다는 생각도 듭니다. 그러나... 개발하시는 분과 동류인 관계로 나름 의미가 있었지 않나 생각하며.. 패스 ^^]

그리고, 가장 크게 눈에 띄는 변화는 사이드 바입니다. 스킨에 <sidebar> 태그가 들어있는 경우 사이드 바의 정보나 출력 순서를 Drag & Drop으로 쉽게 설정할 수 있게하는 기능입니다. [dojo의 Drag & Drop기능을 사용하고 Graybox도 사용한 것으로 보입니다. 한번 소스코드 읽어봐야겠다는 의욕이 불끈하네요 ㅋㅋ]

테터 개발자분들 수고하셨어요..^^

아.. 또 바뀐 부분이 있네요. Comment를 달때 전에는 바로 반영이 안되었었는데 Comment를 달면 바로 옆의 Recent Comment에 반영이 됩니다. Comment 저장을 Ajax로 처리해서 저장이 성공적인 경우 recentComents를 찾아서 갱신해주는 군요.

P.S.
버그가 있네요. 이미지 업로드 중에 이전 업로드 이미지가 삭제되는 버그가 있네요. --;;;;

P.S. 2
파일 업로드 버튼을 눌렀는데 파이어폭스(Mac)가 죽어버리는 군요. 파이어폭스 2.0의 문제인지 테터의 문제인지는 모르겠습니다. 노정석 사장님이 맥쓰신다던데~ 버그 좀 잡아주세요 ㅋㅋ

PageRank 10인 사이트.. apple.com

Mac과 관련하여 개발을 할일이 없어진 이후로는 잘 들어가보지 않았던 apple.com...
간만에 들어가서 눈에 확 띄는게 있더군요. PageRanck 10 !!!
Apple의 막강한 포스가 확 느껴지네요 ^^

JavaScript Closures for Dummies

Two one sentence summaries:

• a closure is the local variables for a function - kept alive after the function has returned, or
• a closure is a stack-frame which is not deallocated when the function returns. (as if a 'stack-frame' were malloc'ed instead of being on the stack!)

출처 : JavaScript Closures for Dummies

Ultrasonic Ringtones hearing test

한마디로 청력검사 사이트군요. ^^

출처: 천조 님의 블로그를 통해 들어간 Ultrasonic-ringtones

xfade 2

xfade 2 라이브러리는 fade in/fade out을 실행하는 라이브러리입니다. 특징은 다음과 같습니다.

• id가 imageContainer인 div에서 fade in/fade out할 이미지목록들을 지닙니다.
• setTimeout을 실행시켜 so_xfade()를 특정시간 뒤에 호출하며 내부에서도 recursion으로 호출합니다.
• 이미지들을 동일 선상에서 출력하기 위해서 display: block을 사용합니다.
• fade in/out은 style의 MozOpacity(for ff), opacity(for safari), filter(for ie)를 사용합니다.

출처: xfade2

SkyMaul

Flash로 접히는 책을 만들었네요 ^^

출처:

'Be sure to check out page 120'을 통해서 들어간 Sky maul's FlipBook

Tamarin Project, JavaScript JIT Compiler

Adobe에서 자신들의 JavaScript Compiler(Code name Tamarin)를 Mozilla재단에 기부하였다고 합니다. Tamarin은 Adobe의 Flash player에 사용되는 컴파일러로 기존의 JavaScript engine들보다 열배정도 빠른 JIT컴파일러를 사용한다고 합니다.

현재 Flash player 9에 포함되어서 배포가 되었으며, 현재까지는 ECMAScript 3rd(JavaScript, ActionScript 및  JScript)까지 구현되었으며 최종목표는 ECMAScript 4th까지 구현을 목표로 하고 있습니다.

Tamarin의 도입으로 Firefox에서의 Ajax(또는 dhtml) 프로그램의 속도는 상당히 향상될 것으로 보이네요. RIA의 향방과 IE에서의 JIT 컴파일러가 도입될런지의 여부도 또하나의 관전 포인트가 되지 않을까 생각됩니다. ^^

Tamarin, 비단털원숭잇과

개인적으로는 Java의 Open source화를 통해서 Browser상에서의 Java의 역할이 확대될 수도 있지않을까 생각하였는데 이제는 좀 멀어졌다는 생각이 드네요. Java가 왜 Web에서 실패하였는가에 대한 글(정확히는 JavaScript에 관한 글입니다.)도 올라와있네요.

출처:

Adobe's World of Web/Desktop integration
What did JavaScript hava that Java did not
Web 2.0 Newsflash: Adobe's Flash Player Scripting Engine To Be Open-Sourced

그림출처 :

http://flickr.com/photos/37056958@N00/201673947/

P.S. 1
Tamarin의 공개는 ActionScript의 오픈소스화와 동일한 의미로 보는 사람들도 있네요.[봐야겠군요. ^^;]

P.S. 2
Tamrin의 technical goal은 다음과 같습니다.

1. Integrating the Tamarin VM and garbage collector within SpiderMonkey
2. Using the SpiderMonkey compiler to generate code for Tamarin
3. Porting the just-in-time compiler to new hardware platforms
4. Completing the self-hosting ECMAScript 4 compiler

Displaying percentages

Bare NakedApp에 재미난 글이 하나 올라왔습니다. Displaying percentages라는 글인데요. 일종의 Progress bar를 image 두개로 간단하게 만드는 방법입니다.

이미지는 위의 두 개의 이미지입니다. percetImage.png의 background로 percentImage_back.png를 설정합니다. 그리고 percentage가 변경됨에 따라서 percentImage_back.png의 위치를 조금씩 위로 옮기면 됩니다.
Displaying percentages에서는 percentImage.png의 style과 percentImage 태그를 다음과 같이 설정하였습니다.

background로 percentImage_back.png를 설정해줍니다.

그리고, img태그의 percentImage.png에 style을 percentImage로 설정함으로서 percentimage_back.png를 설정하여 progress처럼 보이게 해줍니다. 아주 간단한 효과만으로도 이미지의 진행상황을 보여주게 됩니다.

progressbar 보기

※ 위의 코드는 prototype.js의 PeriodicalExecuter를 사용하여 시간이 지남에 따라 updateProgress라는 메소드를 호출하여 background-position의 위치를 변경시키게 됩니다. (iframe을 삽입하는 경우 삭제해버리네요.)


출처 : Displaying percentages