SlideShare a Scribd company logo

SmartPhone development guide with CoffeeScript + Node + HTML5 Technology, for Perl Programmers

N
Naoya Ito
1 of 47
Download to read offline
Perlプログラマのための
スマートフォン開発ガイド
 CoffeeScript / Node / HTML5
          Naoya Ito
キーワード

•   PhoneGap
•   Titanium Mobile
•   CoffeeScript
•   Node.js
•   Socket.IO
•   Express
•   npm
•   …
半年ほど前
一ヶ月前
今週
“Embedded Web Vies”

Recommended

Scripting Layer for Android + Perl
Scripting Layer for Android + PerlScripting Layer for Android + Perl
Scripting Layer for Android + PerlNaoya Ito
 
Titanium Mobile
Titanium MobileTitanium Mobile
Titanium MobileNaoya Ito
 
about Thrift
about Thriftabout Thrift
about ThriftNaoya Ito
 
081108huge_data.ppt
081108huge_data.ppt081108huge_data.ppt
081108huge_data.pptNaoya Ito
 
Norikraで作るPHPの例外検知システム YAPC::Asia Tokyo 2015 LT
Norikraで作るPHPの例外検知システム YAPC::Asia Tokyo 2015 LTNorikraで作るPHPの例外検知システム YAPC::Asia Tokyo 2015 LT
Norikraで作るPHPの例外検知システム YAPC::Asia Tokyo 2015 LTMasahiro Nagano
 
『How to build a High Performance PSGI/Plack Server』のその後と ISUCON3を受けての話題
『How to build a High Performance PSGI/Plack Server』のその後と ISUCON3を受けての話題『How to build a High Performance PSGI/Plack Server』のその後と ISUCON3を受けての話題
『How to build a High Performance PSGI/Plack Server』のその後と ISUCON3を受けての話題Masahiro Nagano
 
AWS SDK for Smalltalk
AWS SDK for SmalltalkAWS SDK for Smalltalk
AWS SDK for SmalltalkSho Yoshida
 
emscriptenでC/C++プログラムをwebブラウザから使うまでの難所攻略
emscriptenでC/C++プログラムをwebブラウザから使うまでの難所攻略emscriptenでC/C++プログラムをwebブラウザから使うまでの難所攻略
emscriptenでC/C++プログラムをwebブラウザから使うまでの難所攻略祐司 伊藤
 

More Related Content

What's hot

15分でCakePHPを始める方法(Nseg 2013-11-09 )
15分でCakePHPを始める方法(Nseg 2013-11-09 )15分でCakePHPを始める方法(Nseg 2013-11-09 )
15分でCakePHPを始める方法(Nseg 2013-11-09 )hiro345
 
Perl logging
Perl loggingPerl logging
Perl loggingkeroyonn
 
成長を加速する minne の技術基盤戦略
成長を加速する minne の技術基盤戦略成長を加速する minne の技術基盤戦略
成長を加速する minne の技術基盤戦略Hiroshi SHIBATA
 
Perl Hobby Programming - Games::BeLike::EightBIT ターミナルで8ビット風ゲームをつくろう
Perl Hobby Programming - Games::BeLike::EightBIT ターミナルで8ビット風ゲームをつくろうPerl Hobby Programming - Games::BeLike::EightBIT ターミナルで8ビット風ゲームをつくろう
Perl Hobby Programming - Games::BeLike::EightBIT ターミナルで8ビット風ゲームをつくろうkeroyonn
 
ADO.NETとORMとMicro-ORM -dapper dot netを使ってみた
ADO.NETとORMとMicro-ORM -dapper dot netを使ってみたADO.NETとORMとMicro-ORM -dapper dot netを使ってみた
ADO.NETとORMとMicro-ORM -dapper dot netを使ってみたNarami Kiyokura
 
GoCon 2015 Summer GoのASTをいじくって新しいツールを作る
GoCon 2015 Summer GoのASTをいじくって新しいツールを作るGoCon 2015 Summer GoのASTをいじくって新しいツールを作る
GoCon 2015 Summer GoのASTをいじくって新しいツールを作るMasahiro Wakame
 
How Smalltalker Works
How Smalltalker WorksHow Smalltalker Works
How Smalltalker WorksSho Yoshida
 
CodeIgniter入門
CodeIgniter入門CodeIgniter入門
CodeIgniter入門Sho A
 
CMSとPerlで遊ぼう
CMSとPerlで遊ぼうCMSとPerlで遊ぼう
CMSとPerlで遊ぼうDaiki Ichinose
 
UnrealEngineが5日間でasm.js化できたと聞いた俺たちは…
UnrealEngineが5日間でasm.js化できたと聞いた俺たちは…UnrealEngineが5日間でasm.js化できたと聞いた俺たちは…
UnrealEngineが5日間でasm.js化できたと聞いた俺たちは…Kei Nakazawa
 
CGI::Application::Dispatch
CGI::Application::DispatchCGI::Application::Dispatch
CGI::Application::DispatchHideo Kimura
 
CPANの依存モジュールをもう少し正しく検出したい
CPANの依存モジュールをもう少し正しく検出したいCPANの依存モジュールをもう少し正しく検出したい
CPANの依存モジュールをもう少し正しく検出したいcharsbar
 
Web Operations and Perl kansai.pm#14
Web Operations and Perl kansai.pm#14Web Operations and Perl kansai.pm#14
Web Operations and Perl kansai.pm#14Masahiro Nagano
 
サバカン屋のサバ缶はre:Inventで通用したのか&すぐに使える!最新運用ネタ #re:Port2016
サバカン屋のサバ缶はre:Inventで通用したのか&すぐに使える!最新運用ネタ #re:Port2016サバカン屋のサバ缶はre:Inventで通用したのか&すぐに使える!最新運用ネタ #re:Port2016
サバカン屋のサバ缶はre:Inventで通用したのか&すぐに使える!最新運用ネタ #re:Port2016Kohei Hoshi
 
ChefとPuppetの比較
ChefとPuppetの比較ChefとPuppetの比較
ChefとPuppetの比較Sugawara Genki
 

What's hot (20)

Zabbix API
Zabbix APIZabbix API
Zabbix API
 
15分でCakePHPを始める方法(Nseg 2013-11-09 )
15分でCakePHPを始める方法(Nseg 2013-11-09 )15分でCakePHPを始める方法(Nseg 2013-11-09 )
15分でCakePHPを始める方法(Nseg 2013-11-09 )
 
Perl logging
Perl loggingPerl logging
Perl logging
 
成長を加速する minne の技術基盤戦略
成長を加速する minne の技術基盤戦略成長を加速する minne の技術基盤戦略
成長を加速する minne の技術基盤戦略
 
Perl Hobby Programming - Games::BeLike::EightBIT ターミナルで8ビット風ゲームをつくろう
Perl Hobby Programming - Games::BeLike::EightBIT ターミナルで8ビット風ゲームをつくろうPerl Hobby Programming - Games::BeLike::EightBIT ターミナルで8ビット風ゲームをつくろう
Perl Hobby Programming - Games::BeLike::EightBIT ターミナルで8ビット風ゲームをつくろう
 
ADO.NETとORMとMicro-ORM -dapper dot netを使ってみた
ADO.NETとORMとMicro-ORM -dapper dot netを使ってみたADO.NETとORMとMicro-ORM -dapper dot netを使ってみた
ADO.NETとORMとMicro-ORM -dapper dot netを使ってみた
 
GoCon 2015 Summer GoのASTをいじくって新しいツールを作る
GoCon 2015 Summer GoのASTをいじくって新しいツールを作るGoCon 2015 Summer GoのASTをいじくって新しいツールを作る
GoCon 2015 Summer GoのASTをいじくって新しいツールを作る
 
Scala on Hadoop
Scala on HadoopScala on Hadoop
Scala on Hadoop
 
How Smalltalker Works
How Smalltalker WorksHow Smalltalker Works
How Smalltalker Works
 
CodeIgniter入門
CodeIgniter入門CodeIgniter入門
CodeIgniter入門
 
Using Dancer
Using DancerUsing Dancer
Using Dancer
 
Puppet on AWS
Puppet on AWSPuppet on AWS
Puppet on AWS
 
CMSとPerlで遊ぼう
CMSとPerlで遊ぼうCMSとPerlで遊ぼう
CMSとPerlで遊ぼう
 
UnrealEngineが5日間でasm.js化できたと聞いた俺たちは…
UnrealEngineが5日間でasm.js化できたと聞いた俺たちは…UnrealEngineが5日間でasm.js化できたと聞いた俺たちは…
UnrealEngineが5日間でasm.js化できたと聞いた俺たちは…
 
CGI::Application::Dispatch
CGI::Application::DispatchCGI::Application::Dispatch
CGI::Application::Dispatch
 
Using Windows Azure
Using Windows AzureUsing Windows Azure
Using Windows Azure
 
CPANの依存モジュールをもう少し正しく検出したい
CPANの依存モジュールをもう少し正しく検出したいCPANの依存モジュールをもう少し正しく検出したい
CPANの依存モジュールをもう少し正しく検出したい
 
Web Operations and Perl kansai.pm#14
Web Operations and Perl kansai.pm#14Web Operations and Perl kansai.pm#14
Web Operations and Perl kansai.pm#14
 
サバカン屋のサバ缶はre:Inventで通用したのか&すぐに使える!最新運用ネタ #re:Port2016
サバカン屋のサバ缶はre:Inventで通用したのか&すぐに使える!最新運用ネタ #re:Port2016サバカン屋のサバ缶はre:Inventで通用したのか&すぐに使える!最新運用ネタ #re:Port2016
サバカン屋のサバ缶はre:Inventで通用したのか&すぐに使える!最新運用ネタ #re:Port2016
 
ChefとPuppetの比較
ChefとPuppetの比較ChefとPuppetの比較
ChefとPuppetの比較
 

Similar to SmartPhone development guide with CoffeeScript + Node + HTML5 Technology, for Perl Programmers

13016 n分で作るtype scriptでnodejs
13016 n分で作るtype scriptでnodejs13016 n分で作るtype scriptでnodejs
13016 n分で作るtype scriptでnodejsTakayoshi Tanaka
 
2016/12/17 ASP.NET フロントエンドタスク入門
 2016/12/17 ASP.NET フロントエンドタスク入門 2016/12/17 ASP.NET フロントエンドタスク入門
2016/12/17 ASP.NET フロントエンドタスク入門miso- soup3
 
Node予備校 vol.1 名古屋
Node予備校 vol.1 名古屋Node予備校 vol.1 名古屋
Node予備校 vol.1 名古屋Mori Shingo
 
泥臭い運用から、プログラマブルインフラ構築(に行きたい)
泥臭い運用から、プログラマブルインフラ構築(に行きたい) 泥臭い運用から、プログラマブルインフラ構築(に行きたい)
泥臭い運用から、プログラマブルインフラ構築(に行きたい) Akihiro Kuwano
 
node+socket.io+enchant.jsでチャットゲーを作る
node+socket.io+enchant.jsでチャットゲーを作るnode+socket.io+enchant.jsでチャットゲーを作る
node+socket.io+enchant.jsでチャットゲーを作るKiyoshi SATOH
 
Node.jsとAWS入門(Elastic Beanstalk & AWS SDK for Node.js)
Node.jsとAWS入門(Elastic Beanstalk & AWS SDK for Node.js)Node.jsとAWS入門(Elastic Beanstalk & AWS SDK for Node.js)
Node.jsとAWS入門(Elastic Beanstalk & AWS SDK for Node.js)崇之 清水
 
Backlogでの Perlのつかいかた
Backlogでの PerlのつかいかたBacklogでの Perlのつかいかた
Backlogでの PerlのつかいかたRyuzo Yamamoto
 
Isomorphic web development with scala and scala.js
Isomorphic web development  with scala and scala.jsIsomorphic web development  with scala and scala.js
Isomorphic web development with scala and scala.jsTanUkkii
 
WebAssemblyとBlazor 、WebAssembly System Interfaceでコンテナライズの設計を解説
WebAssemblyとBlazor 、WebAssembly System Interfaceでコンテナライズの設計を解説WebAssemblyとBlazor 、WebAssembly System Interfaceでコンテナライズの設計を解説
WebAssemblyとBlazor 、WebAssembly System Interfaceでコンテナライズの設計を解説Takao Tetsuro
 
名古屋Ruby会議01 A3.製造業向け3Dデータ変換ソリューションにおけるRuby活用事例
名古屋Ruby会議01 A3.製造業向け3Dデータ変換ソリューションにおけるRuby活用事例名古屋Ruby会議01 A3.製造業向け3Dデータ変換ソリューションにおけるRuby活用事例
名古屋Ruby会議01 A3.製造業向け3Dデータ変換ソリューションにおけるRuby活用事例Shigeru UCHIYAMA
 
LambdaとMobileの美味しいかもしれない関係
LambdaとMobileの美味しいかもしれない関係LambdaとMobileの美味しいかもしれない関係
LambdaとMobileの美味しいかもしれない関係Hiraku Komuro
 
scala+liftで遊ぼう
scala+liftで遊ぼうscala+liftで遊ぼう
scala+liftで遊ぼうyouku
 
TerraformでECS+ECRする話
TerraformでECS+ECRする話TerraformでECS+ECRする話
TerraformでECS+ECRする話Satoshi Hirayama
 
Build 番号の自動更新スクリプトについて #cocoa_kansai
Build 番号の自動更新スクリプトについて #cocoa_kansaiBuild 番号の自動更新スクリプトについて #cocoa_kansai
Build 番号の自動更新スクリプトについて #cocoa_kansaiTomohiro Kumagai
 

Similar to SmartPhone development guide with CoffeeScript + Node + HTML5 Technology, for Perl Programmers (20)

13016 n分で作るtype scriptでnodejs
13016 n分で作るtype scriptでnodejs13016 n分で作るtype scriptでnodejs
13016 n分で作るtype scriptでnodejs
 
SocketStream入門
SocketStream入門SocketStream入門
SocketStream入門
 
2016/12/17 ASP.NET フロントエンドタスク入門
 2016/12/17 ASP.NET フロントエンドタスク入門 2016/12/17 ASP.NET フロントエンドタスク入門
2016/12/17 ASP.NET フロントエンドタスク入門
 
Node予備校 vol.1 名古屋
Node予備校 vol.1 名古屋Node予備校 vol.1 名古屋
Node予備校 vol.1 名古屋
 
つぶLT20121215
つぶLT20121215つぶLT20121215
つぶLT20121215
 
Nodejs
NodejsNodejs
Nodejs
 
泥臭い運用から、プログラマブルインフラ構築(に行きたい)
泥臭い運用から、プログラマブルインフラ構築(に行きたい) 泥臭い運用から、プログラマブルインフラ構築(に行きたい)
泥臭い運用から、プログラマブルインフラ構築(に行きたい)
 
HTML5&API総まくり
HTML5&API総まくりHTML5&API総まくり
HTML5&API総まくり
 
いまさらJavaScript
いまさらJavaScriptいまさらJavaScript
いまさらJavaScript
 
node+socket.io+enchant.jsでチャットゲーを作る
node+socket.io+enchant.jsでチャットゲーを作るnode+socket.io+enchant.jsでチャットゲーを作る
node+socket.io+enchant.jsでチャットゲーを作る
 
densan2014-late01
densan2014-late01densan2014-late01
densan2014-late01
 
Node.jsとAWS入門(Elastic Beanstalk & AWS SDK for Node.js)
Node.jsとAWS入門(Elastic Beanstalk & AWS SDK for Node.js)Node.jsとAWS入門(Elastic Beanstalk & AWS SDK for Node.js)
Node.jsとAWS入門(Elastic Beanstalk & AWS SDK for Node.js)
 
Backlogでの Perlのつかいかた
Backlogでの PerlのつかいかたBacklogでの Perlのつかいかた
Backlogでの Perlのつかいかた
 
Isomorphic web development with scala and scala.js
Isomorphic web development  with scala and scala.jsIsomorphic web development  with scala and scala.js
Isomorphic web development with scala and scala.js
 
WebAssemblyとBlazor 、WebAssembly System Interfaceでコンテナライズの設計を解説
WebAssemblyとBlazor 、WebAssembly System Interfaceでコンテナライズの設計を解説WebAssemblyとBlazor 、WebAssembly System Interfaceでコンテナライズの設計を解説
WebAssemblyとBlazor 、WebAssembly System Interfaceでコンテナライズの設計を解説
 
名古屋Ruby会議01 A3.製造業向け3Dデータ変換ソリューションにおけるRuby活用事例
名古屋Ruby会議01 A3.製造業向け3Dデータ変換ソリューションにおけるRuby活用事例名古屋Ruby会議01 A3.製造業向け3Dデータ変換ソリューションにおけるRuby活用事例
名古屋Ruby会議01 A3.製造業向け3Dデータ変換ソリューションにおけるRuby活用事例
 
LambdaとMobileの美味しいかもしれない関係
LambdaとMobileの美味しいかもしれない関係LambdaとMobileの美味しいかもしれない関係
LambdaとMobileの美味しいかもしれない関係
 
scala+liftで遊ぼう
scala+liftで遊ぼうscala+liftで遊ぼう
scala+liftで遊ぼう
 
TerraformでECS+ECRする話
TerraformでECS+ECRする話TerraformでECS+ECRする話
TerraformでECS+ECRする話
 
Build 番号の自動更新スクリプトについて #cocoa_kansai
Build 番号の自動更新スクリプトについて #cocoa_kansaiBuild 番号の自動更新スクリプトについて #cocoa_kansai
Build 番号の自動更新スクリプトについて #cocoa_kansai
 

More from Naoya Ito

Web-Gakkai Symposium 2010
Web-Gakkai Symposium 2010Web-Gakkai Symposium 2010
Web-Gakkai Symposium 2010Naoya Ito
 
はてなブックマークのシステムについて
はてなブックマークのシステムについてはてなブックマークのシステムについて
はてなブックマークのシステムについてNaoya Ito
 
Perlで圧縮
Perlで圧縮Perlで圧縮
Perlで圧縮Naoya Ito
 
Introduction to Algorithms#24 Shortest-Paths Problem
Introduction to Algorithms#24 Shortest-Paths ProblemIntroduction to Algorithms#24 Shortest-Paths Problem
Introduction to Algorithms#24 Shortest-Paths ProblemNaoya Ito
 
090518computing Huffman Code Length
090518computing Huffman Code Length090518computing Huffman Code Length
090518computing Huffman Code LengthNaoya Ito
 
スペルミス修正プログラムを作ろう
スペルミス修正プログラムを作ろうスペルミス修正プログラムを作ろう
スペルミス修正プログラムを作ろうNaoya Ito
 
Dijkstra Algorithm
Dijkstra AlgorithmDijkstra Algorithm
Dijkstra AlgorithmNaoya Ito
 
OGC2009 はてなブックマークについて
OGC2009 はてなブックマークについてOGC2009 はてなブックマークについて
OGC2009 はてなブックマークについてNaoya Ito
 
How to read linux kernel
How to read linux kernelHow to read linux kernel
How to read linux kernelNaoya Ito
 
Introduction To Moco
Introduction To MocoIntroduction To Moco
Introduction To MocoNaoya Ito
 

More from Naoya Ito (10)

Web-Gakkai Symposium 2010
Web-Gakkai Symposium 2010Web-Gakkai Symposium 2010
Web-Gakkai Symposium 2010
 
はてなブックマークのシステムについて
はてなブックマークのシステムについてはてなブックマークのシステムについて
はてなブックマークのシステムについて
 
Perlで圧縮
Perlで圧縮Perlで圧縮
Perlで圧縮
 
Introduction to Algorithms#24 Shortest-Paths Problem
Introduction to Algorithms#24 Shortest-Paths ProblemIntroduction to Algorithms#24 Shortest-Paths Problem
Introduction to Algorithms#24 Shortest-Paths Problem
 
090518computing Huffman Code Length
090518computing Huffman Code Length090518computing Huffman Code Length
090518computing Huffman Code Length
 
スペルミス修正プログラムを作ろう
スペルミス修正プログラムを作ろうスペルミス修正プログラムを作ろう
スペルミス修正プログラムを作ろう
 
Dijkstra Algorithm
Dijkstra AlgorithmDijkstra Algorithm
Dijkstra Algorithm
 
OGC2009 はてなブックマークについて
OGC2009 はてなブックマークについてOGC2009 はてなブックマークについて
OGC2009 はてなブックマークについて
 
How to read linux kernel
How to read linux kernelHow to read linux kernel
How to read linux kernel
 
Introduction To Moco
Introduction To MocoIntroduction To Moco
Introduction To Moco
 

Recently uploaded

COPY FROMで異常データをスキップできるようになった話(第45回 PostgreSQLアンカンファレンス@オンライン 発表資料)
COPY FROMで異常データをスキップできるようになった話(第45回 PostgreSQLアンカンファレンス@オンライン 発表資料)COPY FROMで異常データをスキップできるようになった話(第45回 PostgreSQLアンカンファレンス@オンライン 発表資料)
COPY FROMで異常データをスキップできるようになった話(第45回 PostgreSQLアンカンファレンス@オンライン 発表資料)NTT DATA Technology & Innovation
 
HarukiShinkawa_果樹農家が期待する行動への変容を促す仕掛け設計のための収穫作業体験者の行動観察とモデル化_仕掛学2024.pdf
HarukiShinkawa_果樹農家が期待する行動への変容を促す仕掛け設計のための収穫作業体験者の行動観察とモデル化_仕掛学2024.pdfHarukiShinkawa_果樹農家が期待する行動への変容を促す仕掛け設計のための収穫作業体験者の行動観察とモデル化_仕掛学2024.pdf
HarukiShinkawa_果樹農家が期待する行動への変容を促す仕掛け設計のための収穫作業体験者の行動観察とモデル化_仕掛学2024.pdfMatsushita Laboratory
 
20240222_Neko_IoTLT_vol9_kitazaki_v1.pdf
20240222_Neko_IoTLT_vol9_kitazaki_v1.pdf20240222_Neko_IoTLT_vol9_kitazaki_v1.pdf
20240222_Neko_IoTLT_vol9_kitazaki_v1.pdfAyachika Kitazaki
 
scikit-learn以外の分類器でpipelineを作ってみた! いずみん
scikit-learn以外の分類器でpipelineを作ってみた! いずみんscikit-learn以外の分類器でpipelineを作ってみた! いずみん
scikit-learn以外の分類器でpipelineを作ってみた! いずみんtoshinori622
 
オリジナルNFTを発行するブロックチェーン開発ハンズオン(NFTの発行に必要なツールから実装まで)
オリジナルNFTを発行するブロックチェーン開発ハンズオン(NFTの発行に必要なツールから実装まで)オリジナルNFTを発行するブロックチェーン開発ハンズオン(NFTの発行に必要なツールから実装まで)
オリジナルNFTを発行するブロックチェーン開発ハンズオン(NFTの発行に必要なツールから実装まで)Kanta Sasaki
 
20240227 完全に理解した LT 「mise いいよ mise」 / morishin
20240227 完全に理解した LT 「mise いいよ mise」 / morishin20240227 完全に理解した LT 「mise いいよ mise」 / morishin
20240227 完全に理解した LT 「mise いいよ mise」 / morishinMakoto Mori
 
00001_test_automation_portfolio_20240227
00001_test_automation_portfolio_2024022700001_test_automation_portfolio_20240227
00001_test_automation_portfolio_20240227ssuserf8ea02
 
解説: Token Extensions - Solana Developer Hub Online #SolDevHub
解説: Token Extensions - Solana Developer Hub Online #SolDevHub解説: Token Extensions - Solana Developer Hub Online #SolDevHub
解説: Token Extensions - Solana Developer Hub Online #SolDevHubK Kinzal
 

Recently uploaded (8)

COPY FROMで異常データをスキップできるようになった話(第45回 PostgreSQLアンカンファレンス@オンライン 発表資料)
COPY FROMで異常データをスキップできるようになった話(第45回 PostgreSQLアンカンファレンス@オンライン 発表資料)COPY FROMで異常データをスキップできるようになった話(第45回 PostgreSQLアンカンファレンス@オンライン 発表資料)
COPY FROMで異常データをスキップできるようになった話(第45回 PostgreSQLアンカンファレンス@オンライン 発表資料)
 
HarukiShinkawa_果樹農家が期待する行動への変容を促す仕掛け設計のための収穫作業体験者の行動観察とモデル化_仕掛学2024.pdf
HarukiShinkawa_果樹農家が期待する行動への変容を促す仕掛け設計のための収穫作業体験者の行動観察とモデル化_仕掛学2024.pdfHarukiShinkawa_果樹農家が期待する行動への変容を促す仕掛け設計のための収穫作業体験者の行動観察とモデル化_仕掛学2024.pdf
HarukiShinkawa_果樹農家が期待する行動への変容を促す仕掛け設計のための収穫作業体験者の行動観察とモデル化_仕掛学2024.pdf
 
20240222_Neko_IoTLT_vol9_kitazaki_v1.pdf
20240222_Neko_IoTLT_vol9_kitazaki_v1.pdf20240222_Neko_IoTLT_vol9_kitazaki_v1.pdf
20240222_Neko_IoTLT_vol9_kitazaki_v1.pdf
 
scikit-learn以外の分類器でpipelineを作ってみた! いずみん
scikit-learn以外の分類器でpipelineを作ってみた! いずみんscikit-learn以外の分類器でpipelineを作ってみた! いずみん
scikit-learn以外の分類器でpipelineを作ってみた! いずみん
 
オリジナルNFTを発行するブロックチェーン開発ハンズオン(NFTの発行に必要なツールから実装まで)
オリジナルNFTを発行するブロックチェーン開発ハンズオン(NFTの発行に必要なツールから実装まで)オリジナルNFTを発行するブロックチェーン開発ハンズオン(NFTの発行に必要なツールから実装まで)
オリジナルNFTを発行するブロックチェーン開発ハンズオン(NFTの発行に必要なツールから実装まで)
 
20240227 完全に理解した LT 「mise いいよ mise」 / morishin
20240227 完全に理解した LT 「mise いいよ mise」 / morishin20240227 完全に理解した LT 「mise いいよ mise」 / morishin
20240227 完全に理解した LT 「mise いいよ mise」 / morishin
 
00001_test_automation_portfolio_20240227
00001_test_automation_portfolio_2024022700001_test_automation_portfolio_20240227
00001_test_automation_portfolio_20240227
 
解説: Token Extensions - Solana Developer Hub Online #SolDevHub
解説: Token Extensions - Solana Developer Hub Online #SolDevHub解説: Token Extensions - Solana Developer Hub Online #SolDevHub
解説: Token Extensions - Solana Developer Hub Online #SolDevHub
 

SmartPhone development guide with CoffeeScript + Node + HTML5 Technology, for Perl Programmers

  • 2. キーワード • PhoneGap • Titanium Mobile • CoffeeScript • Node.js • Socket.IO • Express • npm • …
  • 9. ネイティブと Web App のハイブリッドへ • HTML5アプリケーションをネイティブで補う... • ネイティブをWeb技術 (スクリプト言語) で作る...
  • 10. アジェンダ • クライアントサイド • PhoneGap • Titanium Mobile • Scripting Layer for Android • サーバーサイド • Node or Perl
  • 11. PhoneGap, Titanium Mobile, Scripting Layer for Android クライアントサイド
  • 12. スクリプト言語で iOS/Android アプリ • HTML5 • Web開発、同様スクリプト言語で書きたい! • JavaScript, CoffeeScript • スクリプト言語な俺たち歓喜 \(^o^)/ • Perl で書ける?
  • 14. PhoneGap • UIWebView ベースのアプリ開発 F/W • JavaScript / HTML / CSS • UIWebView の js に Native Bridge な API • Phone"Gap" navigator.camera.getPictures(onSuccess, onFail) onSuccess = function (base64data) { var img = document.getElementById('myImage'); img.src = "data:image/jpeg;base64;" + base64data; }
  • 15. 例: Photo Receiver • PhoneGap (+ jQuery mobile) + Node (+ Express + Socket.IO) WebSocket (Socket.IO) iOS app with PhoneGap Node
  • 16. Photo Receiver (sender, index.html) <html> <head> ... <script type="text/javascript" src="phonegap-1.0.0.js"></script> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="socket.io.min.js"></script> ... <script type="text/javascript" src="sender.js"></script> </head> <body> <div data-role="page"> <div data-role="header" data-theme="b"> <h1>Photo Sender</h1> </div> ...
  • 17. Photo Receiver (sender, sender.coffee) onDeviceReady = -> socket = io.connect 'http://localhost:3000/sender' onSuccess = (data) -> socket.emit 'pushPhoto', data ... $('#camera').click -> navigator.camera.getPicture onSuccess, onFailure, opt $(document).ready -> $(document).bind 'deviceready', onDeviceReady # sender.coffee の変更を watch → sender.js を生成 $ coffee -cw *.coffee
  • 18. Photo Receiver (receiver, app.coffee) express = require "express" app = module.exports = express.createServer() app.get "/", (req, res) -> res.render "index", title: "Photo Receiver" app.listen 3000 io = require('socket.io').listen app sender = io.of('/sender').on 'connection', (socket) -> socket.on 'pushPhoto', (data) -> data_uri = "data:image/jpeg;base64," + data receiver.emit 'showPhoto', data_uri
  • 19. PhoneGap あれこれ • HTML + JS = "HTML5 ready" • jQuery / jQuery mobile • CoffeeScript • socket.io • sass, less, stylus • Facebook/Google+ と似ているが... • UIKit の制御は bridge しない • UIWebView は Safari より遅い • UIWebView = not Nitro • JITコンパイラなし • Adobe が買収 • Native → HTML5 アプローチとして PhoneGap モデルは有力
  • 21. Titanium Mobile • ネイティブアプリを JavaScript で • Titanium Studio でビルド • インタプリタ上で動く • iOS : JavascriptCore / Android : Rhino • JSエンジンがUIKitを操作 • 動的に動作確認できる
  • 23. Cover Flow win = Ti.UI.currentWindow() view = Ti.UI.createCoverFlowView images: [ '../images/01.jpg' '../images/02.jpg' '../images/03.jpg' '../images/04.jpg' '../images/05.jpg' ] backgroundColor: '#000' win.add view
  • 24. 例: HBFav https://github.com/naoya/HBFav
  • 25. HBFav • クライアント • Titanium Mobile • CoffeeScript • サーバー • Node.js • Express • xml2json • Heroku
  • 26. HBFav コード断片 require 'lib/underscore' Ti.include 'feed.js' class AbstractState toString : () -> 'AbstractState' constructor: (@feedView) -> getFeed : (url) -> self = @ onload = @.onload onerror = @.onerror xhr = Ti.Network.createHTTPClient() xhr.timeout = 100000 xhr.open 'GET', url xhr.onload = -> data = JSON.parse @.responseText onload.apply(self, [ data ]) xhr.onload = null xhr.onerror = null xhr = null xhr.onerror = (err) -> onerror.apply(self, [ err ]) xhr.send()
  • 27. Titanium Mobile あれこれ • JavaScript ready • CoffeeScript • CommonJS ・・・ underscore, socket.io etc. • Titanium Mobile != HTML5 • JavaScript だからといって HTML5 へ向かってるわけではない • 「JS でネイティブ書ける」 • 現時点では、現実的な解 • 実用的だが当然、トレードオフも – メモリ管理不要、ダイナミック更新、ラピッドに開発可 – ネイティブとは速度差 / 細かなチューニングが難しい – デバッグ環境がこなれていない
  • 28. Scripting Layer for Android (SL4A) • Androidアプリを Perl で • ここは YAPC だぜ? use Android my $android = Android->new; $android->makeToast( "Hello, Android!" );
  • 29. SL4A • PhoneGap, Titanium とも別アプローチ • Java アプリが "Scripting Layer" と JSON-RPC で通信 • Java アプリのAPIがネイティブの機能をブリッジ • 本格的なアプリを作るのには向かない • 速度、安定性...
  • 30. クライアントサイドまとめ • JavaScript によるネイティブブリッジFWは発展途上 • この方向性のフレームワークは増える • PhoneGap, Titanium Mobile は"そこそこ" 実用的 • ※ debug しんどい • Facebook/G+ の言う "Embedded Web Views" のFWはまだ • UIWebView アプリを作りつつ • ネイティブの "UI" と橋渡し • Perl でクライアントサイドは、さすがに ... • SL4A はおもちゃの領域を出ない
  • 32. サーバサイド • これまで通り Perl で書いても良いですが・・・ • クライアントを JS で、なら、サーバも JSで • この流れは止められない • Node.js : server-side JavaScript が現実的に
  • 33. Node.js • Perl と比較しながら見ていきたい
  • 34. perl vs Node Perl Node.js プリプロセッサ N/A CoffeeScript 言語 Perl言語 JavaScript 実行環境 perlインタプリタ node ウェブ実行環境 mod_perl, PSGI http.Server, connect etc. middleware, etc. Web Framework Catalyst, Mojolicious::Lite, Express, etc. Dancer etc. パッケージ管理 cpan npm 主なWebアプリのモデル prefork (同期) Single Process Event Driven (非同期)
  • 35. Node.js • Single Process Event Driven な server-side JavaScript Engine – Perl : POE, AnyEvent http = require 'http' http.createServer (req, res) -> res.writeHead 200, 'Content-Type':'text/plain' res.end 'Hello World!¥n' .listen 8080 % node-dev hello.coffee • Perl でできないことをやってるわけではない • 一方の「手軽さ」、JavaScript との相性
  • 36. npm $ npm install express cpanm Mojolicious::Lite
  • 38. underscore.js require 'underscore' pow = _([1, 2, 3]).map (n) -> n * 2 max = _([1, 2, 3]).max() sum = _([1, 2, 3]).reduce (memo, num) -> memo + num use List::Util qw/max reduce/; my $pow = map { $_ * 2 } (1, 2, 3); my $sum = reduce { $a + $b } (1, 2, 3); my $max = max(1, 2, 3);
  • 39. Express • Web framework, Sinatra inspired • Perl ... Mojolicious::Lite etc • SASS/LESS/Stylus, Coffee, Jade/EJS, Socket.IO ready – emerging web technologies... express = require "express" app = module.exports = express.createServer() app.configure -> app.set 'view engine', "jade" app.use express.compiler src: __dirname + "/public" enable: [ "sass" ] app.get "/", (req, res) -> res.render "index", title: "Hello, Express"
  • 40. vows • Perl : Test::More, Test::Base, Test::Declare • vows : Asynchronous BDD vows = require 'vows' assert = require 'assert' test = vows.describe('ゼロでの割り算').addBatch '任意の数をゼロで割った時' : topic: -> 42 / 0 '無限大になる' : (topic) -> assert.equal topic, Infinity 'ただし、ゼロをゼロで割った場合' topic: -> 0/ 0 '以下となる' : '数値でない' : (topic) -> assert.isNan topic '自分自身とは等価でない' : -> assert.notEqual topic, topic do test.run
  • 41. xml2js • Perl : XML::Simple + JSON parser = new xml2js.Parser() parser.addListener 'end', (json) -> console.log json parser.parseString xml
  • 42. aws-lib • Perl : Net::Amazon aws = require 'aws-lib' aws = aws.createProdAdvClient( accessKey, secretKey, associateId, region: "JP" host: 'ecs.amazonaws.jp' ) aws.call "ItemSearch", SearchIndex: "Books" Title: "Perl" ItemPage: 1 ResponseGroup: 'Medium' (result) -> console.log result
  • 43. Node modules https://github.com/joyent/node/wiki/modules
  • 44. Socket.IO • WebSocket-like API – 抽象化 : WebSocket, xhr-polling, xhr-multipart, jsonp-polling .... • Node.js の急先鋒 /* client (jade w/ express) */ /* server (app = express object) */ script(src='/socket.io/socket.io.js') io = require('socket.io').listen app io.sockets.on 'connection', (socket) -> :coffeescript socket.on 'send', (data) -> socket = io.connect 'http://localhost’ console.log data socket.on 'recv', (data) -> socket.emit 'recv', data console.log data socket.emit 'send', "Hello!"
  • 45. pocketio • Perl の Socket.IO server – JS ⇔ Perl – JS ⇔ Perl ⇔ Perl modules use PocketIO; use Plack::Builder; builder { mount '/socket.io' => PocketIO->new handler => sub { my $self = shift; $self->on( 'recv' => sub { my ($socket, $data) = @_; $socket->emit('send', $data); }); ...
  • 46. サーバサイドまとめ • Node きてる – スマートフォン開発のバックエンドを Node にする"必然性"はないが – クライアントを JS / Coffee で書くなら"優位性"はある • npm++ • CommonJS ウマー • node ・・・ 新しいn実装が多い • Socket.IO • CSS frameworks • 一方の perl ・・・ 莫大な資産 = CPAN • node / perl の pro/cons を比較して • (1) アーキテクチャ • 共存させるアプローチ ・・・ RPC, pocketio
  • 47. まとめ • スマートフォン : 今後、ネイティブからHTML5へ • Facebook/Google+ • × 100% HTML5 ○ ハイブリッド • JS (Coffee) のみでアプリが開発できるように • PhoneGap, Titanium Mobile • クライアントからサーバまで一気通関 • クライアントが JS なら、Node 利用の動機は大きい • Native → HTML5 への移行は JavaScript の進化にアリ • Node.js = Web Dev の梁山泊に (beyond Rails...?) • socket.IO / express / jade, stylus, coffeekup, CSS FW / coffee ... • ただし、Node だけではサポートできない領域もまだまだ • Perl の莫大な資産は活かしたい • pocketio などのアプローチ