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
マルチカーソルのLT
Search
Hajime Mugishima
October 10, 2019
Programming
0
250
マルチカーソルのLT
2019/10/10 Misoca 秋のLT大会での発表資料です
https://mokuteku.connpass.com/event/146769/
Hajime Mugishima
October 10, 2019
Tweet
Share
More Decks by Hajime Mugishima
See All by Hajime Mugishima
New Order in Cascade Sorting Order
mugi_uno
3
3.2k
Deep Dive into React Stream/Serialize
mugi_uno
6
1.7k
Next.js App Router での MPA フロントエンド刷新
mugi_uno
41
22k
コロナ禍 Frontend おさらい
mugi_uno
1
410
Toyama.rb
mugi_uno
1
99
kintoneフロントエンド刷新 〜新規参加5ヶ月から見るリアル〜
mugi_uno
3
1.7k
Javaを富山でやってたはずがSwiftのためにMacBook買ったらRubyでリモートワーカーになってJSの本を出版するまでを思い返す
mugi_uno
7
2.5k
脱レガシーフロントエンドのために知っておいたほうがいいこと
mugi_uno
20
7.4k
消費税軽減税率制度
mugi_uno
7
7.1k
Other Decks in Programming
See All in Programming
As an Engineers, let's build the CRM system via LINE Official Account 2.0
clonn
1
670
フロントエンドのディレクトリ構成どうしてる? Feature-Sliced Design 導入体験談
osakatechlab
8
4.1k
The Efficiency Paradox and How to Save Yourself and the World
hollycummins
1
440
Recoilを剥がしている話
kirik
5
6.6k
今年一番支援させていただいたのは認証系サービスでした
satoshi256kbyte
1
250
クリエイティブコーディングとRuby学習 / Creative Coding and Learning Ruby
chobishiba
0
3.9k
선언형 UI에서의 상태관리
l2hyunwoo
0
140
Refactor your code - refactor yourself
xosofox
1
260
テスト自動化失敗から再挑戦しチームにオーナーシップを委譲した話/STAC2024 macho
ma_cho29
1
1.3k
採用事例の少ないSvelteを選んだ理由と それを正解にするためにやっていること
oekazuma
2
1k
talk-with-local-llm-with-web-streams-api
kbaba1001
0
170
RWC 2024 DICOM & ISO/IEC 2022
m_seki
0
200
Featured
See All Featured
The Invisible Side of Design
smashingmag
298
50k
A better future with KSS
kneath
238
17k
A designer walks into a library…
pauljervisheath
204
24k
Six Lessons from altMBA
skipperchong
27
3.5k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
0
96
Optimising Largest Contentful Paint
csswizardry
33
3k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
169
50k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
2
170
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
26
1.9k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
365
25k
How to Ace a Technical Interview
jacobian
276
23k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
95
17k
Transcript
マルチカーソルの 2019/10/10 もくテク 秋のLT大会
麦島 一 (むぎしま はじめ) @mugi_uno 自己紹介
マルチカーソル使ってますか
マルチカーソル • エディタで「カーソル」を複数作る機能 • さまざまなエディタで利用可能 VSCode / Atom / SublimeText
/ JetBrain系IDE など →
絵も書ける
よくある利用例
→ "User" を "Person" に変えたいな〜
"User" 部分だけをマルチカーソルで選択 一気に編集
マルチカーソル便利〜!
ʙऴʙ
という方が大半 ʙऴʙ
使いこなすともっと便利に!
ϚϧνΧʔιϧ 参考 マルチカーソルを使わないVSCodeはただのVSCodeだ!
※注意 • VSCodeを例とした説明です • 他エディタでも 考え方は同じはずです • Vim/Emacsの方はきっと マルチカーソルより編集速いはず
マルチカーソルの基本操作
5JQT 2種類のカーソルの作り方がある ↓ 1つずつ作る or 一気に作る
基本的にはただの「カーソル」 ↓ カーソル1つでのキー操作は ほとんどそのまま使える 5JQT
• 単純なキーワード置換 • 一気にセミコロンを付与 ར༻ྫ
実演
クリップボードと組み合わせる
マルチカーソルで選択中のコピー 5JQT ↓ 改行で区切られてコピーされる
ペースト時は独特な挙動をする 5JQT
ペースト内容の行数≠マルチカーソルの数 →すべてのカーソルの位置に 同じ内容を単純にペースト ペースト内容の行数=マルチカーソルの数 →ペースト内容が1行ずつ分解され ひとつひとつのカーソルの位置にペースト 5JQT
• 置換時に入力する代わりにペースト • JSON⇔コードの流用 • 外部ドキュメントからのコード生成 ར༻ྫ
実演
VSCodeの機能と組み合わせる
マルチカーソルに対して VSCodeの各種機能が適用できる 5JQT
• ケース変換 →標準機能 or 'change-case' Extention ར༻ྫ • シーケンシャル値の生成 →
'vscode-input-sequence' Extention • エンコード/デコード → 'Encode Decode' Extention
実演
マルチカーソル生成のコツ 残り時間を確認
前後の共通部に注目する 5JQT
実演
マルチカーソルの弱点
Vimキーバインドとの相性が悪い
Vimのカーソル移動の速度は魅力的...
解決策
None
あしたから使っていきましょう!
None