Soumettre la recherche
Mettre en ligne
今日帰ってすぐに始められるChrome App #nds45
•
2 j'aime
•
2,653 vues
civic Sasaki
Suivre
Chrome Appを始めようという提案
Lire moins
Lire la suite
Technologie
Signaler
Partager
Signaler
Partager
1 sur 33
Télécharger maintenant
Télécharger pour lire hors ligne
Recommandé
WordCamp Kobe: WordPress in Japan
WordCamp Kobe: WordPress in Japan
Naoko Takano
LT: 今日帰ってすぐに始められるPython #nds45
LT: 今日帰ってすぐに始められるPython #nds45
civic Sasaki
むずかしくないJavaScriptのやさしい話 jQueryからの次のステップ #ndsmeetup8
むずかしくないJavaScriptのやさしい話 jQueryからの次のステップ #ndsmeetup8
civic Sasaki
Firefoxos
Firefoxos
civic Sasaki
第38回載せられないapp
第38回載せられないapp
civic Sasaki
第39回続・古くなったkindle4
第39回続・古くなったkindle4
civic Sasaki
第43回NDS NetBeansを使ったJavaプロファイリングの紹介
第43回NDS NetBeansを使ったJavaプロファイリングの紹介
civic Sasaki
私の好きなPython構文 vol.2 #nds46
私の好きなPython構文 vol.2 #nds46
civicpg
Recommandé
WordCamp Kobe: WordPress in Japan
WordCamp Kobe: WordPress in Japan
Naoko Takano
LT: 今日帰ってすぐに始められるPython #nds45
LT: 今日帰ってすぐに始められるPython #nds45
civic Sasaki
むずかしくないJavaScriptのやさしい話 jQueryからの次のステップ #ndsmeetup8
むずかしくないJavaScriptのやさしい話 jQueryからの次のステップ #ndsmeetup8
civic Sasaki
Firefoxos
Firefoxos
civic Sasaki
第38回載せられないapp
第38回載せられないapp
civic Sasaki
第39回続・古くなったkindle4
第39回続・古くなったkindle4
civic Sasaki
第43回NDS NetBeansを使ったJavaプロファイリングの紹介
第43回NDS NetBeansを使ったJavaプロファイリングの紹介
civic Sasaki
私の好きなPython構文 vol.2 #nds46
私の好きなPython構文 vol.2 #nds46
civicpg
Web制作者がandriodのcddを読んでみた version1.1
Web制作者がandriodのcddを読んでみた version1.1
Masakazu Muraoka
Web制作者がandriodのcddを読んでみた
Web制作者がandriodのcddを読んでみた
Masakazu Muraoka
Electron early 2019
Electron early 2019
Masahiro Kondoh
Chrome 拡張のご紹介
Chrome 拡張のご紹介
Tetsunosuke Saito
8th july2013 packaged_apps_codelab
8th july2013 packaged_apps_codelab
Kensaku Komatsu
Sharoid Service Menu
Sharoid Service Menu
sharoid
フロントエンドの技術で始めるデスクトップアプリ
フロントエンドの技術で始めるデスクトップアプリ
Tomotaka Kusaka
アプリ開発の
アプリ開発の
maruyama097
WordCamp Tokyo2012 handson Portfolio
WordCamp Tokyo2012 handson Portfolio
regret raym
北海道勉強会_20140531
北海道勉強会_20140531
Hiraku Komuro
Webエンジニアのためのandroidアプリ開発
Webエンジニアのためのandroidアプリ開発
Soudai Sone
Unity に於ける Android ビルド自動化のおはなし - 20141215 第27回 Unity 勉強会
Unity に於ける Android ビルド自動化のおはなし - 20141215 第27回 Unity 勉強会
Mori Tetsuya
20120413 nestakabaneworkshop
20120413 nestakabaneworkshop
Yoichiro Sakurai
20140629 firefoxos-devenv
20140629 firefoxos-devenv
Noritada Shimizu
Chrome Apps & Chromeウェブストア概要
Chrome Apps & Chromeウェブストア概要
yoshikawa_t
HTML5 の Web制作を 確実に楽にする最新の アドビWeb制作ツール for HTML5 Carnival Fukuoka
HTML5 の Web制作を 確実に楽にする最新の アドビWeb制作ツール for HTML5 Carnival Fukuoka
Keisuke Todoroki
カスタムROM開発者の視点から見たAndroid
カスタムROM開発者の視点から見たAndroid
android sola
iPhone/Android アプリをまとめて省エネ開発する技術
iPhone/Android アプリをまとめて省エネ開発する技術
vaccho
Amazon SESのメール受信対応でサーバー減らせた話
Amazon SESのメール受信対応でサーバー減らせた話
civic Sasaki
第42回中華製安価デバイスの通信を解析した話
第42回中華製安価デバイスの通信を解析した話
civic Sasaki
第37回NDS Java並行処理 今昔物語
第37回NDS Java並行処理 今昔物語
civic Sasaki
第36回NDS 発表資料 ちょこっとpython
第36回NDS 発表資料 ちょこっとpython
civic Sasaki
Contenu connexe
Similaire à 今日帰ってすぐに始められるChrome App #nds45
Web制作者がandriodのcddを読んでみた version1.1
Web制作者がandriodのcddを読んでみた version1.1
Masakazu Muraoka
Web制作者がandriodのcddを読んでみた
Web制作者がandriodのcddを読んでみた
Masakazu Muraoka
Electron early 2019
Electron early 2019
Masahiro Kondoh
Chrome 拡張のご紹介
Chrome 拡張のご紹介
Tetsunosuke Saito
8th july2013 packaged_apps_codelab
8th july2013 packaged_apps_codelab
Kensaku Komatsu
Sharoid Service Menu
Sharoid Service Menu
sharoid
フロントエンドの技術で始めるデスクトップアプリ
フロントエンドの技術で始めるデスクトップアプリ
Tomotaka Kusaka
アプリ開発の
アプリ開発の
maruyama097
WordCamp Tokyo2012 handson Portfolio
WordCamp Tokyo2012 handson Portfolio
regret raym
北海道勉強会_20140531
北海道勉強会_20140531
Hiraku Komuro
Webエンジニアのためのandroidアプリ開発
Webエンジニアのためのandroidアプリ開発
Soudai Sone
Unity に於ける Android ビルド自動化のおはなし - 20141215 第27回 Unity 勉強会
Unity に於ける Android ビルド自動化のおはなし - 20141215 第27回 Unity 勉強会
Mori Tetsuya
20120413 nestakabaneworkshop
20120413 nestakabaneworkshop
Yoichiro Sakurai
20140629 firefoxos-devenv
20140629 firefoxos-devenv
Noritada Shimizu
Chrome Apps & Chromeウェブストア概要
Chrome Apps & Chromeウェブストア概要
yoshikawa_t
HTML5 の Web制作を 確実に楽にする最新の アドビWeb制作ツール for HTML5 Carnival Fukuoka
HTML5 の Web制作を 確実に楽にする最新の アドビWeb制作ツール for HTML5 Carnival Fukuoka
Keisuke Todoroki
カスタムROM開発者の視点から見たAndroid
カスタムROM開発者の視点から見たAndroid
android sola
iPhone/Android アプリをまとめて省エネ開発する技術
iPhone/Android アプリをまとめて省エネ開発する技術
vaccho
Similaire à 今日帰ってすぐに始められるChrome App #nds45
(18)
Web制作者がandriodのcddを読んでみた version1.1
Web制作者がandriodのcddを読んでみた version1.1
Web制作者がandriodのcddを読んでみた
Web制作者がandriodのcddを読んでみた
Electron early 2019
Electron early 2019
Chrome 拡張のご紹介
Chrome 拡張のご紹介
8th july2013 packaged_apps_codelab
8th july2013 packaged_apps_codelab
Sharoid Service Menu
Sharoid Service Menu
フロントエンドの技術で始めるデスクトップアプリ
フロントエンドの技術で始めるデスクトップアプリ
アプリ開発の
アプリ開発の
WordCamp Tokyo2012 handson Portfolio
WordCamp Tokyo2012 handson Portfolio
北海道勉強会_20140531
北海道勉強会_20140531
Webエンジニアのためのandroidアプリ開発
Webエンジニアのためのandroidアプリ開発
Unity に於ける Android ビルド自動化のおはなし - 20141215 第27回 Unity 勉強会
Unity に於ける Android ビルド自動化のおはなし - 20141215 第27回 Unity 勉強会
20120413 nestakabaneworkshop
20120413 nestakabaneworkshop
20140629 firefoxos-devenv
20140629 firefoxos-devenv
Chrome Apps & Chromeウェブストア概要
Chrome Apps & Chromeウェブストア概要
HTML5 の Web制作を 確実に楽にする最新の アドビWeb制作ツール for HTML5 Carnival Fukuoka
HTML5 の Web制作を 確実に楽にする最新の アドビWeb制作ツール for HTML5 Carnival Fukuoka
カスタムROM開発者の視点から見たAndroid
カスタムROM開発者の視点から見たAndroid
iPhone/Android アプリをまとめて省エネ開発する技術
iPhone/Android アプリをまとめて省エネ開発する技術
Plus de civic Sasaki
Amazon SESのメール受信対応でサーバー減らせた話
Amazon SESのメール受信対応でサーバー減らせた話
civic Sasaki
第42回中華製安価デバイスの通信を解析した話
第42回中華製安価デバイスの通信を解析した話
civic Sasaki
第37回NDS Java並行処理 今昔物語
第37回NDS Java並行処理 今昔物語
civic Sasaki
第36回NDS 発表資料 ちょこっとpython
第36回NDS 発表資料 ちょこっとpython
civic Sasaki
Nds35 kindle4
Nds35 kindle4
civic Sasaki
NDS31 はじめてChrome App
NDS31 はじめてChrome App
civic Sasaki
Plus de civic Sasaki
(6)
Amazon SESのメール受信対応でサーバー減らせた話
Amazon SESのメール受信対応でサーバー減らせた話
第42回中華製安価デバイスの通信を解析した話
第42回中華製安価デバイスの通信を解析した話
第37回NDS Java並行処理 今昔物語
第37回NDS Java並行処理 今昔物語
第36回NDS 発表資料 ちょこっとpython
第36回NDS 発表資料 ちょこっとpython
Nds35 kindle4
Nds35 kindle4
NDS31 はじめてChrome App
NDS31 はじめてChrome App
Dernier
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
Ryo Sasaki
TSAL operation mechanism and circuit diagram.pdf
TSAL operation mechanism and circuit diagram.pdf
taisei2219
SOPを理解する 2024/04/19 の勉強会で発表されたものです
SOPを理解する 2024/04/19 の勉強会で発表されたものです
iPride Co., Ltd.
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
Hiroki Ichikura
Postman LT Fukuoka_Quick Prototype_By Daniel
Postman LT Fukuoka_Quick Prototype_By Daniel
danielhu54
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
Toru Tamaki
論文紹介:Semantic segmentation using Vision Transformers: A survey
論文紹介:Semantic segmentation using Vision Transformers: A survey
Toru Tamaki
スマートフォンを用いた新生児あやし動作の教示システム
スマートフォンを用いた新生児あやし動作の教示システム
sugiuralab
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Yuma Ohgami
論文紹介:Automated Classification of Model Errors on ImageNet
論文紹介:Automated Classification of Model Errors on ImageNet
Toru Tamaki
Dernier
(10)
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
TSAL operation mechanism and circuit diagram.pdf
TSAL operation mechanism and circuit diagram.pdf
SOPを理解する 2024/04/19 の勉強会で発表されたものです
SOPを理解する 2024/04/19 の勉強会で発表されたものです
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
Postman LT Fukuoka_Quick Prototype_By Daniel
Postman LT Fukuoka_Quick Prototype_By Daniel
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
論文紹介:Semantic segmentation using Vision Transformers: A survey
論文紹介:Semantic segmentation using Vision Transformers: A survey
スマートフォンを用いた新生児あやし動作の教示システム
スマートフォンを用いた新生児あやし動作の教示システム
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
論文紹介:Automated Classification of Model Errors on ImageNet
論文紹介:Automated Classification of Model Errors on ImageNet
今日帰ってすぐに始められるChrome App #nds45
1.
2015年私が学んだ Chrome App ∼
今日帰ってすぐに始められる Chrome App ∼ #nds45 @civic
2.
今日話す内容 • 今年私がChrome Appで学んだこと •
Chrome Appをはじめよう • デモChrome Appの紹介
3.
今年私がChrome Appで学んだこと
4.
Electron人気急上昇 • Atom, VSCodeなどElectron製アプリの人気 •
HTML+JS+CSSで簡単にアプリが作れる • ブラウザ依存性キニシナイ • マルチプラットフォーム
5.
ちょっと待って!
6.
ブラウザ依存性なしだが? • Electron製アプリはブラウザ内蔵 • 特定バージョンのChromiumが内蔵 •
ブラウザのアップデートの影響受けない • Chromiumバージョンは固定されてよいのか?
7.
• Electron製アプリはブラウザ内蔵 • ブラウザって重い •
各アプリがみなChromeみたいな重さ? 重くないの? Electron App Chromium Node JS Electron App Chromium Node JS アプリA アプリB
8.
そこでChrome Appを提案
9.
構造 • Chrome内プロセスの1つとして動作 • タブと似たプロセス •
Chromeの上で動くのでChromeバージョンに従う Chrome Chrome App Chrome App Chrome App
10.
Chrome Appの例
11.
LINE
12.
Chrome Dev Editor
13.
そんなに流行ってない
14.
でもポテンシャルはあると思う • Chromeの拡張機能的なもの • Chrome
OS上のApp • 独立したWindow • オフライン対応 • Chrome APIを通じたネイティブ操作 • Cordova対応によるモバイルApp化
15.
Electron製Appと比べた利点 • アプリ自体の配布が楽 • Chrome
Web Storeからダウンロード • 安全性 • manifestで宣言された権限下で動作 • Chrome Web Storeでのソフトウェア・アップデート • Low level APIのマルチプラットフォーム性 • Chromeがやってくれる(という理想)
16.
Electron製Appと比べた欠点 • ネイティブの自由度 • Chrome
Platform APIでできないことは無理 × OSファイルシステムへの無制限なIO × 特定プラットフォーム限定での作成 • Chromeバージョン依存 • 良くも悪くも • Chrome Web Storeを介さない野良配布 • 制限される方向
17.
すべてにおいてElectronよりも 良いということではない 小規模ならばChrome Appの方が便利?
18.
Chrome Appをはじめよう
19.
Hello Worldの作成 • Chrome
Dev Editorのインストール • これ自体がChrome App • New Project
20.
manifest.json { "manifest_version": 2, "name": “Test", "version":
"1.0", "app": { "background": { "scripts": ["background.js"] } } } エントリポイントとなるJS
21.
background.js chrome.app.runtime.onLaunched.addListener( function(launchData) { chrome.app.window.create('index.html', { id:
'mainWindow', bounds: {width: 800, height: 600} }); } ); HTMLを指定してWindow表示 App起動時
22.
あとはHTML+JS+CSSの世界
23.
テキストエディタで開発
24.
まっさらな状態から開発 • IDEに頼らずエディタで • npm
+ webpackを使ってみる • 参考:むずかしくないJavaScriptのやさしい話 http://www.civic-apps.com/2015/11/15/ndsmeetup8/ • 手順 npm init npm install jquery --save manifest.json background.js, index.html, index.js webpack index.js bundle.js
25.
Chromeで開く • 拡張機能の読み込み • またはコマンドラインから google-chrome
--load-and-launch-app=(作業フォルダ)
26.
デモChrome Appの紹介
27.
Chrome App HTTP
Server • ブラウザ上で動くアプリでありながらWebサーバー • chrome.sockets.tcp • chrome.sockets.tcpServer Chrome Chrome App HTTP Server Browser Tab HTTP Request https://github.com/civic/chrome-app-httpserver
28.
Bluetooth Game Controller •
Bluetoothデバイスとの通信 • Bluetoothを使った独自ゲームコントローラー Zeemote JS1H Chrome Chrome App Bluetooth https://github.com/civic/chrome-app-bluetooth-zeemote
29.
実はHTML5で「Gamepad API」 というのがある ただしZeemoteはGamepadではないようだ
30.
そのほかのAPI • chrome.sockets.udp • chrome.usb •
chrome.serial • chrome.commands • chrome.contextMenus • chrome.fileSystem • chrome.gcm • chrome.syncFileSystem ... UDP通信 USB通信 シリアル通信 ショートカットキー コンテキストメニュー 無制限ファイルシステム Google Cloudメッセージ Google Drive同期
31.
まとめ
32.
今日覚えたこと • Chrome Appは手軽に作成・配布できる •
Chrome Dev ToolからNew Projectで完成 • 小規模AppならばElectronよりも楽ではないか? • Web Storeでの配布 • ブラウザの安全性 • ソフトウェアのオートアップデート
33.
今日帰ったらすぐに Chrome Appを作ろう
Télécharger maintenant