１時間でツイッターサービスを作ろう！ はてなブックマーク - １時間でツイッターサービスを作ろう！

2010年07月23日

func09func09 / ,

はじめに

どうもKRAYの芳賀です。
今日はツイッターサービスをスピーディーかつ無料で作るお話です。

僕は日頃趣味でツイッターサービスを作っているのですが、アイデアを着想したその日のうちにプロトタイプを作って動かすことができるくらいにノウハウが溜まってきました。

仕事が終わってからのプライベートな時間だけでも、１週間から１か月もあれば１つサービスがリリースできる感覚がつかめたので、必要最低限の機能を備えたサービスを短時間で作れないだろうか？と時間を計測しつつ実践してみたところ、なんと１時間で完成できたので、その手順を紹介します。

開発の流れ

まずは開発の流れを説明します。

  1. ツイッターアカウントの用意
    まずツイッターのアカウントが必要になるので、まだ持っていなければ取得しましょう。サービス用に改めて取得してもいいですね。
  2. サーバの用意
    作成したウェブアプリを設置するサーバを準備します。PHPであれば一般的なレンタルサーバでも良いでしょうし、それ以外の言語ならサポートされているサーバを借りるなり作るなりしましょう。
  3. ツイッターサービスの登録
    ツイッターにサービス登録をします。登録しないとユーザーがツイッターのデータにアクセスできません。
  4. プログラミング
    言うまでもありませんが、あなたの素晴らしいアイデアをプログラミングします。
  5. 公開
    ローカルで開発を終えたプログラムをサーバに設置する作業です。

今回は、スピーディーかつ無料でいきたいので、生産性の高さに定評のあるRuby on Rails の現時点での最新バージョン2.3.8を使い、かつ無料で使えるRailsアプリのホスティングサービスHerokuに設置します。

どんなサービスを作るのか？

ツイッターのAPIを使えば、自分のタイムラインを取得したり、つぶやきを投稿したり、DMを送ったり、様々なことが可能です。ツイッターのソーシャル性やユーザーの特性を掴んだサービスを是非作りたいところです。

だがしかし、今回は、あの偉大なる「Hello World」をツイッターにつぶやく、というサービスを作るに止めます。１時間しかありませんので。。

プロジェクトの作成

コマンドラインで、Railsコマンドを使いサービス用のプロジェクトを作成します。

% rails twitter_helloworld
create
create app/controllers
create app/helpers
create app/models
create app/views/layouts
（中略...）
create log/server.log
create log/production.log
create log/development.log
create log/test.log

このように、Railsは基本的にソースコードのファイルをコマンドから生成するので、自分の手でチマチマ作るということがないこともあり、開発スピードは格段に速いです。

プロジェクトのディレクトリに移動して、Gitのリポジトリを初期化します。

% cd twitter_helloworld
% git init

バージョン管理したくないファイルを無視ファイルに定義します。.gitignoreというファイルを以下の内容でプロジェクトのルートディレクトリに作成します。

.DS_Store
log/*.log
tmp/**/*
db/*.sqlite3
db/schema.rb

Herokuに登録

Heroku（http://heroku.com/）は、無料で利用できるRubyのホスティングサービスです。

Ruby版PaaSの”Heroku”で無料Railsホスティング環境を手に入れよう
http://kuranuki.sonicgarden.jp/2009/05/rubypaasherokurails.html

こちらの記事を参考に、

  • herokuの会員登録
  • herokuコマンドのインストール

が終わっている前提で話しを進めます。

Herokuにプロジェクトを登録します。
Herokuはコマンドラインからheroku create コマンドで、プロジェクトを登録できます。

% heroku create twitter-helloworld

twitter-helloworldは適宜変更してください。すでに利用されているプロジェクト名は使えません。

成功すれば、http://twitter-helloworld.heroku.com/ にアクセスすると

のような画面になっているはずです。

ツイッターアプリ登録

さて、偉大なHelloWorldサービスをツイッターに登録しましょう。

http://dev.twitter.com/apps/new

ポイントになるのは・・

* アプリケーションの種類：ブラウザアプリケーション
* コールバックURL：http://twitter-helloworld.heroku.com/oauth_callback
* Default Access type：Read & Write

とすることです。

コールバックURLは、自分のサービスURLに「/oauth_callback」を追加したものを設定してください。

登録が済んだら、「Consumer key」と「Consumer secret」をメモっておきます。

開発

いよいよRailsによる開発です。

ツイッター認証

twitter-auth（http://github.com/mbleigh/twitter-auth）というプラグインをインストールします。
このプラグインはツイッターOAuth認証に関する煩瑣な作業を一手に引き受けてくれるので、インストールさえしてしまえば、ほとんど何もしなくてもツイッター認証を使ってログインできるようになります。

１時間で完成できるのは、このプラグインのおかげといっても過言ではありません。

% script/plugin install git://github.com/mbleigh/twitter-auth.git
% script/generate twitter_auth
create db/migrate
create db/migrate/20100721111347_twitter_auth_migration.rb
create app/models/user.rb
create config/twitter_auth.yml

次に設定ファイルの書き換え、config/twitter_auth.yml というファイルを書き換えます。
consumer_keyとconsumer_secretを先ほどツイッターのアプリ登録で入手したものにしておいてください。

偉大なるHelloWorldボタンの実装

ボタンを押すと「偉大なるHelloWorld」というつぶやきができる機能を実装してみます。

「script/generate controller」というコマンドは、ウェブアプリケーションのコントローラーとビューのコードを生成します。

% script/generate controller messages index
      exists  app/controllers/
      exists  app/helpers/
      create  app/views/messages
      create  test/functional/
      create  test/unit/helpers/
      create  app/controllers/messages_controller.rb
      create  test/functional/messages_controller_test.rb
      create  app/helpers/messages_helper.rb
      create  test/unit/helpers/messages_helper_test.rb
      create  app/views/messages/index.html.erb

作成したコントローラーとURLのパスをルーティング設定で紐付けします。config/routes.rbを編集してください。

ActionController::Routing::Routes.draw do |map|
  # ここから追加
  map.resources :messages,:only => [:index, :create]
  map.root :controller => 'messages', :action => 'index'
  # ここまで追加
end

このアプリケーションに設定されたURLパスを確認してみます。

% rake routes
(in /Users/XXXXXX/Desktop/twitter_helloworld)
         login        /login                  {:action=>"new", :controller=>"sessions"}
        logout        /logout                 {:action=>"destroy", :controller=>"sessions"}
   new_session GET    /session/new(.:format)  {:action=>"new", :controller=>"sessions"}
  edit_session GET    /session/edit(.:format) {:action=>"edit", :controller=>"sessions"}
       session GET    /session(.:format)      {:action=>"show", :controller=>"sessions"}
               PUT    /session(.:format)      {:action=>"update", :controller=>"sessions"}
               DELETE /session(.:format)      {:action=>"destroy", :controller=>"sessions"}
               POST   /session(.:format)      {:action=>"create", :controller=>"sessions"}
oauth_callback        /oauth_callback         {:action=>"oauth_callback", :controller=>"sessions"}
      messages GET    /messages(.:format)     {:action=>"index", :controller=>"messages"}
               POST   /messages(.:format)     {:action=>"create", :controller=>"messages"}
          root        /                       {:action=>"index", :controller=>"messages"}

「/」にアクセスすると、messagesコントローラーのindexアクションにディスパッチされるようになりました。

加えて、「/login」や「/logout」というパスが存在していますね。これらはtwitter-authプラグインが自動生成してくれているパスで、「/login」にアクセスするだけで、ツイッターのOAuth認証を実行できるようになっています。便利ですね。

続いて、コントローラーの処理を実装します。
app/controllers/messages_controller.rbを以下のように編集しましょう。

class MessagesController < ApplicationController
  def index
  end
  # ここから追加
  def create
    if current_user.twitter.post('statuses/update.json', :status => "偉大なるHelloWorld")
      flash[:success] = "おめでとう！偉大なるHelloWorldは成功した。"
      redirect_to root_path
    else
      flash[:error] = "残念だが、偉大なるHelloWorldは失敗に終わった。"
      render :action => 'index'
    end
  end
  # ここまで追加
end

ビュー（app/views/messages/index.html.erb）の編集。ログインしていればツイートするためのフォームボタンを。していなければログインリンクを表示します。

<% if logged_in? %>
  <% form_tag %>
    <%= submit_tag '偉大なるHelloWorldをツイートをする' %>
  <% end %>
<% else %>
  <%= link_to 'ログインする', login_path %>
<% end%>

全体のレイアウトファイル（app/views/layouts/application.html.erb）を作成します。

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <title>偉大なるツイッターアプリ</title>
  </head>
  <body>
    <%- flash.each do |name, msg| -%>
      <div class='flash_<%= name %>'>
        <%= msg %>
      </div>
    <%- end -%>
    <div>
      <%= yield %>
    </div>
  </body>
</html>

公開

プログラムが完成したので、Herokuで公開してみます。

.gemsファイルの用意

Herokuではプロジェクトルートに「.gems」というファイルを配置して、プロジェクト内で使うGemを管理することができます。
以下の内容で「.gems」ファイルを作成してください。

oauth
ezcrypto
json

つづいてデプロイ作業です。
最新の変更をリポジトリにコミットしたあと、Herokuのリポジトリへプッシュすることでデプロイが完了します。
最後にデータベースをマイグレートすれば完成です。

% git add .
% git ci -m 'finish!'
% git push heroku master
% heroku rake db:migrate

おつかれさまでした！

おわりに

いかがでしたでしょうか？

かなり駆け足になってしまいましたが、結構簡単にツイッターAPIを使ったWebサービスが作れてしまいました。

最後に私事で恐縮ですが、自分で作ったツイッターサービスとアバウトな制作期間を紹介させていただきます。

ネタ一発系のサービスであれば、１週間とかからずにリリースできるものなので、みなさんじゃんじゃん作りましょう！

このエントリーに対するコメント

コメントはまだありません。

トラックバック

we use!!Ruby on RailsAmazon Web Services

このページの先頭へ