Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
LiveStyle for Vim - Quick start
Search
Tomokazu Kiyohara
August 24, 2013
Technology
0
120
LiveStyle for Vim - Quick start
LiveStyle for Vim の使い方。
kanazawa.rb meetup 12 発表資料。
Tomokazu Kiyohara
August 24, 2013
Tweet
Share
More Decks by Tomokazu Kiyohara
See All by Tomokazu Kiyohara
読めるかな?ちょっとレアなRubyの記法
kiyohara
0
44
Lightning Talk イベント運営を いいがにやりたい
kiyohara
0
24
首負担皆無!ゼログラビティ プログラミングスタイル
kiyohara
0
340
北陸で Ruby なお仕事に携わるための3つの戦略
kiyohara
1
1.6k
Algolia in CAMPFIRE
kiyohara
0
3.5k
地方エンジニアの日常 - 業務からコミュニティ活動まで
kiyohara
0
280
Web to macOS native app
kiyohara
0
370
金沢アプリ開発塾セミナー資料「テストについて」
kiyohara
1
250
Git インフラ選定事例 - 株式会社クルウィットが GitHub を選んだ理由
kiyohara
0
490
Other Decks in Technology
See All in Technology
君はPostScriptなウィンドウシステム 「NeWS」をご存知か?/sunnews
koyhoge
0
720
AndroidXR 開発ツールごとの できることできないこと
donabe3
0
110
リアルタイム分析データベースで実現する SQLベースのオブザーバビリティ
mikimatsumoto
0
950
Tech Blogを書きやすい環境づくり
lycorptech_jp
PRO
0
120
CZII - CryoET Object Identification 参加振り返り・解法共有
tattaka
0
240
FastConnect の冗長性
ocise
1
9.6k
明日からできる!技術的負債の返済を加速するための実践ガイド~『ホットペッパービューティー』の事例をもとに~
recruitengineers
PRO
3
100
スタートアップ1人目QAエンジニアが QAチームを立ち上げ、“個”からチーム、 そして“組織”に成長するまで / How to set up QA team at reiwatravel
mii3king
1
1.1k
Larkご案内資料
customercloud
PRO
0
600
テストアーキテクチャ設計で実現する高品質で高スピードな開発の実践 / Test Architecture Design in Practice
ropqa
3
710
20250208_OpenAIDeepResearchがやばいという話
doradora09
PRO
0
170
All you need to know about InnoDB Primary Keys
lefred
0
120
Featured
See All Featured
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
132
33k
Done Done
chrislema
182
16k
Site-Speed That Sticks
csswizardry
3
370
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
3
310
Building Flexible Design Systems
yeseniaperezcruz
328
38k
Side Projects
sachag
452
42k
The Language of Interfaces
destraynor
156
24k
Unsuck your backbone
ammeep
669
57k
The Invisible Side of Design
smashingmag
299
50k
Fashionably flexible responsive web design (full day workshop)
malarkey
406
66k
The Straight Up "How To Draw Better" Workshop
denniskardys
232
140k
Transcript
LiveStyle for Vim Quick start 2013/08/24 - kanazawa.rb meetup 12
Emmet LiveStyle http://livestyle.emmet.io/ "Instant updates: see changes as-you-type. No file
saving, no page reloading."
Demo Movie http://www.youtube.com/watch?v=iQLhGbkupS4
Quick start http://livestyle.emmet.io/usage/ "1. Install “LiveStyle” plugin from Package Control
in Sublime Text."
Quick start http://livestyle.emmet.io/usage/ "1. Install “LiveStyle” plugin from Package Control
in Sublime Text."
None
None
LiveStyle for Vim https://github.com/mattn/livestyle-vim
LiveStyle for Vim https://github.com/mattn/livestyle-vim http://mattn.kaoriya.net/ mattn_jp
LiveStyle for Vim http://mattn.kaoriya.net/ mattn_jp https://github.com/mattn/livestyle-vim also Emmet.vim http://mattn.github.io/emmet-vim/
Quick start for Vim
Quick start for Vim Vim livestyle-vim livestyled (included in livestyle-vim)
Google Chrome LiveStyle Extension
Quick start for Vim Vim livestyle-vim livestyled (included in livestyle-vim)
Google Chrome LiveStyle Extension
livestyle-vim Vundle.vim Bundle 'mattn/livestyle-vim' NeoBundle.vim NeoBundle 'mattn/livestyle-vim'
Quick start for Vim Vim livestyle-vim livestyled (included in livestyle-vim)
Google Chrome LiveStyle Extension
livestyled LiveStyle connection handling server Compile required ${bundle_dir}/livestyle-vim/livestyled/livestyled.go
livestyled LiveStyle connection handling server Compile required ${bundle_dir}/livestyle-vim/livestyled/livestyled.go
Setup Go lang (osx) $ brew install go
Setup depend libs (osx) $ brew install mercurial $ mkdir
~/.go $ export GOPATH=~/.go $ go get code.google.com/p/go.net/websocket
Compile livestyled $ cd ${bundle_dir}/livestyle-vim/livestyled $ go build livestyle.go
Quick start for Vim Vim livestyle-vim livestyled (included in livestyle-vim)
Google Chrome LiveStyle Extension
LiveStyle Extension https://chrome.google.com/webstore/detail/emmet- livestyle/diebikgmpmeppiilkaijjbdgciafajmg
LiveStyle Extension https://chrome.google.com/webstore/ Search 'Emmet LiveStyle'
How to Use
Flow Access site w/ Chrome Open Developer tool (LiveStyle panel)
Launch Vim & livestyled Bind css via LiveStyle panel Edit Edit Edit
Flow Access site w/ Chrome Open Developer tool (LiveStyle panel)
Launch Vim & livestyled Bind css via LiveStyle panel Edit Edit Edit
Access site w/ Chrome
Flow Access site w/ Chrome Open Developer tool (LiveStyle panel)
Launch Vim & livestyled Bind css via LiveStyle panel Edit Edit Edit
Open Developer tool(LiveStyle Panel)
Open Developer tool(LiveStyle Panel)
Flow Access site w/ Chrome Open Developer tool (LiveStyle panel)
Launch Vim & livestyled Bind css via LiveStyle panel Edit Edit Edit
Launch Vim & livestyled
Launch Vim & livestyled
Launch Vim & livestyled
Launch Vim & livestyled
Flow Access site w/ Chrome Open Developer tool (LiveStyle panel)
Launch Vim & livestyled Bind css via LiveStyle panel Edit Edit Edit
Bind css via LiveStyle panel
Bind css via LiveStyle panel
Flow Access site w/ Chrome Open Developer tool (LiveStyle panel)
Launch Vim & livestyled Bind css via LiveStyle panel Edit Edit Edit
Edit Edit Edit
Edit Edit Edit
Caution
Restriction
Happy coding !!
"kanazawa.rb ?"
scss/sass supported
scss/sass supported scss/sass command required set ft=scss/sass Heavy ...
Thank you Tomokazu Kiyohara http://github.com/kiyohara http://facebook.com/tomokazu.kiyohara