32. Vueでワイワイやっていき

soussune - エンジニアわいわいポッドキャスト「そうっすね」

trkwとmiyaokaとkazuponとhashedrockとpotato4dとktsnの6人で、Vue.jsについて話しました。## Show Notes

きっかけ

Vue勢のpodcast聞きたい、どこかで企画されないかな

— はっしゅろっく (@hashedrock) 2017年10月25日

ワイワイやりましょう！　ということで、kazupon さん会場提供で 6 人が参加

soussune、初の6人で収録する回がこれから開催されようとしてます…！ #soussune pic.twitter.com/xFUEwDlCj3

— みやおか (@miyaoka) 2017年11月9日

今回初参加者の自己紹介

はっしゅろっくさん

• B2B プログラマ
• UI に興味があって趣味やフロントに Vue を利用
• Vue.js 日本語コミュニティに参加

potato4d さん

• フリーランス
• フロントでは Vue, Nuxt など
• Qiita や HTML5 Experts など日本の開発者向けに記事を寄稿
• Vue.js 製フレームワーク Nuxt.js ではじめる Universal アプリケーション開発 - HTML5Experts.jp

katashin さん

• B2B 開発フロントエンジニア
• Vue.js コアチームメンバー
• TypeScript の型定義周りのメンテナー
• VueConf 2017 参加レポート

Vue.js との出会い

はっしゅろっくさん

• Vue.js のリリース記念にコードネームのアニメのお祝い絵
  • 28. コアコミッターが語る Vue.js の話

Vue.js v2.4.0 Kill la Kill@vuejs congrats! pic.twitter.com/BpWZu2CZqK

— はっしゅろっく (@hashedrock) 2017年7月13日

• UI 作りのプロトタイピングツールとしての Vue
• kazupon さんと付き合いが長い

potato4d さん

• 春までは関西でフロント系イベント運営
  • FRONTEND CONFERENCE 2017 - 関西フロントエンド UG
  • 代表者が Vue を使っていたので触り始めた
  • たまたま trkw が関西遠征して観測してた
• 19 歳という若さに驚愕
• 去年の Vue.js 2.0 記念 meetup で kazupon さんとの出会い

katashin さん

• Vue0.10 の頃から触れてる
• ハッカソンでのフロントエンドに利用
• 上司が Vue 使用していて仕事でも使うように
• Vuex 使って PR 投げてたらどっぷり
• Twitter で kazupon さんが捕捉して、英語勉強したいとのことだったのでコアチームに引き入れる
  • オープンソースのメンテナーとかやってみるといいかもしれませんという誘い方

ワイワイタイム

Vue 2.5 の TypeScript 統合

• やって来る Vue 2.5 での TypeScript の変更 — Vue.js
• Vue 2.5 がリリースされました — Vue.js
• TypeScript のサポート — Vue.js
• vue2.5 で TypeScript 統合が改善され this が推論されるようになったので試してみた

とにかく楽してVue.jsでTypeScriptを使いたい from さくらインターネット株式会社

• まだ趣味でないと試せていない
• vuejs/vetur: Vue tooling for VS Code.

公式テンプレートが望まれる

• vuejs/vue-cli: Simple CLI for scaffolding Vue.js projects
• テンプレートは記述が泥臭くていろいろテストしたりがつらい

Vue + SVG アニメーション

• はっしゅろっくさんが触ってる領域がアツい
  • Vue.js + SVG 練習 4 : クリックで音の鳴るピアノ鍵盤 - No Regrets in Bathing
  • vue-cute-components
  • anydown/anydown

できたーーーーーウェーイ（左上テキストが変わる） pic.twitter.com/y9Qa3NrR6K

— はっしゅろっく (@hashedrock) 2017年11月4日

• Flash のように SVG をエディタで作って Vue で制御
  • Method Draw
  • Spirit - The animation tool for the web
• VueConf 2017 のサラさんの発表がアツかった

トランジション

• デモとコード例で学ぶ Vue.js のトランジション
• DOM を渡せば制御してくれるので便利

• 比較用に他のライブラリでも試したがサンプルを作るだけで大変

なんで Vue なのかと問われやすいので各々に答えを聞きたい

• 前述のとおりアニメーションに強い
• 小さくて柔軟性よい。CDN だけでビルドせずに使うこともできる
• フロントエンドにおける PHP 的なとっつきやすさ
  • 必要なものが必要なだけ揃ってる
  • Laravel だとフロントに Vue が統合されてる

気になった Twitter

• プロダクションレベルのコード品質

経験的にプロダクションで使われているコードの方が品質低いイメージなので、プロダクションレベルのコード品質って聞くと悪いイメージに聞こえる……

— r7kamura (@r7kamura) 2017年11月8日

- 日次レポートを自動で投げていく

[GitHub] 2017/11/7の Contribution 数は 22 でした。

— potato4d (@potato4d) 2017年11月8日

• WakaTime · Quantify your coding
• WakaTime で前日のプログラミング時間の集計を GAS を使って slack に通知する - アナログ金木犀

このごろの技術者の YouTube 進出

• Firebase 使って遊ぶプログラミング生配信やってみる

Firebase使って遊ぶプログラミング生配信やってみる https://t.co/n0U3icUVmZ

— 無の国 (@mizchi) 2017年11月3日

• これからはじめる Angular

今夜21:00より これからはじめるAngular をYouTube Liveします。 https://t.co/sdUQnmAqUu
HTML5 カンファレンスで発表した内容の再演ですが、時間の都合で省略した部分を補足しながら30分程度にまとめたダイジェスト版で再演します。

— laco (@laco2net) 2017年9月27日

• ng-japan OnAir
  • ng-japan/on-air: ng-japan OnAir

はじめまーす！ ng-japan OnAir #0 https://t.co/IFshS7Tuln @YouTubeさんから #ng_jp

— laco (@laco2net) 2017年11月2日

• チャンネルやっていき場 - YouTube

配信について

• このオンラインの時代にオフラインでしか講演を体験できないのはおかしい
• soussune は編集に時間がかかって最近ストックが溜まってしまってる
• rebuild に倣って収録はとりあえず生配信して、サイトに載せるアーカイブ編集版は後で出すと旬の話題とクオリティを両立しやすそう

告知

Vue.js Tokyo v-meetup

• Vue.js Tokyo v-meetup #6 - connpass
• 12/13 @品川 Microsoft。今年最後の開催
• 最近の動向やエコシステム周りなど
• おもちねこさんも登壇予定
  • 19. エンジニアってサイヤ人的じゃないですか

ANKET の「ファッション業界の未来と IT」

• 12/7 @銀座
• #ファッション業界の未来と IT(2017 年 12 月) - IT エンジニアのための情報コンテンツ ANKET
• trkw や、中筋さんなどが登壇
  • 29. 戦車の傾きも、改札の傾きも、エンジニアリングの美しさ
  • 11. 自衛隊から CTO になった話

---

💬おたより募集中

soussuneでは感想や質問などリスナーからのご意見をお待ちしています。

• Twitter
• 感想フォーム

からお気軽にコメントをお寄せください