1. Add-on SDKはじめの一歩
EnsekiTT

2. 今日やる部分
Firefoxを使う
Add-onを使う
Add-onを作る←ここ

3. でも、難しいんでしょう？

4. 簡単なことから始めよう

5. なにがいるの？
・パソコン
・Firefox
・Add-on SDK
- Python 2.x
Pythonはできなくても大丈夫！

6. パソコン
わりとなんでもいい
Windows, OS X, Linux...
強いと幸せになれる

7. Firefox
最新のFirefoxを用意しよう
Get Firefox!
http://www.mozilla.jp/firefox/

8. Python 2.x
http://www.python.org/download/
からダウンロード

9. Add-on SDK
https://addons.mozilla.org/ja/developers/builder
からダウンロード

10. インストール
Pythonのインストール：
http://www.python.jp/doc/release/using/
を参考に…
Windowsでは環境変数の設定が必要
マイ コンピュータ ‣ プロパティ ‣ 詳細設定 ‣ 環境変数
変数名: Path
変数値: “既存の変数” ;C:¥python2x

11. インストール
Add-on SDKのインストール：
zipファイルを解凍
こんなのが出てくる→

12. インストール完了！

13. ここからコマンドを使う
怖くないよ！
Windows: コマンドプロンプト
OS X: ターミナル
Linux: Shell
それぞれAdd-on SDKをインストールした
ディレクトリに移動しておく
[$|>] cd AddonSDK/

14. 実行する
Windows
> bin/activate.bat
OS X/Linux
$ source bin/activate
※この色で$の後はターミナル(OSX)、シェル(Linux)上で実行
※この色で>の後はコマンドプロンプト(Windows)上で実行

15. 実行されたことの確認
>"cfx"==version
$"cfx"==version
を実行する。
Add-on SDK 1.10-dev-76-g8c602be-dirty
(8c602be7ce2ae1a73eaa7f7534bb8e78e17c5bb0-dirty)
などと表示されたら、
横にあるジュースを飲みましょう。
※この色はコマンドプロンプト(ターミナル・シェル)が表示した文字列

16. Add-onの居場所をつくる
例えば(Windows)
> c:¥Add-ons¥MyFirstAddon¥
例えば(OS X・Linux)
$ ~/Add-ons/MyFirstAddon/

17. Add-onを作る
さっき作ったディレクトリの中で
> cfx init
$ cfx init
を実行

18. 何もしないAdd-on誕生の瞬間
＼やあ／

19. なんかしてみてよ…？
えっ…

20. これを編集して働き者の
Add-onにしましょう

21. これをmain.jsに書きこむ

22. > cfx run
$ cfx run

23. あれっ？もう一回
> cfx run
$ cfx run

24. 皆さんの記念すべき最初のAdd-onを讃えて
スクリーンショットを額縁に入れましょう

25. 情報源
https://dev.mozilla.jp/addon-sdk-docs/dev-guide/index.html
参考にAdd-onを更に働き者にしましょう

26. main.js コピペ用
////ここから////
const widgets = require("widget");
const tabs = require("tabs");
varwidget = widgets.Widget({
id: "mozilla-link",
label: "Mozilla website",
contentURL: "http://www.mozilla.org/favicon.ico",
onClick: function() {
tabs.open("http://www.mozilla.org/");
}
});
////ここまで////