ギークなお姉さんは好きですか

恋焦がれる理想の男性・ギークに近づくため、プログラミングがわかるお姉さんを目指すブログ

みんな大好き!ソーシャルアプリの作り方をコンパイルするよ

マイコミさんの回し者みたいなことになってるべにぢょだ(・∀・)
2010年はソーシャルアプリが来るぜ!熱いぜ!というソーシャルバブルが楽しそうなので、
私もハローワールドしてみる。
”コンパイルする”というのは、プログラマの言葉を非プログラマに分かるように翻訳するって意味だよ!
そして私は、あなたにコンパイルされたい。

OpenSocialに関する記事はたくさんあるけど、個人的には八角研究所さんの「5分で学ぶGoogle0ガジェット開発」がとても分かりやすかった。5分で7ページは無理ダケドナー!
ガジェットで「Hello,World!」出すのはたぶんPHPより簡単。環境いらない。Googleがあればおk。
私にもできたから、ぜったい大丈夫だよ!びびることないって、ホントホント!マジヨユー!!

八角さんの2分目にあるように、構成はXML形式。

Module ・・・ルート要素
ModulePrefs ・・・ガジェットのメタデータを記述
Require ・・・ガジェットが必要とするライブラリ
Locale, MayRequireなどその他のタグ
UserPrefs ・・・ガジェットが必要とするユーザ設定
Content ・・・HTML/JavaScriptなどでガジェットの内容を記述する


はい先生!ルート要素ってなんですか!?
ググると大概、やけにまどろっこしくて孫の手が欲しくなるような言葉で説明してあるけど、
多少の誤解を許容してシンプルに言うと、htmlでいうbodyタグ的位置付けと解釈している。
や、どちらかというとbodyを内包したheadか?まぁとにかくそのへん!!
XMLは前もちょっとやったから、通知表で言うと2の上くらいの知識はある(`・ω・´)
TwitterにRSSフィードを自動投稿してくれるアカウント作った!

XMLマトリョーシカみたいな構造になっていて、1番外側の <?xml〜?> から順に開けていくと、
<![CDATA[ 〜 ]]> ていう箱に1番大事な中身が入ってる。のだ!

<?xml version="1.0" encoding="UTF-8"?> 
 // これはXMLファイルですよ
<Module> 
 //絶対必要なルート要素。<html>(ここでは↑のxml)<body>のイメージ!
<ModulePrefs title="ハローワールドを出すテスト" />  // <title>タグとほぼ同意
<Content type="html">  // 以下の内容はhtmlで書きます!という宣言
<![CDATA[ // htmlなら本来はここからがbodyに当たる。ブラウザに表示する中身を記述する部分
Hello,World! // ここがブラウザに表示されます!!!!!!!!
]]> // 表示部分終わり
</Content> // htmlで書いた中身終わり
</Module>
 // このファイルは本当にここで終わり

Hello,Worldを出すのみならこれだけでイケる。
もしOpenSocialを使う場合は、<ModulePrefs title="ハローワールドを出すテスト" /> の下に
<Require feature="opensocial-0.8" />
の1行を入れる。
って、説明するより実際のソース見たほうがなんとなくイメージつかめると思う!
Googleガジェットギャラリー

ここで適当なガジェットを選んで右下の「ソースの表示>>」ていうリンクをクリックするとソースが見れる。
たとえば、みんな大好き「はてなブックマーク」はこんな感じ。
はてなブックマークのソース表示

ね!ね!こっちのほうが早いね!!
今なんとなくしか分からなくても、いつかナルホディウス!と納得することでしょう。
プログラミングはそれでいいのだ。たたたぶんね><

そうそう。ソースを上げるサーバは、自分で用意しなくても大丈夫なんだよ。
八角さんとこに書いてあったみたいにGoogle Gadget Editorを使ってもいいし、dropboxでもいい。
私は最初、この記事見てdropboxで試した。
DropBox を OpenSocialアプリ開発に利用する - jmblog.jp


はっ。そういえば!今年もよろしくお願いします♪