20120827勉強会 webアプリ作ってみた2
-
Upload
shugo-numano -
Category
Technology
-
view
101 -
download
1
description
Transcript of 20120827勉強会 webアプリ作ってみた2
![Page 1: 20120827勉強会 webアプリ作ってみた2](https://reader031.fdocuments.net/reader031/viewer/2022020105/5482abc0b4af9fa50d8b4873/html5/thumbnails/1.jpg)
webアプリ作ってみた その2
@shugonumano 2014/8/27
![Page 2: 20120827勉強会 webアプリ作ってみた2](https://reader031.fdocuments.net/reader031/viewer/2022020105/5482abc0b4af9fa50d8b4873/html5/thumbnails/2.jpg)
はじめに
![Page 3: 20120827勉強会 webアプリ作ってみた2](https://reader031.fdocuments.net/reader031/viewer/2022020105/5482abc0b4af9fa50d8b4873/html5/thumbnails/3.jpg)
前回からの差分ロゴ多言語
利用規約
![Page 4: 20120827勉強会 webアプリ作ってみた2](https://reader031.fdocuments.net/reader031/viewer/2022020105/5482abc0b4af9fa50d8b4873/html5/thumbnails/4.jpg)
前回からの差分(Con’t)
web fonttutorial
![Page 5: 20120827勉強会 webアプリ作ってみた2](https://reader031.fdocuments.net/reader031/viewer/2022020105/5482abc0b4af9fa50d8b4873/html5/thumbnails/5.jpg)
前回からの差分(Con’t)
Heroku addon • Treasure Data • Hosted Graphite !
WebSocket
![Page 6: 20120827勉強会 webアプリ作ってみた2](https://reader031.fdocuments.net/reader031/viewer/2022020105/5482abc0b4af9fa50d8b4873/html5/thumbnails/6.jpg)
いくつかピックアップ
![Page 7: 20120827勉強会 webアプリ作ってみた2](https://reader031.fdocuments.net/reader031/viewer/2022020105/5482abc0b4af9fa50d8b4873/html5/thumbnails/7.jpg)
ロゴ• ココナラ(coconala.com)を利用
• 1コインで2ロゴを作成
• 内容は人によって様々。今回はおまけつけてくれた
• 自分ではできない部分をサポートしてくれる人が(費用的に)気軽に試せる
![Page 8: 20120827勉強会 webアプリ作ってみた2](https://reader031.fdocuments.net/reader031/viewer/2022020105/5482abc0b4af9fa50d8b4873/html5/thumbnails/8.jpg)
多言語(マルチリンガル)• i18n? l10n?
• rails-i18nを使用https://github.com/svenfuchs/rails-i18n
• 辞書ファイルhttps://github.com/svenfuchs/rails-i18n/tree/master/rails/locale
• 使い方http://morizyun.github.io/blog/i18n-english-rails-ruby-many-languages/
![Page 9: 20120827勉強会 webアプリ作ってみた2](https://reader031.fdocuments.net/reader031/viewer/2022020105/5482abc0b4af9fa50d8b4873/html5/thumbnails/9.jpg)
Facebook Promotion• Facebook Page作成
• Pageの広告枠を購入。想定「いいね」数に応じて、料金メニュー。
• 3日で「100いいね」達成。
• ユーザ属性(国、性別、年齢)、キーワード指定可能。
• 管理画面あり。
![Page 10: 20120827勉強会 webアプリ作ってみた2](https://reader031.fdocuments.net/reader031/viewer/2022020105/5482abc0b4af9fa50d8b4873/html5/thumbnails/10.jpg)
web font • What?「サーバー上にあるフォントファイルを参照するため、ユーザーのPCにインストールされていないフォントを表示可能」
• アイコンで利用。
• bootstrapにもあるが、font-awesomeを利用 http://getbootstrap.com/components/http://fortawesome.github.io/Font-Awesome/
![Page 11: 20120827勉強会 webアプリ作ってみた2](https://reader031.fdocuments.net/reader031/viewer/2022020105/5482abc0b4af9fa50d8b4873/html5/thumbnails/11.jpg)
tutorial(site tour)
• bootstrap-tourを利用。
• 他にもたくさんある。intro.js、trip.js、pageguide.js…http://www.webresourcesdepot.com/11-awesome-jquery-site-tour-plugins-for-guiding-users-with-style/
![Page 12: 20120827勉強会 webアプリ作ってみた2](https://reader031.fdocuments.net/reader031/viewer/2022020105/5482abc0b4af9fa50d8b4873/html5/thumbnails/12.jpg)
残りはあとで、、、• Heroku Addons
• Treasure Data
• Hosted Graphite
• WebSocket https://github.com/websocket-rails/websocket-railshttp://www.school.ctc-g.co.jp/columns/masuidrive/masuidrive14.html
![Page 13: 20120827勉強会 webアプリ作ってみた2](https://reader031.fdocuments.net/reader031/viewer/2022020105/5482abc0b4af9fa50d8b4873/html5/thumbnails/13.jpg)
次回予告• 考え中。。。
• TDで収集したdataを分析して、次のUIを考える
• native appを作成。web viewベース。
• appcelerator Titanium
• Swift
などなど
![Page 14: 20120827勉強会 webアプリ作ってみた2](https://reader031.fdocuments.net/reader031/viewer/2022020105/5482abc0b4af9fa50d8b4873/html5/thumbnails/14.jpg)
参考• Ruby on Rails Tutorialhttp://railstutorial.jp/
• Bootstrap http://getbootstrap.com/
• dotinstall http://dotinstall.com/
• stackoverflow(ぐぐった結果が大体ここ)http://stackoverflow.com/