仕事の事やプライベートな事を適当に書いていくブログ

Teaが適当に仕事や趣味のアレコレを適当に書いていくブログです。

(自分の中で流行中な)Visual Studio Codeを使ってみた。

最近じゃなくても殆どゲームかアニメのツイートしかしないので、たまにはお仕事関連の記事でも。

ここ最近自分の周り(主に自分)でVisual Studio Code(以下vs code)が流行っています。
こいつは所謂エディターというやつでして、一般の方に分かりやすく言うとつまりはテキストエディター。
え?分からない?メモ帳と言えば大丈夫でしょうか。
こいつはエンジニアやプログラマー向けの機能がいっぱい付いてたり機能拡張できるようなものがあったりといったソフトウェアなわけです。
そんなvs codeを使ってみての感想等を。

最初から必要そうな機能は盛々付いてる

自分はフロントエンジニアって仕事してるんですけど、っていうかマークアップエンジニアと言った方がいいのでしょうか。
基本的にはhtmlとcssがメインで用途に応じてjs書いたりなんやかんやしています。
当初はこのソフト、CとかC#向けかな?と思っていてさっぱり興味沸かなかったのですが、
よくよく調べるとフロントでも使えるのでは?と思って使いだしました。

自分のエディター移行歴史では [tera pad]→[Dreamweaver]→[sublimeText2/3]→[vs code]←イマココ
という流れですが、ぶっちゃけsublimeTextは今でも使ってるというか併用しています。
でっ実際によかった所は色々あるんですけど、中でも……。

最初からEmmet(旧zen-code)が入ってる!

はい、何もしなくても最初から入ってました。
正直これだけで移行してもいいかなと若干思ったりもしました。
最新のDreamweaverも入ってるんでしたっけ?触らないので適当に言ってるだけかもしれないですけど。

gitがくっついてる!

そうなんです、こいつ単体でgitのコマンド打てるんです。ステージングもコミットもプッシュもできますし、
ブランチも当然作れます。クッソ重いSouce Tree使うより、こいつ1本でいいのではないかなと思いました。

cmd.exe(shell)もくっついてるやん!

他の人は知りませんが、少なくとも私は大抵開発時には黒い画面を必ずと言っていいほど起ち上げてます。
というのも、フロントエンジニアさんではお馴染みのgruntやgulpを使う為なんですよね。
それもvs codeにかかればこいつ1本でいいです。なんせくっついてますからね!

他にもデバッグ機能やタスク機能等色々あるのですが、そろそろ書くのが面倒くさくなってきたので、
そういったものは他にもっと詳しく書かれてるブログがありますでそちらにお任せします(放り投げ)

git機能使ってみて。

ぶっちゃけて言いますね。
正直に言いましょう。ずっとSouce Tree使ってた勢としては、gitのコマンドなんてこれっぽっちも覚えてないです!(迫真)
gitflowとかも追加プラグインでなんとかなりましたけど、「差分抽出」こいつだけはなんともなりませんでした。
※自分の知識不足なんですけどね。

っということでこれに関しては、別ツールでなんとかなりました。

git-diff-archiveを導入する

nodeをインストールしてることが前提ですけど、「git-diff-archive」というものがありまして、
こいつを使えば短いコマンドで直前のコミットと最新コミットの差分をzipで出したりしてくれる凄いツールです。
※制作者さんに大変感謝です。
このツールを

$ npm install git-diff-archive -g

とグローバルインストールしちゃってください。
インストール後はvs codeに戻りまして、このコマンドをタスク化してタスクぽちーだけで済ませましょう。

vs codeでのtaskの作り方は

  1. [Ctrl]+[Shift]+[p]でコマンドパレットを読み出す。
  2. [task]と入力したら[タスク:タスクランナーの構成(configure Task Runner)]を選択して色々あると思いますが[npm]を選択します。
  3. すると、プロジェクト配下に「.vscode」ってディレクトリが作られ、中には「task.json」というjsonファイルが生成されます。
  4. jsonファイルを下記の内容に変更します。
{
  "version": "0.1.0",
  "command": "gda",
  "isShellCommand": true,
  "showOutput": "always",
  "tasks": [
    {
      "taskName": "zip archive~1",
      "suppressTaskName": true,
      "args": [
        "HEAD~1"
      ]
    }
  ]
}

保存しましたら、
1. [Ctrl]+[Shift]+[p]でコマンドパレットを読み出す。 2. [task]と入力したら[Run Task]を選択。「zip archive~1」というのがあるのでそれを選択する。

な感じで直前のコミットと最新のコミットから差分を作ってくれると思います。
他にも色々オプションあるみたいなので、詳しくは git hub:git-diff-archiveを見てください。

そんな感じで最近はvs codeのみで開発してます。
もういろんなソフトを行ったり来たりは面倒くさいんだよなぁ~(´・ω・`)