크롬의 광속버전업.....-_- 그닥 눈에 띄는 개선점은 안보이지만, 숫자를 미친듯이 올리네요. 일부러 그러는건가....IE도 이제 9나오니까 IE나오는 시점에 9를 내놓은건가....-_-

암튼, 구글크롬의 광속버전업을 통해 벌써 9.0이네요. 크롬이 제 기본브라우저인데, 역시나 빠른 속도 때문에 씁니다~ 뭐 잘 안되는 사이트가 있으면 다시 IE를 열어서 보면 되니깐요~ 제가 자주 가는 사이트들은 크롬에서 잘 돌아가서 뭐 그닥 무리 없이 잘 쓰고 있습니다.
11번가 같은경우도 쇼핑은 크롬에서 하다가 결제할 때에만 다시 IE로 들어가서 결제하죠~
이미지가 많은 쇼핑몰 같은 경우 확실히 크롬이 빨라요~

9.0에서 달라진 것은 다들 시험적으로 진행되던 것을 그냥 정식으로 넣은 것 같습니다.

1. WebGL지원

WebGL은 기존에 크롬 실행할 때 파라메터로 webglenable인지 뭐시기인지 넣어주면 되었던 걸로 기억하는데, 이제 디폴트로 들어간 것 같네요.

여기 아래사이트에서 webgl이 잘 돌아가는지 테스트해볼 수 있어요~ 좀 끊기지만, 잘 되네요~ http://www.chromeexperiments.com/webgl

2. 순간검색
구글 순간검색도 지원하네요. 이것도 8.0에서 된거 아니였나... 얘네들 블로그에 그냥 글을 쓴건가..ㅠㅠ 9.0이 아니라 그냥 이런게 된다고....ㅠㅠ
이건 옵션에서 기본설정에서 검색 부분에 있어요~ 체크해놓으니까 좋네요!

2. 크롬 웹 스토어
이것도 나 전에 8.0때부터 있었던 것 같은데ㅠㅠ 암튼, 새탭을 열면 응용프로그램에서 "웹 저장소"라는 아이콘이 하나 있을겁니다. 그거 선택하면 크롬 확정 프로그램 사이트로 가는데, 거기에 Chrome Web Stroe가 좌측에 보일겁니다.

여기서 한가지 의문점은..... 왜 "Web Store"를 "웹 저장소"라고 번역했을까요-_- 그냥 스토어가 더 맞는 것 같아서ㅠㅠ

웹스토어
웹스토어 앱을 둘러보면 3가지타입의 앱들이 존재를 합니다.
1. 사이트를 게시한 앱.
2. 크롬 확장기능 형태의 앱
3. 크롬 확장기능이긴 하나 독립적으로 돌아가는 앱

1번은 그냥 사이트를 게시한 앱들입니다.
그런 앱들 설치하게 되면 응용프로그램 목록에 아이콘이 추가되고, 선택하여 실행하면 그 사이트로 이동시키게 됩니다.
식물대좀비도 트라이얼버전으로 있어서 설치해보면 바로 사이트로 갑니다.
https://chrome.google.com/webstore/detail/mmcegpfdgcoclcdfkjahiimlikdpnina?hl=en-US#
대부분이 이런형태로 되어있는 앱이더라구요^^

2번은 크롬 확장기능입니다. 웹 스토어 메인에서도 Apps탭과 Extensions탭을 분리했습니다. 보면 구글 크롬의 확장기능을 추가하는 건데요.
제가 설치한 확장프로그램은 이렇습니다. 
Bubble Translate - 특정 문장만 셀렉트해서 번역하는 건데, 너무 좋아요~
Google Chrome to Phone Extension - 이건 크롬에서 보고 있는 웹사이트의 url을 안드로이드폰으로 전송하는 기능이죠~
Chrome Gestures - 이거 마우스로 뒤로가기 앞으로가기 하는 다아시는 그거~

3번은 크롬 확장기능이긴 한데, 거의 독립적인 그런 것입니다. 2번같은 경우는 웹브라우징할 때 합체(?)되어서 쓰이는 기능들인데, 얘는 독립적인 형태로 동작합니다.
대표적으로 TweetDeck, Chrome Player 등이 있네요.

웹스토어를 좀 둘러보니 역시나 제일 맘에 드는 앱은 역시나 TweetDeck이네요~ 데스크탑을 그대로 옮겨놓은 듯한 형태! 게다가 데스크탑에서만 될 것 같은 기능인 팝업 기능도 구현을 해놨더라구요.


게다가 데스크탑 버전에도 없는 한글화를 해놨네요 ㄷㄷ

그리고 크롬플레이어가 있는데요. 마치 데스크탑 플레이어처럼 데스크탑에 있는 음악을 플레이리스트에 추가하고 재생시킬 수 있습니다.

그 외에 잼난거 많으니까 둘러보세요~
 
Posted by 머드초보
,
 
아...좀 문제가 발생할 것 같기도 하지만-_- 괜찮을꺼에요-_-
일단 플러그인을 하나 만들었는데요. 조금 문제가 많습니다만, 기본적인 기능은 다 되는.....-_-
크롬플러그인의 특징은 백그라운드에서 어떤 작업을 계속적으로 실행할 수 있는 특징이 있습니다. 그래서 html + Javascript의 조합을 통해서도 RSS Reader기를 만들 수 있죠. 게다가 html5문법인 audio와 video 등의 태그를 사용하여 백그라운드에서 실행하는 플레이어를 만들 수 있습니다.
html5에서 지원하는 localStorage도 지원을 해서 영속성이 있는 데이터를 저장할 수 있어요.
그 외에 html5에서 지원하는 canvas도 되구요. 번역기와 같이 현재 열려있는 페이지에 플러그인을 이용해서 번역도 되게 가능하구요. 또한 모질라처럼 NPAPI인지뭔지도 지원하는 것 같은데, DLL파일을 사용할 수 있게 하는 것 같아요. ie탭을 보면 dll파일을 이용해서 하는 것 같네요.

그래서 백그라운드에서 돌아가는 뮤직비디오 플레이어를 만들어 봤습니다.
소리바다에는 뮤직비디오를 퍼갈 수 있는 뮤비위젯이 있습니다. 아마 외부에서 재생이 되게 계약이 된 것으로 알고 있습니다. 그래서 이 뮤비위젯을 이용해 크롬플러그인에서 뮤비들을 localStorage에 저장해놓고 백그라운드에서 재생하는 플레이어를 만드는 것이죠.
뮤비위젯 사이트인데, 이것을 yahoo pipe를 이용해서 html파싱하면 해당 페이지의 뮤직비디오 데이터를 가져올 수 있어요-_- 그 데이터를 가져와서 플러그인에서 재생시키면 됩니다.

이 플러그인은 최신 뮤직비디오를 쉽게 감상할 수 있고, 해당 뮤직비디오만들 모아서 백그라운드 플레이어에서 재생도 할 수 있는 플러그인입니다.
invalid-file

플러그인 설치 파일. 크롬 4.0beta사용자만 가능해요~

사용자 삽입 이미지

우선 크롬플러그인 구조가 백그라운드.html파일이 있고, 크롬플러그인 아이콘을 클릭했을 때 popup.html을 띄워서 컨트롤하는 페이지 2개를 사용할 수 있어요. 이 2개의 페이지는 서로간의 통신이 가능합니다.
[code]var bp = chrome.extension.getBackgroundPage();[/code]
이것은 bp객체를 통해서 백그라운드의 있는 함수같은 것을 호출할 수 있어요.

또한 html + javascript기반이기 때문에 기존에 사용하는 jquery 등의 프레임워크도 사용할 수 있어요. 저도 이것때문에 더욱 빨리 개발한 것 같네요. 역시 jquery가 짱인 것 같아요.

그리고, flash없이 video나 audio파일을 재생할 수 있는 것이 매력적이군요.
video태그는 매우간결한데요.
[code]<video id="video" src="동영상주소"></video>[/code]
이런식으로 해주면 돼요. 그리고 javascript로 컨트롤하려면 여러 함수가 지원됩니다.
그냥 videoid.play()하면 해당 src로 재생합니다.
src을 바꾸려면,
[code]videoid.src = "video주소";
videoid.load();[/code]
형태로 로드해주면 되고, 일시정지하려면 video.pause()인데, 정지함수는 없는 것 같아요. stop하니까 안먹히더라구요-_-

localStorage도 좋은 게 그냥 쿠키같이 서버에서 컨트롤하는 데이터가 아니라 클라이언트 단에서 저장할 수 있어서 좋습니다. 하지만, flash에서 제공하는 SharedObject보다 좀 안 좋은 게 배열을 저장 못합니다-_- object는 저장하는 듯 하는데, array를 저장하려면 json으로 변경해서 저장해야합니다.
localStorage를 사용하기 위해서는 데이터 가져올 때는 getItem, 저장할 때는 setItem, 모두 제거할 때에는 clear()의 함수로 사용합니다.
[code]localStorage.getItem("데이터명");
localStorage.setItem("데이터명", 데이터);
localStorage.clear();
[/code]
크롬 플러그인에서 배열을 저장하기위해서는 json으로 변경할 것이 필요한데, JSON관련된 라이브러리를 제공하더라구요. 스트링화 하고, 파싱하는 함수를 사용하면 됩니다.
[code]localStorage.setItem("저장배열명", JSON.stringify(array));
JSON.parse(localStorage.getItem("저장배열명"));[/code]

나중에 시간되면 크롬용 MP3Player도 만들어봐야겠어요. NPAPI를 제공하는 것 같아 로컬파일 접근도 되는 것 같아요(확실하진 않지만....-_-).
 
Posted by 머드초보
,
 
크롬 4.0beta버전을 사용해야 확장기능을 이용할 수 있습니다.

제가 사용하는 건 뭐 별로 없습니다.
마우스제스쳐, 변역기, IE TAB, 북마크 요거 4개 입니다^^




1. Chrome Gestures(마우스 제스처)
FireFox에서는 Fire Gestures가 있는데, 크롬에는 역시 크롬 제스쳐가 있군요^^ 암튼, 마우스 제스쳐의 기능은 모든 브라우저가 동일하다고 봅니다. 저는 사용하는 게 앞으로 뒤로 정도 밖에 사용하지 않아서-_- 이 정도만 있어도 돼요^^
설치하고 나면 확장 프로그램에 보이는데, 옵션을 설정할 수 있습니다.
옵션에서 실제 자신만의 제스처를 입력해서 지정할 수 있습니다.
사용자 삽입 이미지

이걸 커맨드로.....

저는 앞으로 뒤로 빼고는 탭을 열거나 방금닫은 창을 열기, 닫기 등의 행동은 Ctrl+T, Ctrl+Shift+T, Ctrl+W 등의 단축키가 더 편해서 그걸로 사용하고 있어요. 뒤로가기나 앞으로 가기는 백스페이스 같은 걸로 써야해서 마우스가 훨씬 편해요^^
그런데, 일부 사이트에서는 제스처가 안먹히네요. 아.....크롬 확장기능 목록 보여주는 사이트에서 제스처가 안먹혀요-_-

2. Bubble Translate (변역기)
번역기인데, 매우 깔끔하네요^^ 저 같은 경우에는 개발할 때 모르는 것을 구글링을 통해서 찾다보면 대부분 외국사이트이다보니, 브라우저 번역기가 필수가 되어버렸습니다ㅠ(아님 영어 공부를 하던가 ㅠㅠ).
페이지를 번역할 수 있고, 일부만 드래그해서 번역할 수도 있습니다. 그리고 실시간으로 창으로 열어서 원하는 문장을 입력해 번역할 수도 있습니다.
옵션에서 보면 드래그 번역 시 어떤 단축키를 이용할 것인가를 설정할 수 있습니다. 기본값은 none + ctrl + select입니다. 이건 컨트롤을 누르고 글을 드래그하면 번역이 되는 겁니다^^
사용자 삽입 이미지

깔끔하고 이쁘게 결과값이 나옵니다^^

그리고 주소창 오른쪽에 번역버튼을 누르면 전체 페이지를 번역할 수 있습니다.
사용자 삽입 이미지

확장기능 메뉴

Translate Webpage를 누르면 페이지 번역을 하는데, 살짝 문제가 있는 것 같습니다. 가끔 다른 언어로 번역이 되기도 합니다-_- 서버요청이 잘못 되었다는 메세지도 몇번 받았군요-_-
Real-time은 클릭하면 실시간으로 그냥 구글번역 창을 열어서 번역할 수 있는 기능입니다.

3. IE Tab
설명안해도 아는 프로그램-_- 설치하고 해당 페이지를 ietab으로 보고 싶으면 주소창 오른쪽에 ietab메뉴를 클릭하면 됩니다. 그러면 새창이 뜨고, 주소창이 2개가 되버리는데, 아래 주소창에서 입력하는 것들만 ie로 불러옵니다. 그외에 사이트를 등록하여 특정사이트는 ietab으로 열게 할 수 있습니다.

4. Xmarks Bookmark Sync (북마크 싱크 도구)
워낙 유명한 북마크 싱크프로그램. 크롬에도 들어왔군요. 북마크를 서버와 싱크를 맞춰서 이컴, 저컴에서 사용하는 북마크를 동일하게 하는 것이죠. Xmarks에 계정을 만들고, 싱크를 시키면 됩니다.
전 FireFox를 사용했었는데, 이것 때문에 크롬으로 쉽게 북마크를 가져왔어요^^

아직 베타단계이고, 크롬 정식도 안나오고, 이래저래 문제가 많지만, 저에게는 충분히 쓸만하네요. 앞으로 좀 더 좋은 확장기능이 나왔으면 좋겠네요. 확장기능 한 번 만들어봐야겠다-_-
 
Posted by 머드초보
,
 
IE밖에 모르던 시절-_- 인터넷을 접속하기 위해선 이거 밖에 없다고 생각했었습니다. 이거 Windows를 계속 쓰다보면 IE가 그냥 인터넷접속 도구라고 각인을 시켜준 ms도 참 대단한 것 같아요. 국내에서는 점유율을 90%대를 유지하는 비결인듯-_-

그렇게 2007년까지 살아오다가 FireFox라는 브라우저를 알게 되었습니다. 파이어폭스 2.X대 였던 것 같은데, 직장인이 되고 나서 웹2.0에 대해서 관심을 가지다보니 알게 되었던 것 같습니다.
설치해서 써보는 순간 체감속도가 확실히 IE보다 빠르다는 것을 체험하게 되었습니다. 아놔, 이런 브라우저가 있었구나 라는 생각에 그때 FireFox를 기본브라우저로 설정하고 쓰기 시작했습니다. 2년전이였군요.
하지만, 그 당시만 해도 모든 사이트들이 "CrossBrowsing따윈 개나줘버려~ IE에서만 돌아가면 돼"였기 때문에, FireFox로 접속해도 대부분 사이트들이 깨지거나 제대로 보이지 않는 게 대부분이였습니다. 다행히 FireFox에서는 IE Tab이라는 부가기능이 있어서 제대로 안보이는 사이트들은 ie로 접속하도록 사이트를 등록해서 ie로 접속되도록 설정해서 쓰고 있습니다. 그나마 최근에는 거의 모든 메이저한 사이트들이나 일부 마이너 사이트은 대부분 크로스브라우징을 잘 지원하죠^^ 참 좋은 현상입니다^^
그 외에 북마크 동기화, 개발할 때 도움되는 FireBug, 마우스로 제스쳐, 번역도구 등의 부가기능이 있어 매우 유용한 브라우저죠^^
이런 부가기능과 빠른 속도 때문에 FireFox를 사용하기 시작했습니다.
사용자 삽입 이미지

포켓몬스터 캡슐처럼 생김-_-


그러다가 2008년인가요? 구글에서 크롬이라는 브라우저를 내놓았죠. 그것도 지금까지 존재하는 브라우저보다 훨씬 빠른 속도의 브라우저를 내놓았죠. 처음부터 이런 것을 내놓다니-_- 전에 보니 1.0까지 개발기간은 2년이라도 들은 것 같아요. ie나 firefox 등의 역사가 몇년인데.....-_-
암튼, 그 당시에는 그냥 써보고 음 그냥 빠르네. 라고 지나쳤는데, 어느덧 크롬이 4.0Beta까지 나왔습니다. 광속 렙업(?)으로 성장하고 있어요.
그리고, 최근이 크롬을 살펴보았습니다. 4.0부터는 부가기능을 지원하기 시작했습니다. 이 부가기능을 살펴보니 내가 사용하고 있는 것은 다 있더라구요. 설치해보고 이래저래 삽질해보니까 부가기능 방식도 맘에 들고, 제가 주로 가는 사이트들도 잘 보이고, 특별히 사용하고 있는 데에 문제가 없더라구요^^ 그래서 이제 기본브라우저는 크롬으로 지정해서 사용하고 있습니다^^

아직 FireFox의 FireBug기능은 버리기엔 좀 아쉽긴 합니다. 하지만, FireBug를 사용할 일은 개발할 때나 잠시 사이트를 좀 뜯어볼 때 빼고는 사용할 일이 없기 때문에^^ 그냥 필요할 때만 사용하면 되는 것이다보니 그리 큰 문제가 되지 않았던 것 같아요^^
크롬에서도 FireBug Lite기능이 있긴 있는데, 이건 기능이 좀 제한적이죠. 그냥 웹관련 디버깅이나 html분석정도 밖에 안되서. Net관련 기능은 없기 때문이죠^^ 나중에 공식 FireBug가 나왔으면 좋겠네요.(이름은......크로버그로 나와야하나......-_-)

마지막으로 FireFox에서 크롬으로 옮겨간 가장 큰 크리는 사실 제가 구글을 참 좋아라 해서 그런 것 같습니다-_- 사용자들이 뭘 원하는지 잘 알고 있어요. 그리고 그것을 만들어서 내놓고 있죠. 애플과 구글이 매니아가 많은 이유가 이런 면에서 그런 것 같아요. 뭔가 기능적으로 대단한 것을 항상 내놓지요. it매니아들이 쉽게 빠져들게 만드는 재주가 있어요^^

PS. 하지만......언제 다시 FireFox로 갈아타거나 다른 브라우저로 갈아탈지는 모르겠지만, 절대 IE는 기본브라우저로 설정하지 않을 것 같습니다-_- 아....망할 네이트온에서 편지함 누르면 제발 IE로 강제로 띄우지 마세요! 기본브라우저로 띄워주세요! 네이트온 담당자가 제발 봤으면 좋겠네-_-
성주님의 제보로 옵션으로 기본브라우저로 열기가 있답니다^^ 해보니까 있는데, ie에 최적화 되어있기때문에 어쩌구 하고 경고창이 좀 뜨네요. 그래도 전 메일만 확인할꺼라 잘 되네요^^
 
Posted by 머드초보
,