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
mugi / Hajime Mugishima
October 10, 2019
Programming
0
300
マルチカーソルのLT
2019/10/10 Misoca 秋のLT大会での発表資料です
https://mokuteku.connpass.com/event/146769/
mugi / Hajime Mugishima
October 10, 2019
Tweet
Share
More Decks by mugi / Hajime Mugishima
See All by mugi / Hajime Mugishima
サイボウズフロントエンドの横断活動から考える AI時代にできること
mugi_uno
4
1.6k
令和7年版 あなたが使ってよいフロントエンド機能とは
mugi_uno
14
7k
New Order in Cascade Sorting Order
mugi_uno
3
3.9k
Deep Dive into React Stream/Serialize
mugi_uno
8
2.1k
Next.js App Router での MPA フロントエンド刷新
mugi_uno
41
24k
コロナ禍 Frontend おさらい
mugi_uno
1
460
Toyama.rb
mugi_uno
1
150
kintoneフロントエンド刷新 〜新規参加5ヶ月から見るリアル〜
mugi_uno
3
1.8k
Javaを富山でやってたはずがSwiftのためにMacBook買ったらRubyでリモートワーカーになってJSの本を出版するまでを思い返す
mugi_uno
7
2.6k
Other Decks in Programming
See All in Programming
iOSエンジニア向けの英語学習アプリを作る!
yukawashouhei
0
170
CSC509 Lecture 03
javiergs
PRO
0
330
フロントエンド開発に役立つクライアントプログラム共通のノウハウ / Universal client-side programming best practices for frontend development
nrslib
7
3.9k
After go func(): Goroutines Through a Beginner’s Eye
97vaibhav
0
230
Your Perfect Project Setup for Angular @BASTA! 2025 in Mainz
manfredsteyer
PRO
0
120
AI Coding Meetup #3 - 導入セッション / ai-coding-meetup-3
izumin5210
0
580
CSC305 Lecture 02
javiergs
PRO
1
260
CSC509 Lecture 06
javiergs
PRO
0
240
ネイティブ製ガントチャートUIを作って学ぶUICollectionViewLayoutの威力
jrsaruo
0
130
Introducing ReActionView: A new ActionView-Compatible ERB Engine @ Kaigi on Rails 2025, Tokyo, Japan
marcoroth
3
920
Breaking Up with Big ViewModels — Without Breaking Your Architecture (droidcon Berlin 2025)
steliosf
PRO
1
330
Django Ninja による API 開発効率化とリプレースの実践
kashewnuts
0
930
Featured
See All Featured
Bash Introduction
62gerente
615
210k
Embracing the Ebb and Flow
colly
88
4.8k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
54
3k
GitHub's CSS Performance
jonrohan
1032
460k
Mobile First: as difficult as doing things right
swwweet
224
10k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
7
890
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Fireside Chat
paigeccino
40
3.7k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
9
850
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
358
30k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.2k
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