spectrum learns to dig

1.0 이후론 package를 만드는 과정이 아주 직관적으로 바뀌었다. 이번엔 photoswipe 를 가지고 만들어 보았다. 모바일에서도 pinch zoom in/out등이 잘 작동하는 의존성이 없는 좋은 javascript gallery다. 먼저 해당 meteor project의 root 에서 package를 생성해보자 meteor create --package spectrum:photoswipe cd packages/spectrum:photoswipe packages/ 경로 안에 해당 package경로로 들어가서 git init 으로 저장소를 초기화한 후 git submodule add https://github.com/dimsemenov/PhotoSwipe.git lib 으로 photoswipe 저장소를 submodule로 추가한다. 여기선 lib 경로아래로 받도록 하였다. packages.js 수정하여 설명, 버전, 저장소등을 수정한다. Package.describe({   name: 'spectrum:photoswipe',   summary: 'JavaScript gallery, no dependencies.',   version: '1.0.0',   git: ' https://github.com/acidsound/meteor-photoswipe.git ' }); Package.onUse(function(api) {   api.versionsFrom('1.0');   api.addFiles([     'lib/dist/photoswipe.css',     'lib/dist/default-skin/default-skin.css',     'lib/dist/default-skin/default-skin.png',     'lib/dist/default-skin/defau...

Camera와 Gallery를 사용하는 앱을 Meteor로 만들자. 준비 meteor 설치 ( https://www.meteor.com/install ) 실행과정 : project를 생성하고 $ meteor create camera-practice $ cd camera-practice iOS, android 환경을 추가한다. $ meteor add-platform ios $ meteor add-platform android You must agree to the terms to proceed.        Do you agree (Y/n)?  에서 Y혹은 enter android: added platform  플랫폼 추가 완료. 플러그인 추가 $  meteor add cordova :org.apache.cordova.camera Must declare exact version of dependency: org.apache.cordova.camera@undefined https://github.com/apache/cordova-plugin-camera/blob/master/plugin.xml 에서 버전 정보를 확인해보니 0.3.4-dev 하지만 역시 빌드시 오류가 있으므로 안전한 0.3.2로 가자. $ meteor add cordova :org.apache.cordova.camera@0.3.2 added cordova plugin org.apache.cordova.camera@0.3.2 성공. cordova라는 namespace만 붙여주면 마치 원래 Meteor package인양 가져오는 모습이 아주 흐뭇하다 :) 나는 coffeescript를 좋아하니까 meteor add cofffeescript 일단 필요없는 초...

드디어 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...

Unable to mount USB, Not Authorized 오류가 날때가 있다. 직접 콘솔에서 들어가면 잘 되는데 RDP로 접근할 경우 해당 계정에 권한 문제가 있을 수 있다. http://ubuntuforums.org/showthread.php?t=1336847&page=7  에서 찾았다. sudo vi /usr/share/polkit-1/actions/org.freedesktop.udisks.policy 해서 보면 <allowed_any>no</allowed_any> 라는 부분이 있다 이부분을 <allowed_any> yes </allowed_any> 로 바꾸고 재부팅하자. 알아서 마운트까지 잘 된다.

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를 눌러서 나가면 된다.

http://www.andrehonsberg.com/article/install-nginx-141-meteor-js-websocket-ubuntu-1204 3000->80포트 포워딩하느라 nginx를 사용하긴 했는데 (그리고 ssl도 해야하고 등등) 맘에 걸리는 점이 두가지 있었다. gzip을 안써도 되나 정적 resource를 meteor가 다루지 않도록 해야 그래서 찾아보니  http://stackoverflow.com/questions/18003689/recommended-nginx-configuration-for-meteor  이런 글이 있더라 딱 내가 찾던거네! 근데, meteor에선 css의 경우 경로가 /fc376dc60222227945af14b78724770fb1dbb699.css?meteor_css_resource=true 이런 식으로 뒤에 ?meteor_css_resource=true  가 붙는다. 정규식만 조금 고쳐주자. location ~* "^/[a-z0-9]{40}\.(css|js)$" { 이 부분을 css 뒤에 개행이 아닌 아무거나 와도 되도록 .*를 추가해주자.  location ~* "^/[a-z0-9]{40}\.(css .* |js)$" { 어 이거 하고 나니 PageSpeed Insights 가 100점이 되넹?

자 이제 더러운 짓을 할 때다. 각종 권한들 왕창 플러그인들도 왕창 미리 설치해놓고 잠수함 패치로 앱스토어를 거치지 않고 업데이트할 수 있도록 미리 준비하는 것이다. TestFlight에 올리록 Archive를 하니 'Cordova/CDVViewController.h' file not found 오류가 계속 나서 stackoverflow를 전전하다 보니 아뿔싸 내 Cordova 버전이 너무 낮다. 3.5로 다시 업글 npm install -g cordova 그리고 iOS 7에선 Status bar가 내용을 가린다. MainViewController.m을 좀 수정하자. - (void)viewWillAppear:(BOOL)animated {     // View defaults to full size.  If you want to customize the view's size, or its subviews (e.g. webView),     // you can do so here.     //Lower screen 20px on ios 7     if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {         if(self.webView.frame.origin.y == 0) {             CGRect viewBounds = [self.webView bounds];             viewBounds.origin.y = 20;             viewBounds.size.height = viewBounds.size.height - 20;   ...