Upload
Download free for 30 days
Login
Submit search
Firefox os勉強会 2nd WEB屋さんがWEBアプリを作ってみた
2 likes
1,316 views
Nobuhiro Ueda
1 of 21
Download now
Download to read offline
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
More Related Content
PPTX
3流プログラマーから見たPhalconとWISP
YamaYamamoto
PPTX
Lt 20130209
Tomoyuki Obi
PDF
5分でわかるPhalconPHP
Shohei Tai
PPTX
とある技術の快速聊天
wakaba
PDF
TypeScript And ALM
Kazushi Kamegawa
PDF
究極にして至高のWAF
Yuki Ishikawa
PPTX
Cod2013 Sapporo #1
Tomoyuki Obi
PPTX
爆速フレームワークでREST APIを作った話
Shohei Tai
3流プログラマーから見たPhalconとWISP
YamaYamamoto
Lt 20130209
Tomoyuki Obi
5分でわかるPhalconPHP
Shohei Tai
とある技術の快速聊天
wakaba
TypeScript And ALM
Kazushi Kamegawa
究極にして至高のWAF
Yuki Ishikawa
Cod2013 Sapporo #1
Tomoyuki Obi
爆速フレームワークでREST APIを作った話
Shohei Tai
What's hot
(20)
PPT
Perl Beginners #7 おとなのWAF
Munenori Sugimura
PPTX
Xamarinとmvvm crossとf#と
Masahiko Miyasaka
PPTX
PHPから離れて感じるPHPの良さ
Shinichi Takahashi
PDF
業務アプリケーションにおけるモダンWeb開発の現状ーHTML5開発って簡単なの?
Fumio SAGAWA
PPTX
8th july2013 packaged_apps_codelab
Kensaku Komatsu
PDF
Yeomanではじめる爆速webアプリ開発
Masakazu Muraoka
PPTX
Web開発の 今までとこれから
Shinichi Takahashi
PDF
2014.07.09 WordBench Tokyo LT
Yutaro Miyazaki
PDF
WDHA#038 CMS会議 AOMORI / a-blog cms 2.1を活用したWeb制作のワークフロー
Kazumich YAMAMOTO
PPTX
「ふくてん」に来てんね
Hideaki Aoyagi
PDF
Xamarin 概要 @ 「Xamarin」って何? Wエバンジェリストによる特濃「Xamarin」勉強会 Rev2
Yoshito Tabuchi
PPTX
TypeScriptの大規模開発への適用
JustSystems Corporation
PDF
Web API のすすめ
Yuji Shimada
PPT
T itanium概要
Masashi Hitotsuyanagi
PPT
titanium_outline20111227
Masashi Hitotsuyanagi
PDF
Wordbench愛媛・WordCamp Tokyo 2015レポート
ねこみみ 隊長
PPTX
WPF on .NET Core 3.0
一希 大田
PDF
中の下のエンジニアを脱出するための仕事術
Noriaki Kadota
PPTX
エンジニアと"協同"してサービスをつくる
Ishikawa Yuya
PDF
Xamarin 概要 @ 2014/10/18 わんくま同盟 東京勉強会 #92
Yoshito Tabuchi
Perl Beginners #7 おとなのWAF
Munenori Sugimura
Xamarinとmvvm crossとf#と
Masahiko Miyasaka
PHPから離れて感じるPHPの良さ
Shinichi Takahashi
業務アプリケーションにおけるモダンWeb開発の現状ーHTML5開発って簡単なの?
Fumio SAGAWA
8th july2013 packaged_apps_codelab
Kensaku Komatsu
Yeomanではじめる爆速webアプリ開発
Masakazu Muraoka
Web開発の 今までとこれから
Shinichi Takahashi
2014.07.09 WordBench Tokyo LT
Yutaro Miyazaki
WDHA#038 CMS会議 AOMORI / a-blog cms 2.1を活用したWeb制作のワークフロー
Kazumich YAMAMOTO
「ふくてん」に来てんね
Hideaki Aoyagi
Xamarin 概要 @ 「Xamarin」って何? Wエバンジェリストによる特濃「Xamarin」勉強会 Rev2
Yoshito Tabuchi
TypeScriptの大規模開発への適用
JustSystems Corporation
Web API のすすめ
Yuji Shimada
T itanium概要
Masashi Hitotsuyanagi
titanium_outline20111227
Masashi Hitotsuyanagi
Wordbench愛媛・WordCamp Tokyo 2015レポート
ねこみみ 隊長
WPF on .NET Core 3.0
一希 大田
中の下のエンジニアを脱出するための仕事術
Noriaki Kadota
エンジニアと"協同"してサービスをつくる
Ishikawa Yuya
Xamarin 概要 @ 2014/10/18 わんくま同盟 東京勉強会 #92
Yoshito Tabuchi
Ad
Similar to Firefox os勉強会 2nd WEB屋さんがWEBアプリを作ってみた
(20)
PPTX
Webエンジニアによるスマートフォンアプリ開発
takeuchi-tk
PDF
Windows 10 対応のデスクトップアプリを 作る技術(事前公開版)
一希 大田
ODP
HTML5 アプリ開発
tomo_masakura
PPTX
PhoneGapユーザー会@大阪 講演資料
Monaca
PDF
Titanium Mobile ~本当にあったこわい話~
Atsushi Harada
PPT
無料環境でWindows Mobileアプリ開発
7shi
PPTX
Phone gap+javascriptスマホアプリ開発(入門編)
Monaca
PPTX
わんくま名古屋 #37 (20151114) Windows 10 UWP アプリ開発入門(実践編)
Yasuhiko Yamamoto
PDF
.NET CoreアプリでWindowsの外に出発
Developer Solutions事業部 メシウス株式会社 (旧グレープシティ株式会社)
PPTX
Windows IoT Core and Robot Arm
Masuda Tomoaki
KEY
Android webブラウザのhtml5対応状況
Masakazu Muraoka
PPTX
FriendlyによるWindowsアプリテスト自動化手法 基礎技術編
Kenji Fukumoto
PPT
ネットワーク分散型フレームワークConView
Rakuten Group, Inc.
PPTX
自動的に開発環境設定(1)
Phạm Văn Hùng
PPTX
Aiming のクラウド採用基準
Takahiro Hozumi
PPTX
Androidが変えたもの
Yuki Yamakido
PPTX
Visual Studio 2017 事はじめ
Hideaki Aoyagi
PPTX
Azure App Service を使った無料のハンズオン
Sunao Tomita
KEY
スマートフォン開発の事例 Html5開発の導入ポイント
Masakazu Muraoka
PDF
アウトプットのすすめ
Satoshi Oikawa
Webエンジニアによるスマートフォンアプリ開発
takeuchi-tk
Windows 10 対応のデスクトップアプリを 作る技術(事前公開版)
一希 大田
HTML5 アプリ開発
tomo_masakura
PhoneGapユーザー会@大阪 講演資料
Monaca
Titanium Mobile ~本当にあったこわい話~
Atsushi Harada
無料環境でWindows Mobileアプリ開発
7shi
Phone gap+javascriptスマホアプリ開発(入門編)
Monaca
わんくま名古屋 #37 (20151114) Windows 10 UWP アプリ開発入門(実践編)
Yasuhiko Yamamoto
.NET CoreアプリでWindowsの外に出発
Developer Solutions事業部 メシウス株式会社 (旧グレープシティ株式会社)
Windows IoT Core and Robot Arm
Masuda Tomoaki
Android webブラウザのhtml5対応状況
Masakazu Muraoka
FriendlyによるWindowsアプリテスト自動化手法 基礎技術編
Kenji Fukumoto
ネットワーク分散型フレームワークConView
Rakuten Group, Inc.
自動的に開発環境設定(1)
Phạm Văn Hùng
Aiming のクラウド採用基準
Takahiro Hozumi
Androidが変えたもの
Yuki Yamakido
Visual Studio 2017 事はじめ
Hideaki Aoyagi
Azure App Service を使った無料のハンズオン
Sunao Tomita
スマートフォン開発の事例 Html5開発の導入ポイント
Masakazu Muraoka
アウトプットのすすめ
Satoshi Oikawa
Ad
Firefox os勉強会 2nd WEB屋さんがWEBアプリを作ってみた
1.
Web屋さんがWebアプリを作ったら @junkpot1212
2.
何をやってる人か ・WEB系エンジニア ・PHPer ・CakePHP ・AWSなんかも
3.
そんなWEBな自分が とにかくFirefoxOSで動く アプリを作ってみよう
4.
課題 ・WEBってからにはクラウドと連携したい ・ブラウザだけじゃなく、 端末にインストールするアプリもしたい ・実機には日本語IMEがない ・自前ビルドでしょぼいIMEは出てくるけど快適とは言えない ・エミュレーターならPCのIMEから入力出来る どんなアプリにするか?
5.
じゃんけん対決アプリ ・入力いらずで選択だけでOK ・対人対戦ならクラウド必須
6.
じゃんけんアプリに必要なもの ・サーバー側処理 アプリらしくリアルタイム通信をしたいので WebSocketを使用 勝ち負けの判定 ・クライアント側処理 サーバーとWebSocketで通信のやり取り
7.
WebSocketって何? ・HTML5に導入されたHTTP通信の双方向版 ・常時コネクションを維持することで クライアントから一方通行だった通信が サーバーからもデータを送受信することが出来る チャットとか
8.
サーバー側でWebSocket WebSocketならNode.jsかjavaで やるのがメジャー? PHPerとしてはphpでやってみたい ってことで探してみる
9.
ありました
10.
PHP WebSocket Server(php-websocket) http://siriux.net/2010/08/php-websocket-server/ phpをコマンドラインで実行し、指定のポートで WebSocketを実現する URLにある日付は古いがGithub上ではそこそこメン テナンスされてるっぽい Forkされまくりで亜種も多い模様 結構綺麗に書かれてる。気がする。 でもexsampleにあったソースは動かなかった
11.
PHP WebSocketでサーバー側処理 php-websocket/exsample/server.php 実行ファイル 設定もここに書く
12.
PHP WebSocketでサーバー側処理 Php-websocket/lib/Wrench/Application/***Application.php クライアントとのやり取りを行うclass
13.
クライアント側の実装 ● サーバーから送信された情報の受信 ● 受信した結果を画面に反映 ● サーバーに選んだじゃんけんの手を送信 ● JQuery Mobile を使用
14.
jQuery Mobile ・言わずとしれた有名JavaScriptライブラリ jQuery のモバイル版 ・socket.ioを使ってWebSocketを実装する
15.
jQuery Mobileでクライアント処理 socket =
new WebSocket('ws://localhost:8000/echo'); で接続先を指定してオープン onmessageメソッドにサーバーからの通知があった 時の処理を書く
16.
FirefoxOSへのインストール準備 基本的には先程のクライアントのソースを置くだけ (エミュレーターの場合) manifest.webappを用意する
17.
FirefoxOSへのインストール準備 manifest.webapp name アプリ名 ●description アプリの説明 ●launch_path
アプリ起動時に表示するファイル ● etc...
18.
ってことで今回作ったアプリのデモやります
19.
HTML5的なアプリが 本当にそのまんま動くんです。
20.
FirefoxOSでアプリを作ってみて 楽しい ●エミュレーターが優秀 ●WEBとの親和性どころか想像以上にWEBそのもの ●FirefoxOS向けであればIEの事を気にしなくていい ●
21.
ご清聴ありがとうございました
Download