2011年11月13日日曜日

CoffeeScriptを学ぶ

CoffeeScriptはJvaScriptに変換するための言語で、
Pythonのような文法を持っているのが特徴のようです。

このCoffeeScriptを学ぼうと思い、いくつかのサンプルを書いてみました。
まず基本、FizzBuzzです。
(下記はalertで書いたので実行すると大変なことになるから気をつけてね)
for a in [1..100]
  if a%15 == 0
    alert "FizzBuzz"
  else if a%3 == 0
    alert "Fizz"
  else if a%5 == 0
    alert "Buzz"
  else
    alert a
特徴としては、Pythonのようにインデントがブロックを表しています。
インデントでブロックにすると、やっぱり見やすいですよね。
また、メソッドも()がつかないです。

これをJavaScriptに変換すると、以下のようになります。
var a;

for (a = 1; a <= 100; a++) {
  if (a % 15 === 0) {
    alert("fizzbuzz");
  } else if (a % 3 === 0) {
    alert("fizz");
  } else if (a % 5 === 0) {
    alert("buzz");
  } else {
    alert(a);
  }
}
今度はクイックソートを実装してみます。 関数は
関数名 -> (引数)
   (関数本体)
のです。 CoffeeScriptはwhile文が使えます  
sort = (array, l, r) ->
  mid = ~~(l+r/2)
  return if l >= r
  i = l
  j = r
  pivot = array[mid]
  while true
    while array[i] < pivot
      i++
    while array[j] > pivot
      j--
    break if i >= j
    t = array[i]
    array[i] = array[j]
    array[j] = t
  sort array, l, i-1 if l < i-1
  sort array, j+1, r if j+1 < r

a = [1, 4, 3, 7, 6, 5, 2, 8]
sort a, 0, 7
alert a
下記はJavaScriptに変換したときのコードです。
var a, sort;

sort = function(array, l, r) {
  var i, j, mid, pivot, t;
  mid = ~~(l + r / 2);
  if (l >= r) return;
  i = l;
  j = r;
  pivot = array[mid];
  while (true) {
    while (array[i] < pivot) {
      i++;
    }
    while (array[j] > pivot) {
      j--;
    }
    if (i >= j) break;
    t = array[i];
    array[i] = array[j];
    array[j] = t;
  }
  if (l < i - 1) sort(array, l, i - 1);
  if (j + 1 < r) return sort(array, j + 1, r);
};

a = [1, 4, 3, 7, 6, 5, 2, 8];
sort(a, 0, 7);
alert(a);

2011年11月1日火曜日

第22回HTML5とか勉強会で発表してきました

第22回HTML5とか勉強会で発表してきました。

今回は初心者向けということで、
SVGってどんなことができるの?っていることを理解してもらおうと思い、
とにかく仕様の紹介をしようと思いました。
ちょっと、意図が伝えられなくて、一部の方からは難しかったというご意見をいただきました。
次回同じような機会があれば、その反省をふまえてもっとよい発表を行えればと思っています。

以下が発表に使用したスライドです。


動画も公開されているみたいです。



このような機会を与えていただいた白石さんをはじめHTML5とか勉強会のスタッフの皆様には
本当に感謝をしています。
ありがとうございました!

2011年8月15日月曜日

OAuthの仕組みについてのメモ

ちょっと前に
twitterのOAuth認証についてのエントリを書きましたが、
ちょっとOAuthについて自分の頭の中が整理できていなかったので、
ちょっと整理します。

OAuthってそのそも、

  • アプリケーションがとあるサービスのAPIを使うための、ユーザに認証してもらうための仕組み

  • アプリケーションはとあるサービスのユーザ名やパスワードをユーザから教えてもらう必要がない


  • です。

    で、
    API提供しているとあるサービスとあるサービス => Service Provider
    アプリケーション => Consumer
    
    とそれぞれ呼びます。

    Consumer(アプリケーション)はService Provider(API提供しているとあるサービス)にConsumerの登録を行います。
    登録すると、Consumer KeyとConsumer Secretが発行されます。Consumer Key/Secretはそのアプリケーションを示すトークンです。このConsumer(アプリケーション)はConsumer Key/Secretを使って、Service Providerにリクエストトークンを発行してもらいます。

    リクエストトークンを発行してもらったら、ConsumerはそのリクエストトークンをパラメータとしたURLを使って、Service Provicerのサイトにリダイレクトを行います。

    ユーザーはリダイレクトされたサイト上にて、ConsumerがService ProviderのAPIを使って情報を取得するのを許可します。

    許可したら、Service Providerはあらかじめ登録されたURLへリダイレクトするので、
    Consumerはそこから、アクセストークンをService Providerに要求し、Service ProviderはアクセストークンをConsumerに送信します。

    このアクセストークンがあれば、ConsumerがService ProviderのAPIを使うことができるようになります。

    ざっと書くとこんな感じでしょうか?

    2011年8月7日日曜日

    第1回Androidテスト祭り に行ってきました。

    第1回Androidテスト祭り に行ってきました。
    行ってきましたと言っても、途中から実行委員にまぜてもらったので、
    スタッフとして参加させていただきました。

    ATNDの参加希望者が定員の倍以上になってしまい、
    Androidでの品質の確保については、たくさんの人が関心を持っているのだと思います。
    (困っている人が多いってことですね><) 今回の発表は非常にレベルが高く、 参加していただいた方々の満足度も高かったのではないかと思います。 個人的には、尾上さんの「テスト可能なUI設計パターン」 が勉強になりました。 ちなみに、僭越ながら私も懇親会でLTをしてきました。 スライドは下記になります。
    講演者の皆様、ご来場していただいた皆様、Ustreamを視聴していただいた皆様、本当にありがとうございました。

    2011年8月4日木曜日

    Jenkinsのインストールのメモ

    Jenkinsのインストールのメモ。あくまでもメモです。

    自宅のサーバーがDebianなので、それを使って。

    まず最初にコマンドラインで、
    wget -q -O - http://pkg.jenkins-ci.org/debian/jenkins-ci.org.key | apt-key add -
    
    をしたあと、
    /etc/apt/sources.listの末尾に
    deb http://pkg.jenkins-ci.org/debian binary/
    
    を追加します。

    その後
    apt-get update
    apt-get install jenkins
    
    をして、インストールします。

    設定に関しては、
    /etc/default/jenkins
    をいじった後、
    /etc/init.d/jenkins restart
    
    をします。

    /etc/default/jenkins
    は、たとえばポートを変えたい時は、HTTP_PORTを帰ればいいです。
    私は、URLに /jenkins を加えたかったので、
    JENKINS_ARGS に --prerix=/jenkins を加えました。

    詳しくは、ここを見るといいかもしれません。

    URLにアクセスすると
    (例えば、http://localhost:8080/jenkins)

    が出てくるはずです。
    デイリービルド等ジョブを作成したい時は、「新規ジョブ作成」を選んでください。

    のページに遷移しますので、
    適当なジョブ名を入力して、基本的にフリースタイル・プロジェクトのビルドを使います。

    あとは、下記の画面が出てくるので、適当に入力していってください。

    2011年7月20日水曜日

    HTML5のpushState

    HTML5には、
    HistoryオブジェクトにpushState()とreplaceState()というメソッドが追加されました。

    pushStateというのは、
    Historyのリストに新しくエントリを追加してしまいます。
    ページ遷移をしていなにのに、Hisotryが追加されるのです。

    下記にコードを示します。
    <html>
    <head>
    <script>
    function push_history() {
      history.pushState("", "", "/example");
    }
    </script>
    </head>
    <body>
    Hello, World!
    <form>
    <input type="button" value="button" onclick="push_history()" />
    </body>
    </html>
    

    これにより、
    現在のページが "http://foo.com/hello/index.html " だった場合、
    ボタンをクリックするとURLが第3引数により、"http://foo.com/example" に変化しており、
    戻るのリストをみると、1個Historyが追加されているのがわかります。
    実際に戻るをクリックすると、URLバーが
    "http://foo.com/hello/index.html "
    に戻ります。

    これで、ページを遷移していないのに、
    Historyにエントリを追加して、URLを変更することができます。

    Ajaxとこれを組み合わせた技術を "Pjax" と呼びますが、
    これは別途まとめようと思います。

    twitterのOAuth認証

    OAuthっていうのは、
    APIを使用する認証を行うための仕様のことで、
    パスワードを第3者に教えることなく、トークンのやり取りだけで認証が行えるしくみのことです。

    OAuthってなんなのかは、
    ゼロから学ぶOAuthが参考になるとおもいます。

    で、実際にtwitterでOAuth認証をおこなって、
    つぶやくためのスクリプトを書きました。

    まず、
    http://dev.twitter.com/apps/
    でアプリケーション登録を行います。
    (登録には、twitterアカウントが必要です。)
    で。Consumer Keyと Consumer Scretを取得します。

    で、rubyのOAuthライブラリを使って、
    下記のコードを書きました。

    #!/usr/bin/ruby
    require 'rubygems'
    require 'oauth'
    
    consumer = OAuth::Consumer.new(
      "Consumer Key",
      "Consumer Secret",
      :site => "http://twitter.com"
    )
    token = consumer.get_request_token
    puts token.authorize_url #リダイレクト先のURL
    pin = gets.chop
    access_token = token.get_access_token(:oauth_verifier => pin)
    puts access_token.token #アクセストークン のtoken
    puts access_token.secret # アクセストークンの secret
    

    token.authorize_url のURLをブラウザに貼付けてページ遷移すると、
    リダイレクト先にpinコードが書いてあるので、
    それをコピーして入力します。

    そうすると、Accessトークンを取得することができます。

    CosumerトークンとAccessトークン
    あとは、twitterライブラリあたりで、
    twitter APIを叩けばOKです。
    以下は、ただ、"Hello, World" をつぶやくスクリプトです。

    #!/usr/bin/ruby
    require 'rubygems'
    require 'twitter'
    require 'twitter/console'
    
    Twitter::Client.configure do |conf|
      conf.oauth_consumer_token = "Consumer Key",
      conf.oauth_consumer_secret =   "Consumer Secret",
    end
    
    twitter_client = Twitter::Client.new(:oauth_access => {
      :key => "Access Token Key",
      :secret => "Access Token Secret"
    })
    
    twitter_client.status(:post, "Hello, World");