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
130
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
55
Lightning Talk イベント運営を いいがにやりたい
kiyohara
0
48
首負担皆無!ゼログラビティ プログラミングスタイル
kiyohara
0
370
北陸で Ruby なお仕事に携わるための3つの戦略
kiyohara
1
1.6k
Algolia in CAMPFIRE
kiyohara
0
3.6k
地方エンジニアの日常 - 業務からコミュニティ活動まで
kiyohara
0
300
Web to macOS native app
kiyohara
0
390
金沢アプリ開発塾セミナー資料「テストについて」
kiyohara
1
260
Git インフラ選定事例 - 株式会社クルウィットが GitHub を選んだ理由
kiyohara
0
500
Other Decks in Technology
See All in Technology
Redmineの意外と知らない便利機能 (Redmine 6.0対応版)
vividtone
0
780
Introduction to Sansan, inc / Sansan Global Development Center, Inc.
sansan33
PRO
0
2.6k
スプリントゴールで価値を駆動しよう
takufujii
3
1.6k
VueUseから学ぶ実践TypeScript #TSKaigi #TSKaigi2025
bengo4com
3
5.3k
Things you never dared to ask about LLMs — v2
glaforge
1
410
All About Sansan – for New Global Engineers
sansan33
PRO
1
1.2k
ソフトウェアは捨てやすく作ろう/Let's make software easy to discard
sanogemaru
4
1.7k
OSMnx Galleryの紹介
mopinfish
0
120
Digitization部 紹介資料
sansan33
PRO
1
3.7k
OCI Database Management サービス詳細
oracle4engineer
PRO
1
4.5k
RDRA3.0を知ろう
kanzaki
2
340
新卒から4年間、20年もののWebサービスと向き合って学んだソフトウェア考古学 - PHPカンファレンス新潟2025 / new graduate 4year software archeology
oguri
2
290
Featured
See All Featured
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
228
22k
Embracing the Ebb and Flow
colly
85
4.7k
Statistics for Hackers
jakevdp
799
220k
Fireside Chat
paigeccino
37
3.5k
Unsuck your backbone
ammeep
671
58k
The World Runs on Bad Software
bkeepers
PRO
68
11k
Balancing Empowerment & Direction
lara
0
72
Product Roadmaps are Hard
iamctodd
PRO
53
11k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
129
19k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
47
2.8k
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