bakalog

備忘録的なもの

Learn JS in kanazawa - Kakenai.js ver.1.0に参加してきました。

ブログを書くまでが勉強会!

ようやく勉強会が終わりそうです。(違
少しバタバタしていたのでアップが遅れましたが、
6/6にLearn JS in kanazawa 「Kakenai.js ver1.0」に参加(運営?)してきたので、
レポートとはとても言えないメモみたいなものを。

learnjskanazawa.connpass.com


発表者及びスライド

"今" 使えるJavaScriptのトレンド
水野 隼登さん( @pocotan001 ) - 株式会社サイバーエージェント Webディベロッパ

www.slideshare.net


kakanai GUIツール Blocs

開幕早々、JavaScriptを使わずにGUIでJavsScriptを使った表現を選択して、
サイトを作成できるMacApp : Blocsを紹介。 ケースによっては選択肢に入れるのもアリ。 blocsapp.com


開発環境について

黒い画面とはいい加減、友達にならないとこの先生きのこれない。

内容としては昨今の傾向としてフロントエンドの制作において、
ほぼnode.js+npmを使ったパッケージ管理がほぼ必須。
最近だとjQuery公式サイトの方でもプラグインの配布は行っておらずReadOnlyとなっていて、
サイトへ登録するのではなくnpmに移行することを推奨しているとの事。
bowerというパッケージ管理ツールもあるが、
npm( node package manager)を利用する事を推奨している。

speakerdeck.com plugins.jquery.com


module管理する憎いやつ Browserify (ブラウジファイ)
  • ブラウザでNode.js用のモジュールを使用可能にする
  • ブラウザでrequire()を使ったモジュール管理を行える
    らしい。もう少し範囲が広い仲間にwebpackがいる。

yutapon.hatenablog.com


スクランナー [Grunt] [Gulp]

Gruntは豚の鳴き声、Gulpはジュースを飲む音らしい
Gruntはメンテナーが行方不明の為、これから使う場合はGulpを推奨。
gulp-starterというテンプレートを使うと便利 らしい
github.com

一応「npm run ( w / package.json )」でタスクランナー的な使い方ができる。


altJS
  • CoffeeScript
  • Babel ( ES6 → ES5なAltJS )
  • TypeScript (後述)

構文チェッカー

ESLint


MVなんたらのお話

MV使わないと不幸になるよって例。
backbone.jsの機能が多すぎる為、
複数のUIから同じデータを変更する際に、 ModelとViewとに分けて考えると良い
そしてModelとViewとライブラリ「Osteoporosis.js(骨粗鬆症.js)」の紹介。

www.slideshare.net

Polymer

polymer 1.0 要素をコンポーネントとして分離して組み合わせて作るWebConponents
膨大になりがちなjsやcss等をカプセル化する事ができるのはかなりメリットな気がする。
以下の要素で構成。

  • Custom Elements
  • HTML Imports
  • Template
  • Shadow DOM

カスタムエレメントカタログもあるらしい。
customelements.io

所感

全体的に、jQueryに依存したものがどんどん減ってきている現状がある。 その上でいつそれを捨てるかという判断も必要になってきそう。


「俺とAngular2」
Angular2とは何か。採用されたTypeScriptとは何か。
TypeScriptとはMSのOSS!それをWindowsの環境で開発してみよう!
加藤 真透さん ( @PharaohKJ) - PhalanXware代表

俺とAngular2 : スライド qiita.com

Angular2とTypeScriptについて

Angular1.x と Angular 2.xの違い

設計思想が違うみたいで、Angular2では双方向データバインディングが廃止されている模様。
よって、Angular2.xはまだおすすめできない。

Angular1.xはAngular.js Hubから触る事ができる。

TypeScript
  • 静的型付けとオブジェクト指向の導入が特徴
  • Interface / Class が利用可能
  • TypeScriptはJavaScriptのスーパーセット。ES6の機能を取り込んで、型システムを取り入れた言語

TypeScriptはType Script Playから触る事ができる。


所感

先に触りそうな所で、Angular1.x。
TypeScriptはaltJSという立ち位置だけど、
ひとまずは、CoffeeScriptを触ってみて都度必要に応じて
TypeScriptを突っつくのもアリかなという感じでした。


全体まとめ

名前だけ聞いたことがある…ってものがいくつか話の中で出てきたので、

  • 具体的にどういう用途で使われるものなのか。
  • どういった経緯でそれが使われているのか。

という所が知れる良い機会だった。

御二方にお聞きした内容を参考にしながら、
触れる所から触っていこうと思った次第でした。

実際に手を動かして覚えるもくもく会形式の
「kakitai.js」というセミナーが7月に予定されているのですが、
加藤さんによる「Angular.js」のハンズオンセミナーがあるとの事で、
そちらにも参加していきたいと思います:-D

f:id:kgr0210:20150616033245j:plain