#gdd11jp Google Developer Day

11月1日、パシフィコ横浜で Google Developer Day 2011 が開催されました。

毎年参加させていただいており、今年もなんとか参加してきました。

サプライズ

結果的にはとても楽しかった GDD。セッションに迷うのは毎度のことですが、今年は色々「しかけ」が用意されており、楽しめるイベントになっていました。

ただ、恒例？のサプライズ発表は特になかったので、ちょっと残念。

全体を通して、やっぱり HTML5(Chrome) と Android(Ice Cream Sandwich) に力入ってましたね。

今回参加したセッションは次の通り。

• Android の最新情報
• Google+ Hangout アプリを作ろう
• 今までにないサイトを作る：HTML5 による最新ウェブアプリ
• Google Apps : 新しい API、新機能、ベストプラクティス
• Google のエンジニアの日常
• イグナイト ( ライトニングトーク )

改めて見ると、新サービス関連に偏ってます。

セッションの内容も、サービスの説明から入る分、あまりコアな情報はありませんでした。

既存サービスのセッションのほうが割りと濃い内容だったみたいです。

Android の最新情報

気になる Android 4.0 。Android 4.0 からは、テレビ、タブレット、スマートフォンなど、すべてのデバイスをカバーする。

なので、デザインはより慎重に行う必要がある。画面サイズの管理も。

ソーシャルもより重要に。Google + が前面に出ています。インテントを利用した設計がおすすめ。

思った以上に、NFC の Android Beam は面白いですね。今開いているWebページが、相手の端末にも表示されるデモは素晴らしかったです。

それと、Wifi Direct ってのも気になります。端末同士がダイレクトにネットワークでつながるということで、面白い使い方ができそうですね。

Google+ Hangout アプリを作ろう

違うセッションを予定していたけど、基調講演で Hangout が気になったので続きを聞いてみた。

基本的に、iFrame のガジェットで構築。ビデオカンファレンスのようなものを手軽に構築できそう。

デモは、チャットルームのような Hangout で、招待された人とビデオチャットしながら、参加者のロボットアバターがアプリ内で動く。というもの。

データはひとつの Shared データなので、参加者全員にリアルタイムで更新される。

面白そうだけど、どんな使い道があるか？今後に期待です。

今までにないサイトを作る：HTML5 による最新ウェブアプリ

HTML5 のフルスペックである Chrome ならこんなことまでできる！という内容でした。

これからのWebアプリは、ビジュアルも重要だと。

HistoryAPI でシングルページだけど、URLが変わってブラウザの戻るも使える。GitHub みたいなページ遷移。たしかにコレ重要ですね。

FilesystemAPI では、ネイティブとの連携でファイルのドラッグドロップなど、ネイティブファイルを操作できる。

古いブラウザには、Polyfills や Chrome Frame を使うのがいいみたい。

ライブラリは、lawnchair , Boilerplate , Modernizr を使うといい。

これらが ブラウザ標準で利用できるのが素晴らしいですね。（まだまだ対応していないブラウザも多いですが）

Google Apps : 新しい API、新機能、ベストプラクティス

DevQuiz での Apps Script が面白かったのでもう少し詳細を期待していましたが、やっぱり、そもそも Apps Script は知名度が低く、触り程度の紹介でした。

しかし、UI Builder や PickerAPI などビジュアル的にも Google UI と統一されたものが揃ってきて、かなり使えるという印象でした。

マーケットプレイスでの公開も拡充してきており、Apps Script は今後本気で勉強したほうがよさそうです。

Google Data API については、これまでの複雑なものをシンプルにすべく [HTTPS] [OAuth2] [JSON] で統一とのこと。これは嬉しいですね。

API の確認には、Google APIs Explorer が便利。

Google のエンジニアの日常

あの有名な yugui さんが登場とのことで、観てきました。

オープンソースな人から見た Google というのは面白かった。

オープンソースの世界では当たり前の光景が、Google という巨大な組織でも適用されているのがすごいと。

エンジニア主導、ドキュメント、コードレビュー、ひとつのリポジトリなどは、初めての GDD に聞いた時と変わっていないようで、その徹底ぶりが Google の強みだと改めて感じました。

イグナイト ( ライトニングトーク )

最後のセッションは、おなじみ？Google スタッフによるダンス！合計30時間も練習したんだとか。みなさん、お上手でした。

Chrome の WebAudio と Node.js のデモはすごかったですね。基調講演でも WebAudio が紹介されていて、Javascript と HTML5 で音まで操作できるみたい。昔の MIDI を奏でるサイトをパワーアップできそうです。

初めにもらった、３Dメガネ。結局自分は使わなかったけど、どうやら Youtube が 3D に対応した動画があるようで、帰宅後我が家は大興奮でした。

緑と赤のあのメガネをお持ちの方は、是非御覧ください。

まとめ

世の中、Javascript と HTML5 の世界になるようです。この2つの技術は必修科目ですね。

そして、進化した Android と AppEngine でバックエンドとモバイル。

ソーシャル対応に Google+ 。ビジネス Apps では、Apps Script 。

なんだかんだで、覚えることはイッパイです。

 

最後に、スタッフやボランティアの皆様方、お疲れ様でした！

Google Apps Script ってすごいね

先日まで、Google Developer Day 2011 の DevQuiz がありました。

その中で Apps Script に関する問題が出題されていました。

個人的に気になっていたもので、ちょっとやってみることにしたのですが、ユーザガイドをみて驚きました。機能がすごく充実しています。

「オラ、わくわくすっぞ！」って感じです。

Google Apps Script ってなに？

Google Apps Script は、JavaScript を使用して Docs, Spreadsheets, Sites などから各種 Google サービスを制御することできます。
Microsoft Office における VBA のようなものです。

Apps Script では、作成した JavaScript のプログラムがサーバ上で実行される、という点が特徴ですね。

まだまだ日本語の情報が少ない Google Apps Script ですが、 Googleを追いかけろ！ が参考になります。

Google Apps Script って何が出来るの？

何が出来るのかは、これから見ていきましょうｗ。

Excel を Apps Spreadsheets に移行する際の障壁は、VBA マクロだと思っていましたが、それが取り除かれた。と思ってもいいくらいなことができそうな予感です。

Google Apps Script を使ってみる

何はともあれ、どんなものかやってみましょう。

お題

よくある Excel マクロのように、CSV ファイルを読み込んで、Spreadsheets に出力してみます。

1. スクリプトエディタ
   

   新規に作成した Spreadsheet から、ツールメニューの「スクリプトエディタ」でスクリプトエディタを起動します。

2. コードを記述
   

   コード欄に下記を打ち込みます。

   function onOpen() {
     var app = UiApp.createApplication().setTitle("Upload CSV to Sheet");
     var form = app.createFormPanel().setId('frm').setEncoding('multipart/form-data');
     var formContent = app.createVerticalPanel();
     form.add(formContent);
     var file = app.createFileUpload().setName('thefile');
     var button = app.createSubmitButton('Submit');
   
     formContent.add(file);
     formContent.add(button);
   
     app.add(form);
   
     var doc = SpreadsheetApp.getActive();
     doc.show(app);
   }
   
   function doPost(e) {
     var app = UiApp.getActiveApplication();
     var fileBlob = e.parameter.thefile;
   
     var data = fileBlob.getDataAsString();
     if (!data) {
   	return app.close();
     }
     var csvData = data.split('\n');
   
     var sheet = SpreadsheetApp.getActiveSheet();
     sheet.getRange(sheet.getLastRow()+1, 1).setValue(fileBlob.getName());
   
     var startRow = sheet.getLastRow()+1;
     var startColumn = 1;
     for (var i=0,l=csvData.length;i<l;i++) {
   	var csvRow = csvData[i].split(',');
   	for (var j=0,l2=csvRow.length;j<l2;j++) {
   	  sheet.getRange(startRow+i, startColumn+j).setValue(csvRow[j]);
   	}
     }
   
     return app.close();
   }
   		

3. Script の実行
   

   フロッピーアイコンでスクリプトを保存し、「関数を選択」より「onOpen」を選択します。

   再生ボタンでスクリプトを実行します。

4. CSV をアップロード
   

   表示されたフォームより、適当な CSV ファイルを選択して、Submit です。

5. CSV がシートに出力される
   

   CSV の内容がシートに書きだされました！

プログラムの説明を少しすると、[onOpen]という関数が、シートを開いたときに自動実行される関数です。VBA にもありますね。

ここで、アップロードフォームを作成し、表示させています。

もう一つの[doPost]という関数。これはフォームポスト時に呼び出されるもので、データの取得とシートへの書き出しを行っています。

doPost がポスト時に呼ばれるということに気付くまで結構はまりました…。

参考までに、アップロード時に使用した CSV と、Spreadsheet は下記から。参考にしてください。
*スクリプトの実行はできません

• GoogleAppsScriptPractice1.csv
• Google Apps Script Practice 1

Google Apps Script をやってみて

リファレンスとにらめっこが必要ですが、汎用的な JavaScript で記述できるので非常にわかりやすいですね。

これから少しずつ、どんなことができるのか確認しながら、紹介してきたいと思います。

Google AppEngine の新料金体系

とっても久しぶりのブログ更新です。皆さんお元気ですか？僕は元気です。

最近、AppEngine の料金体系変更によって、大幅に料金が増えるという話題をよく目にします。

気になって自分も確認してみました。
そして、多分にもれず驚いたのでメモしておきます。

AppEngine 新料金体系

AppEngine の新料金体系は、従来(現行)の CPU Time での課金から、Instance Hours での課金に変更されます。

料金の詳細は、 Google cloud services – App Engine に記載されています。

また、気になる、新料金体系ではどのように見積もられるのか？は、Admin Console の Billing History から確認することができます。

via Managing Your App's Resource Usage - Google App Engine - Google Code

今なら半額キャンペーン中！

上記のレポートの一例では、 Frontend Instance Housrs は、 $12.41 となっています。

為替レートが 1米ドル /円 = 77.089115 （ほんと円高ですね）ということなので、約956円/日。一ヶ月で 28,700円です。

でもよくみると、「Frontend Instance Hour costs reflect a 50% price reduction active until November 20th, 2011.」となっています。

11月20日までは半額キャンペーン中みたいです。

確かに Frontend Instance Hours: $0.04/Hour となっています。正規の料金は $0.08/Hour ですよね！

キャンペーンが終了したらどうなるのでしょうか？

単純に倍なので、約1,912円/日。一ヶ月で 57,400円です。

これ、みんな気づいているんでしょうか？僕は最初気がつかなかったです。

ダブルでビックリしますね。

新料金体系対策

今まで無料枠で気軽にアップしていたアプリが、突然金食い虫になったらたまりません。

App Engine アプリケーションのリソースを管理する方法 - Kay's daddy のリソースの管理方法が参考になります。

要は、ちゃんとリソース意識してアプリ作ってね、ということですが、

一番手軽な方法は、Admin Settings にある、 Max Idle Instances を 1 にする ということでしょうか。

近頃は、フリーミアムモデルからフリーの部分がなくなる、もしくは縮小される傾向が強いように思います。

手軽な環境がなくなっていくのは残念ですね。

Rails 3, MySQL, jQuery, Shoulda, FactoryGirl

Rails 3 で、MySQL, jQuery, Shoulda, FactoryGirl を使うときのプロジェクトメモ。

MySQL でプロジェクトを作成

デフォルトでは Sqlite3 を使用するので、オプションで MySQL を使用するように指定。

$ rails new appname -d mysql

jQuery, Shoulda, FactoryGirl の設定

jQuery, Shoulda, FactoryGirl を使用するために、各ファイルを編集する。

environment.rb

require 'openssl'
OpenSSL::SSL::VERIFY_PEER = OpenSSL::SSL::VERIFY_NONE

Gemfile

gem 'jquery-rails'
gem 'rails3-generators', :group => :development
group :test do
  gem 'shoulda'
  gem 'factory_girl_rails'
end

application.rb

config.generators do |g| 
  g.test_framework :shoulda, :fixture => true
  g.fallbacks[:shoulda] = :test_unit
  g.fixture_replacement :factory_girl, :dir => "test/factories"
end

インストール

$ bundle install

Shoulda / FactoryGirl が適用されているか確認。

$ rails g scaffold --help
...

Shoulda options:
  [--dir=DIR]                   # The directory where the model tests should go
                                # Default: test/unit
  [--fixture-replacement=NAME]  # Fixture replacement to be invoked
                                # Default: factory_girl

jQuery をインストール

generator で jQuery に置き換えます。

$ rails g jquery:install

Rails 3 で OpenSSL::SSL::SSLError

Rails 3 でプロジェクト作成後、まずは jquery を使うようにしようと思い

$ rails g jquery:install

すると、早速エラー発生。

    fetching  jQuery UJS adapter (github HEAD)
c:/ruby/lib/ruby/1.8/net/http.rb:586:in `connect': SSL_connect returned=1 errno=0 state=SSLv3 read server certificate B: certificate verify failed (OpenSSL::SSL::SSLError)

ソースを github から取得する際に、SSL 接続でエラーということか。

Rails3 で jQuery を使う を参考に、environment.rb に下記を追記。

require 'openssl'
OpenSSL::SSL::VERIFY_PEER = OpenSSL::SSL::VERIFY_NONE

無理やり SSL 非接続にしてなんとか回避。とりあえずは、よしとします。