Webgl入門者の会（2016/5/12）





WebGLのオススメ

開発環境


自己紹介


Twitter：@naotaro0123


　　　　　・Live2DというCGソフト会社のプログラマー
　　　　　・WebGL歴は2年ぐらい

　　　　　・Live2D WebGL SDKなら何でも聞いて下さい




みなさん、

Webgl開発する際に

どんなエディタ使ってます？


オススメのエディタあります？
（あったら教えて下さい）

自分が欲しいWebgl開発環境



　・ローカルでWebサーバーが起動する
　　→　画像ファイル参照時のローカルセキュリティポリシー用


　・コードが書きやすい
　　→　WebGL API、GLSLのコード補完や構文チェックしてくれる
　　→　変数定義に飛んだり戻ったりできる


　・デバッグがしやすい
　　→　console.logとかでなくブレークポイント実行できる

自分のエディタ歴史１


Bracket（Adobe製のエディタ）
　＜メリット＞
　　・ライブプレビュー機能がある
　　・jsのコード補完もある程度してくれる

　＜デメリット＞
　　・変数定義に飛ぶショートカットが覚えづらい（cmd + j）
　　　→　定義先から戻れない...orz
　　・ライブプレビュー中に開発者ツールを起動すると、ライブプレビューが切れる
　　・ブレークポイントデバッグができない！？

自分のエディタ歴史２


　＜メリット＞
　　・便利なプラグインが豊富！
　　　有志の方がWebGLプラグインを作ってくれてる
 　　　　→　WebGLCompletions（これでWebGLのコード補完OK）

 　　　　→　SublimeServerでWebサーバーも起動する

　　　　→　GLSLのハイライトしてくれる（コード補完はなし）
　＜デメリット＞
　　・いい感じに変数定義に飛べない？１行ずつデバッグできない？
　　（僕がやり方を知らないだけだったらすいません）

自分のエディタ歴史3


NetBeans

　＜メリット＞
　　・変数定義にいい感じに飛べて元に戻れる
　　・１行ずつデバッグができる（console.logやdebuggerいらない）
　　・標準機能でいい感じ（プラグイン入れなくてよい）
　　・ライブビュー中に開発者ツール起動してもライブビューが切れない
　
　＜デメリット＞
　　・WebGLのコード補完が効かない

　　・GLSLのハイライトがされない（プラグインもない）

自分のエディタ歴史4


WebStorm
　＜メリット＞
　　・NetBeansにあった機能は全てありそう（雰囲気)
　　・WebGLにチェック入れるとWebGLコード補完も効く
　　　（定義に飛ぶとWebGLコードも見れる）
　　・GLSL Supportプラグイン入れるとハイライトと構文チェックしてくれる
　　　（コード補完はない）
　
　＜デメリット＞

　　・有料（年間￥1６，９００、２年目以降は安くなる）







ご静聴ありがとう

ございました！

Made with Slides.com