Upload
yutaro-miyazaki
View
1.001
Download
0
Embed Size (px)
Citation preview
WordPress とモバイルとbrowser-sync と部屋とYシャツと私
� 優太朗○ 優太郎
• 就職できずにニートとして落ちぶれ• WordPress Community に出会う• 独学で Web の勉強• 現在 Web 3年目• ややひきこもり系ウェブクリエイター• WP-E(仮)では “ハマチ”• WordCamp Tokyo 2014 Web制作班班長• Schoo WordCommunity Channel #3• 仕事は常に募集中
About Yutaro Miyazaki
WP-E
よろしくね
モバイルサイトの開発
実機ですか
UA ですか
Emulator ですか
デザインカンプ↓html↓
WordPress 化
ダルい
モバイル向けだと特に構築からチェックまで
一貫して
ダルい
そんな時におすすめしたい
browser-sync
Web デザイナー
と言うことは
browser-syncが使いたくなる3つの理由1. Server2. Reload & Inject3. ghostMode
1. Server
1. Server
1. Server
え、それだけ?
ghost
gulp-connect
grunt-contrib-connectexpress-server
http-server
Local Server にも繋げる
1. Server
wordpress.dev
1. Server
デモる
1. Server同一ネットワークにいれば外部機器からも接続できるけど…
VLAN 下では外部機器から接続出来ない公衆無線 LAN とかでの使用は余りお勧めしないポケット Wi-Fi / 自宅が最強
2. LiveReload & Inject
• .php が、 LiveReload のトリガーにできる• 但し LiveReload はちと遅い• CSS や JS 等、DOM を再構築する必要の無いときは• 新しいプロパティをブラウザに知らせる → Inject
デモる
3. ghostMode
ガオー
デモる
WordPress の構築モバイルサイト構築
スピードアップすることうけあい
GitHub 見れば、サンプルが沢山
http://youtu.be/Blqaio9HaHA
デモの部分はこの動画で補完できます
ありがとうございました