spectrum learns to dig

Fuse라는 툴을 twitter 에서 계속 광고를 하고 있고 나는 twitter가 안 망했으면 하는 1人이므로 눌러줬다. Sketch 하고 연동되고 Transition Animation 및 속도에 민감하다고 한다. html 같은 독자적 xml 구조를 사용하고 로직은 js로 돌아가는 구조. titanium 보고 있나? 매력적인 요소는 많다. 실 기기 동시 AutoReload 라던가 Layout, Transition 등에 목숨 건다던가 Sketch랑 Artboard 1:1 연동 등등. 다리가 후달거린다. 일단 설치하고 App을 만들어보자. 커맨드 라인으로 쓰는 법을 알기 위해 fuse 라고 쳤더니 어랍쇼? 이런게 바로 뜨네. 커맨드 라인은 지원하지만 Dashboard 도 됩니다라는 거냐. New 눌러보자. 이름을 정하고 만들었더니 Sublime 열기가 있다. Sublime 3 설치하고 다시 실행. 호오. 친절하네. 엔터엔터 설정하니 플러긴도 막 깔아줌. 친절친절. 프리뷰 띄워보자. 시뮬레이터랑 iOS/Android 실기기를 지원하나보다. 일단 Local먼저. 연결연결 로딩로딩. 간지간지! 아이폰 연결도 해보자. 이건 시간 좀 걸리네. Xcode를 띄워준다. 헤더 파일이 좀 많네. 프레임웍들은 거의 대부분 다 쓰는 듯.  바람직한 뜨리 샷 내친김에 안드로이드도 가자. 실기기 연결하고. fuse install android 하면 호로홀호롷로로~~ 5.0.1 설치한다 오오. 엔진이 C++로 되있으니 NDK도 깔아야겠지. 끝. 안드로이드는 프리뷰를 처음 할때 좀 느리다. 지겨워도 끊지 말고 기다리면 뜬다. 기본 예제의 MainView.ux (확장자가 무려 ux - 0-!!!) 를 보니 Panel 안에 Page들이 세 개 있고 그 안에 있는 Text들을 좀 수정해보았다...

드디어 Meteor가 1.0을 찍었다. 감동 ;ㅅ;)/ Todo가 예쁘게 바뀐 건 봤고 새로운 예제 앱이 생겼다. 그 이름은 바로 LocalMarket. 동영상을 찍어서 보여주고 싶지만 귀찮기도 하고 어짜피 meteor create --example localmarket 치면 다 알테니까. 이전까지 실험적이었던 Mobile 정확히 말해 Cordova 와의 통합이 아주 멋지게 이루어졌다. 실행 옵션이 좀 많아졌는데 meteor run : 그냥 Meteor 웹서버만 기동. 이하 아래의 것들도 기본적으로 Meteor 서버를 실행한다. meteor run android meteor run ios : 안드로이드, iOS 시뮬레이션을 실행한다. 안드로이드의 경우 Hardware Accelerated Execution Manager (Intel HAXM) 을 설치한다. meteor run android-device meteor run ios-device : 실제 iOS/Android 장비에서 실행한다. 실행에 대해선 어짜피 해보면 되니까 여기쯤 해두고 Web과 Mobile(android/iOS)간의 차이를 어떻게 극복했는지가 궁금한 거니까 디렉토리 구조를 살펴보기로 하자. 먼저 디렉토리 구조를 보자. client 는 사용자가 실제로 보는 html+css+js+기타등등이고 server 는 backend 쪽인 것까지는 기존과 동일하다. lib는 client/server 양쪽에서 실행되는 Collection, Router등등의 코드가 있다. client 쪽에선 lib 아래에 jquery.touchwipe.js 를 쓴게 보인다. 그리고 head.html을 따로 분리하여 공통 헤더를 만들어 놓았고 init.js 에선 사용자가 앱/웹을 실행시 Geolocation.currentLocation(); 를 사용하여 위치정보를 수집할 수 있도록 해놓았다. package 는 atmosphere가 아닌 프로젝트별 custom...

Arduino를 보고 있다. Bluetooth 모듈하고 연결은 tx,rx를 서로 교차연결하고 전원만 받아주면 만사 오케이더라. 이렇게 해서 이렇게 하긴 했는데 테스트 하기 위해선 nc 같은 터미널로 하면 쓸 수 없을까 싶었는데 그냥 screen 명령을 쓰면 되더라. Bluetooth Pairing 후 $ ls /dev/tty.* /dev/tty.Bluetooth-Incoming-Port /dev/tty.HC-06-DevB /dev/tty.Bluetooth-Modem 해보니 테스트 용으로 쓰고 있는 HC-06-DevB가 보이더라. $ screen /dev/tty.HC-06-DevB  으로 접근하면 시리얼 터미널로 돌입한다. 에코가 있으면 에코를 쏠테고 아니면 그냥 받아준다. 뒤에 전송속도를 써서 $ screen /dev/tty.HC-06-DevB 9600 이렇게 접근도 가능하다. 커맨드를 치고 enter를 치면 텍스트를 전달한다. 테스트를 마치고 나갈땐 ctrl+a, ctrl+\ 를 입력하면  Really quit and kill all your windows [y/n] 하고 물어본다. y를 눌러서 나가면 된다.

Google Chrome 이나 Firefox, Safari 그리고 아쉽지만 그런대로 Internet Explorer까지 모두 개발자 도구를 지원하여 DOM 구조를 보거나 요청별 응답시간을 추적하거나 CSS를 살펴보거나 할 수 있다. 이건 너무 편하고 당연해서 우리가 모바일 환경(Android/iOS)에서 같은 환경을 사용할 수 없는게 모바일 웹 개발의 어려운 점이기도 한데. 역시 찾아보니 방법이 있다. 먼저 iOS 같은 경우는 설정 > Safari > 고급 > 웹속성 을 켜주면 iOS장비와 Safari가 깔린 컴퓨터를 서로 연결하여 개발자용 메뉴 > (해당 기기 이름) 을 통해 접근가능하다. 물론 컴퓨터용 Safari에서 미리 환경>고급>메뉴 막대에서 개발자용 메뉴 보기 를 체크해줘야한다. 그리고 Android의 경우 Chrome for Android 가 있다면 좀 더 좋은 환경을 제공한다. https://developers.google.com/chrome/mobile/docs/debugging  내용 참조. USB 연결 후 adb devices 에서 장비 연결을 확인하고 Chrome for Anroid 에서 Settings > Advanced > Developer tools 로 들어가 Enable USB Web debugging 를 체크 그다음 adb forward tcp:9222 localabstract:chrome_devtools_remote 를 실행해서 9222 포트를 연결하고 크롬에서 localhost:9222를 띄워서 디버깅할 창을 선택하면 된다. https://developers.google.com/chrome-developer-tools/docs/timeline 도 같이 쓸 수 있따. 센스가 있는 분들이라면 iOS건 Android건 에뮬/시뮬을 통해서도 할 수 있지 않을까라고 생각할 수도 있을텐데 맞다. iOS Simulator나 AndroVM...