坂本酒店のチラシの裏

坂本酒店のチラシの裏

We Are JavaScripters 17th 議事メモ

regular

開催概要

†名称・日時・会場
  • 名　称：We Are JavaScripters 17th
  • 日　時：2018/03/30(Fri) 19:30 - 21:30
  • 会　場：六本木ヒルズ森タワー18F メルカリ
  • タ　グ：WeJS
†要旨
  1. JavaScriptはフロントもバックエンドもできる
  2. Reactが流行っている。vueもぼちぼちきている。流動性がある。
  3. ただ作るだけでなく、セキュリティやUXなどの考慮も必要になる
†TODO
  1. PWAについて触れておきたい

概略

初心者も歓迎しているJSer向けの勉強会。毎回倍率は高め。全員登壇を目指しているよ！結構多岐にわたるジャンルの話が聞けた。次は4/24。新入生向けの情報も公開されるよ

所感

  • マサカリってなんだ？寿司はうまい！

  • 深い話の理解のための勉強は必要か

  • PWAの話はまだきていない。とりあえずnuxt触っておくか。

  • firebaseとかはもはや常識?

メモ

  1. メルカリによるLT(@小嶋)
    →メルカリ。従業員数600人。2013年創立。merpayとかいう決済系のサービスもやってるよ！Webからもできるよ。出品の数だけ。100万ページできてるよね。AMPとかPWAやってるよ。新しいことに挑戦する風土。iOS Appでも出てるよね。

  2. チームをCQRS(@ヤマモト)
    →persolのフロントエンドエンジニア。CQRS = コマンドクエリ責務分離。コマンドの更新処理とクエリの参照処理、分けるといいよね。Reduxなんかはそんな感じのフレームワークだよね。フロントとバックエンドの役割どうにかしない?CQRSと同じ感じにしよう。nuxt.js/cloud firestore, cloud functions for firebase, firebase Hosting, AWS AppSync便利だよね。

  3. フロント未経験者のReactプロダクト改善(@shikichee)
    →Ubieで働いている。病院の問診をAIでやるサービスをReduxでやってる。使えない患者や技術負債が課題に。高齢者だと使えない人がいるよね。ヘッダをタッチしてしまう。メタタグ追加してフルスクーンで。コピペのポップアップが出る→CSSで無効化。ESLintとprettierを導入。css-modulesを導入。PWA対応も視野に入れたい。Webでネイティブアプリっぽい動きをさせるのは大変だなぁ。Front-end Developer Handbook2018は参照した

  4. new version of context in React 16.3
    →React v16.3 released!! will系が非推奨に。DevToolの更新とか。Context APIが新しくなったよ。roviderとConsumerのcontextがあるよ。テーマの設定ができるよ。階層が深くなる。バケツリレーやらなくていいんだなぁ。

  5. What is necessary for Developer(@桑原)
    →JS, Node.js。RIOT,ionic,MDN web docsなどにも参加。コードはないよ。車のECサイト。検索条件が芳しくないサイト。eventのバッティングとか。どう考えてもユーザフレンドリじゃないよね。まずは情報設計をやる。いらないものは消して行く。タグで分けたりDOMの意味づけをしっかりしていこうな

  6. forkwellからのLT(@インターン生)
    →エンジニアのキャリアアップ。市場の評価はあるけど社内の評価が悪い。あるいはその逆。市場評価の確かめ方って？勉強会とか懇親会→スカウト。5分で2000円。

  7. Vuetifyで学んだあれこれ(@tomoko523/@10tomokO)
    →Vuejsとは。VueJSのComponent。シンプルでわかりやすい。サポートライブラリが充実。⑴リアクティブシステム。ディレクティブが多様。コンポーネントシステム。WebComponentとはWebのUIを部品化。再利用とかメンテが簡単だよ。Vuetifyは有名どころ。マテリアルデザインベース。今年の2/13に1.0.0がリリース。OSSフレームワークなら読みたい放題。4/16いんPWA Begginers勉強会もやっているよ。

  8. HyperappでMarkdownエディタを作って薄い本を書きたい(@)
    →WeJSの運用の方。犬テトラ+を運営。「イヌでも分かるWeb Components」をリリース。HyperappはJS制のビューライブラリ。サクサク動くぞ。補完ボタンもつけたよ。WebpackとHyperappとmarked.jsで動く。

  9. Osushiに見るフロントエンドのセキュリティ(@shibe97)
    →Osushiのデザイン。React/Reduxの本を出してる。投げ銭ができるサービス。"Osusi.love"の開発者。7時間でサービス停止。セキュリティと法律がNGだった。早く世に出したいって思いがアカンかった。アカウント情報を可逆暗号にしちゃった。次のリリースでは攻撃がくるな・・・DevToolハックで攻撃を減らす。バリデーションの厳格化。X-Frame-Optionsも。HSTSも使用。X-XSS-Protectin。X-Content-Type-Option。被害を最小限に抑えるために情報を保持しない。大事。

  10. 継続的npm updateのために実践していること(@Tadashi Shigeoka)
    →Tokyo Otaku Modeで働いている。node express mongoDB Vue.js。全部JSで作っている=天国。npm update毎日してる？事業的なサービスが優先されるからnpm moduleが古いままだよね。ローカルモジュールを扱う。require("moment")で普通は使うけど。latest_modules読めばいい。ライブラリ自動updateのGreenkeeperとかDependabot使えばいいんじゃない。徐々に古いのを新しいのにしていこ？

  11. WASMとES modules(@chikoshi)
    →Web Assembly。ブラウザで動くアセンブリ。moduleだね。いろんな言語のをコンパイルしてWASMにする。で作ったアセンブリをどう使うの？JSで命令を叩いて取ってきてコンパイル。WASMにJSの関数を与えたりする。Webpack始まったよね。

参考文献

以上