# 今日使うサービス

- HackMD（ https://hackmd.io/s/S1JT9dxaf ）
- sli.do （ https://app2.sli.do/event/2gwflwww ）

HackMDはパソコンで開いて、Sli.doはスマホでやるのがいいかも。

# 最新のウェブ技術を体験しよう（堀さん）チェック

フロントエンドエンジニア

[@steelydylan‬](https://twitter.com/steelydylanhttps://twitter.com/steelydylan)

## 大きくなるWebの役割

- SPA (Single Page Application)
- 例）Twitter
- 例）Netflix
- PWA (Progressive Web App)

### PWA

### [pwa.rocks](https://pwa.rocks/)
ホーム画面に追加してみよう!

## Webで今どんなことができるのか？
[https://whatwebcando.today/](https://whatwebcando.today/)

### ビデオチャット
[https://appear.in/](https://appear.in/)

[https://appear.in/appleple](https://appear.in/appleple)

### 音声認識
[https://www.speechrec.jp/](https://www.speechrec.jp/)

### 作曲ツール
[https://www.soundtrap.com/studio/](https://www.soundtrap.com/studio/)

### ゲーム

- [http://9leap.net/](http://9leap.net/)
- [https://jerseyshorefistpump.com](https://jerseyshorefistpump.com)
- http://9leap.net/games/2374

### Web GL
- [PlayCanvas](https://playcanvas.com/)
- [Three.js](https://threejs.org/)

### Web RTC
- [https://github.com/webrtc/samples](https://github.com/webrtc/samples)

さっきのSkypeみたいなサービスではWebRTCが使われている

### Canvas

- [enchant.js](http://enchantjs.com/)
- パフォーマンスがあまりよくない。。。
- [phina.js](http://phinajs.com/)

### Web Audio API

- [HOWLER.js](https://howlerjs.com/)

### Speech Recognition API

- [https://cloud.google.com/speech-to-text/](https://cloud.google.com/speech-to-text/)

### Web VR

- [A-FRAME](https://aframe.io/)
- Mozillaが開発している

### デジタルサイネージ

- [https://www.youtube.com/watch?v=vBFZOSLlYcc](https://www.youtube.com/watch?v=vBFZOSLlYcc)
-
- Kiosk モード

http://uber.github.io/deck.gl/#/

## 求人

- [Wantedly](https://www.wantedly.com/projects/206866)

# 変化し続けるウェブ技術を追うためには〜ウェブ業界で生き残るための情報収集のしかた〜（森田）

### 配信されているものを聴く~~~~

### Podcast
- [Rebuild.fm](https://rebuild.fm/)
- [Automagic Podcast](http://automagic.fm/)
- [Takram Cast](https://itunes.apple.com/jp/podcast/takram/id1161310459?mt=2)

### 勉強会
- [CSS Nite](http://cssnite.jp/)
- [Inside Frontend ](https://inside-frontend.com/)
- [Frontrend](https://frontrend.connpass.com/)
- [UI Crunch](https://ui-crunch.connpass.com/)

## メールマガジン
* Frontend Weekly
* Code Grid
* Web Tool Weekly
* Frontend Focus
* Web Design Weekly

〇〇Weeklyで探せばだいたいあります

## Facebook Group

* [webクリエイターのための情報交換所](https://www.facebook.com/groups/241838242545737/)
* [HCD-Net 東海](https://www.facebook.com/groups/1853168224919554/)
* [UI Crunch](https://www.facebook.com/groups/1483413475241684/)

## 作品を見る

* [Drrrible](https://dribbble.com/)
* [Bechance](https://www.behance.net/)
* [Pinterest](https://www.pinterest.jp/)
* [Codepen](https://codepen.io/)
* [Product Hunt](https://www.producthunt.com/)
* [GitHub](https://github.com/)
* [makepost](https://www.makepost.net/)

## 技術書

* Oreilly
* BNN社
* ボーンデジタル
* ノンデザイナーズブック
* リーダブルコード
* MdN

* [その本、図書館にあります](https://chrome.google.com/webstore/detail/%E3%81%9D%E3%81%AE%E6%9C%AC%E3%80%81%E5%9B%B3%E6%9B%B8%E9%A4%A8%E3%81%AB%E3%81%82%E3%82%8A%E3%81%BE%E3%81%99%E3%80%82/ldidobiipljjgfaglokcehmiljadanle?hl=ja)

### ウェブメディア
* [WPJ](https://www.webprofessional.jp/)
* [コリス](https://coliss.com/)
* [Web担当者フォーラム](https://webtan.impress.co.jp/)
* [UX Milk](http://uxmilk.jp/)
* [CSS Tricks](https://css-tricks.com/)
* [Smashing Magazine](https://www.smashingmagazine.com/)
* [大阪手作り結婚指輪口コミ](https://yubiwa.net/)
* [Sitepoint](https://www.sitepoint.com/)
... など。好きなメディアを見つけよう！
- [Feedly](https://feedly.com/)

## セミナーに参加登録する

### 名古屋の勉強会
- [WCAN](https://wcan.jp/)
- [contents.nagoya](https://contents.nagoya/)
- [UX 名古屋](https://peatix.com/group/22462)
- [HCD-Net](https://peatix.com/group/50276)
- [Startup Weekend](https://swnagoya.doorkeeper.jp/)
- [Ateam Tech Meet Up #エンジニアLT＆交流会](https://ateam.connpass.com/event/82837/)
- [Mobile Act NAGOYA](https://mobileactnagoya.connpass.com/)
- [Frontend Nagoya](https://frontend758.doorkeeper.jp//)
- [DTPの勉強部屋](https://study-room.info/dtp/)
- [Nagoya.js](https://nagoya-js.doorkeeper.jp/)

- [名古屋勉強会ラムダ](https://nagoya-benkyokai.com/)

## 似た分野を勉強している仲間やライバルを見つける（その2）

- [NEXT COMMUNICATION FORUM](https://www.nttdocomo.co.jp/campaign_event/tokai/ncf_award/)
- [技能五輪](http://www.javada.or.jp/jigyou/gino/zenkoku/)

## 発信の場を持つ

- [OthoEvent#30](https://othlotech.connpass.com/event/85753/)
- [note](https://note.mu/)
- [Qiita](https://qiita.com/)

- OthloTechの次回イベントはこちら💁[https://othlotech.connpass.com/event/85753/](https://othlotech.connpass.com/event/85753/)

## アイディアを吸収できる場を把握しておく

- [OthloEvent](https://othlotech.connpass.com/)
- [Drrrible](https://dribbble.com/)

# これから変化し続けるウェブ技術を追う　仕組みをつくるワークショップ

今日の帰りに実践できるように、情報収集の仕組みをつくってみよう。

## RSSリーダー
- [Feedly](https://feedly.com/)

### Webメディア
* [CSS Tricks](https://css-tricks.com/)
* [Smashing Magazine](https://www.smashingmagazine.com/)
* [WPJ](https://www.webprofessional.jp/)
* [コリス](https://coliss.com/)
* [UX Milk](http://uxmilk.jp/)
... など。好きなメディアを見つけよう！

## リマインダー
- iOSのリマインダー
- Google Todo（4月25日リリース！）[iPhone](https://itunes.apple.com/jp/app/id1353634006)/[Android](https://play.google.com/store/apps/details?id=com.google.android.apps.tasks)

## 記事を保存しておく
- [はてなブックマーク](http://b.hatena.ne.jp/)

## 参加したい勉強会を探して登録する

### 名古屋の勉強会
- [WCAN](https://wcan.jp/)
- [contents.nagoya](https://contents.nagoya/)
- [UX 名古屋](https://peatix.com/group/22462)
- [HCD-Net](https://peatix.com/group/50276)
- [Startup Weekend](https://swnagoya.doorkeeper.jp/)
- [Ateam Tech Meet Up #エンジニアLT＆交流会](https://ateam.connpass.com/event/82837/)
- [Mobile Act NAGOYA](https://mobileactnagoya.connpass.com/)
- [Frontend Nagoya](https://frontend758.doorkeeper.jp//)
- [DTPの勉強部屋](https://study-room.info/dtp/)
- [Nagoya.js](https://nagoya-js.doorkeeper.jp/)

- [名古屋勉強会ラムダ](https://nagoya-benkyokai.com/)

## 配信されているもの

### Podcast
- [Rebuild.fm](https://rebuild.fm/)
- [Automagic Podcast](http://automagic.fm/)
- [Takram Cast](https://itunes.apple.com/jp/podcast/takram/id1161310459?mt=2)

### 勉強会
- [CSS Nite](http://cssnite.jp/)
- [Inside Frontend ](https://inside-frontend.com/)
- [Frontrend](https://frontrend.connpass.com/)
- [UI Crunch](https://ui-crunch.connpass.com/)

## 好きなサービス連携して自動化してみよう

- [IFTTT](https://ifttt.com/discover)

例）Twitterで特定のハッシュタグをつけてツイートしたらSlackに流す
例）TwitterでいいねしたらEvernoteのノートに保存する