フリーランス チャレンジ!!

フリーランス チャレンジ!!

現役フリーランスエンジニアが書く雑記ブログ

横広のディスプレイがあると開発が効率的でサイコーです

スポンサーリンク

スポンサーリンク

f:id:ksakae1216:20190316224512p:plain

最近Visual Studio CodeでAngular(TypeScript)書いてるんだけど、横広の外付けディスプレイがあまりにも開発を効率的にしてくれるのでご紹介。

 

 

横広の外付けディスプレイ

この記事で以前紹介してるディスプレイ。

www.ksakae1216.com

 

23インチの外付けディスプレイで解像度は2560 X 1080なので横はMacbookProと同じだけど、アスペクト比が21:9で通常の16:9よりも横が大幅に広いディスプレイです。

 

どのように効率的か?

基本、外付けディスプレイにVisual Studio Codeをフルスクリーンで表示してMacにブラウザを表示。

 

こんな感じ。

f:id:ksakae1216:20190316225247p:plain

 

これの何が楽かっていうと、ディスプレイに表示してあるVSCode(Visual Studio Codeの事)でコード書いて、結果もそのまま確認できるので便利。

※VSCodeの右に表示されてるブラウザはBrowser Previewっていうプラグイン。

f:id:ksakae1216:20190316225855p:plain

 

それでMacにはブラウザを表示して、調べ物があるときは、Macに表示してあるブラウザで調べる。

 

マウスカーソルは基本、ディスプレイ上に置いてあり、Macのブラウザはキーボードのみで操作。

ブラウザをキーボードで操作できるvimiumプラグインをChromeにインストールしてあるからマウスカーソルを持ってくる必要もなし。

www.ksakae1216.com

 

長時間の作業もマウスカーソル動かすのはディスプレイ上のみなので広い画面を使ってても疲れない。

 

画面が広いのでコード書くのも捗る!!

 

実際の開発

実際、どんな感じで便利かはgifを見てね。

f:id:ksakae1216:20190316232524g:plain


見えやすいようにズームにしてます。

エディタでloginボタンの表示を"login!!!"(ビックリマーク3つ追加)に変更、保存するとブラウザが自動的にリロードされコードの内容が反映されます。

※Angularをnpmで起動するとブラウザが自動的にリロードされます。

※コードは下記の記事を参考

www.ksakae1216.com

 

外付けディスプレイは選べるなら横広

という事で、外付けディスプレイ使うなら横広がおすすめ!!

 

開発はディスプレイ上で完結するし、調べ物はPCにブラウザ開いて操作はキーボードでやるのでマウスカーソルをディスプレイ、PCを行ったり来たりする必要もない。

 

なので横広ディスプレイがおすすめ!!