- 2018/1/24
- https://wajs.connpass.com/event/76238/
webpackと仲良くなろう
- @mki_skt(yahooのフロントエンドエンジニア)
- https://speakerdeck.com/mukai21/webpacktozhong-liang-kunarou
webpackで開発効率上げる
- webpack-dashboard
- コンソールが見やすくなる
- jarvis
ビルドをはやくする
- いろんなプラグインが用意されてる
- https://webpack.js.org/plugins/
JavaScriptのE2Eフレームワークを触ってみる
- @riririusei99(チームスピリット)
- https://speakerdeck.com/riririusei99/javascriptfalsee2ehuremuwakuwohong-tutemiru
Protractor
- andular向けにつくられた
- 裏はselenium
TestCafe
- async/awaitを使いたい人向け
- selenium使わない
- 設定ファイルなし
Nightmare
- selenium使わない
- electronベース
- 軽い
Cypress
- 導入簡単
- CLIで動く
- レポーティングかっこいい
- 修正検知で動く
- 今はchromeのみ
- https://www.cypress.io/
cinnamonjs
どれを選ぶか?
- クロスブラウザ?
- CI?
- 導入しやすさ?
- レポーティング?
- 証跡?
CSS書きたくない問題を解決するAngular Material
- @h_reader
CSS自分で書きたくないよね
- material design
- htmlにmaterial用のタグを書くことで使う
なにかしらのhyperappの話
hyperappのコードリーディングした話
- 超軽量
- React的なやつ
- qiitaが採用
- JorgeBucaranさんが作ったやつ
- https://github.com/hyperapp/hyperapp
- https://aloerina01.github.io/javascript/hyperapp/2017/03/17/1.html
モダンなJavaScriptアプリケーションでモダンにスタイリングする方法
- @sottar(メルカリ)
- https://speakerdeck.com/sottar/modannajavascriptapurikesiyondemodannisutairingusurufang-fa
ReactでCSSどう書くか
CSS in JS
- styled-componentsを採用
- Reactと相性がいい
- 開発が活発
- コンポーネント指向にあってる
- ReactNativeにも対応している
- stylelint
コンポーネント
- ducsパターン
- reduxパターン
- 各コンポーネントは配置に関するスタイリングはしない
ASTについて
What is AST
- JSをパースした結果生成されるツリー構造の構文
- JS実行までにはいろんなフェーズがある
- 最適化もしている
- それらをやりやすくするためにツリー構造にしてる
- https://astexplorer.net/#/gist/0429a13a4398a783ada0840563345efd/b52db0998a5eb6a471839e426e40bda0fec61f53
- 最近のJSだと複雑になっている
- アロー関数とか書き方多すぎ
- カッコがなかったり
- それをパースするのが大変
ASTをどう使うのか
- ASTからScopeを作ったり
- bytecodeを生成したり
- babel
- ASTを変換してJSを生成する
生のJSでTodoList作ろうとして苦労した話
- @yuri_xxx8
VJ with JavaScript
- @takanorip
- Takanori Okiさん(SmartDrive)
- https://speakerdeck.com/takanorip/vj-with-javascript-1
VJとは
- video jockey
- visual jockey
型の話
- @chikoski
JSの特徴
- 何でもできちゃう
- いろんなものが足し算できてエラーがでないとか
- だからテスト流行ってる
- JSで書いたテストも信用できなくなってくる
- そこで型
JSの型
- 型7種類
- 型はtypeof演算子で調べる
- class作ってもそれの型はobject
- instanceofを使えばなんのインスタンスか分かる
- でも似てるclass複数に対応したいとかで困る
- extendsを利用するパターン
- instanceofを書き換えることができる
- いろいろ頑張っても型を全部チェックするのは無理
- TSなら全部やってくれる
TS
- 型を柔軟に扱いたい時にめんどくさい
- でも他のよりはいろんなことできる
- 一度書いたらなかなかアップデートできないものはテストより型で担保
