OSX上にVSCodeを使ったAtcoder環境を構築する

# 忙しい人向けのまとめ
- VSCodeのキーボードショートカットで問題のDL,ビルド,検証をやります(提出は手動でやりたい流派なので今回はやりません)
    - https://github.com/kmyk/online-judge-tools を使用
    - 「.cppのコンパイル　〜　上記ツールを使用して問題のDL 〜　実行」をShellで自動化
    - VSCodeのタスクに作成したShellを指定
    - キーボードショートカットを設定
  
## フォルダ構成

以下最終的なフォルダ構成です。参考までに

```bash
pwd
/Users/xxx/Atcoder

tree -L 1                                                                                                          
.
├── AlgorithmTemplate　　アルゴリズムのテンプレートをここに配置
├── Atcoder.code-workspace VSCodeの設定ファイル
├── Contest　　　　　　　　コンテストフォルダをこの中に作成する
├── README.md
├── TeplateFolder　　　　　
├── cpp_dl_test.sh       task.jsonsに登録するshell
├── cpp_onecase_only.sh  task.jsonsに登録するshell
└── cpp_testonly.sh      task.jsonsに登録するshell

```


# はじめに

# 各種ツールのインストール
### VSCodeのインストール
https://code.visualstudio.com/
上記ページから、「Download for Mac」でインストール。細かい設定はもう覚えてないですが、特に意識することはなかった記憶です。

### GCCのインストール
OSXにデフォルトで入っているC++コンパイラはClang系（/usr/bin/g++）ですが、これが意外と使いづらいのでGCCにします。
インストールは以下の記事を参考にさせていただきました。
https://qiita.com/EngTks/items/ffa2a7b4d264e7a052c6

大まかな作業は以下
- HomebrewによるGCCのインストール
- シンボリックリンク張り替え
- #include <bits/stdc++.h>を使えるようにする

### online-judge-toolsのインストール
Atcoderのコンテストサイトからサンプル問題を取得して、それぞれをテストするという夢のようなツールが以下リポジトリで公開されていたのでありがたく使用させていただくことにしました。
インストール方法は「How to install」に記載があるので割愛

kmyk/online-judge-tools:
https://github.com/kmyk/online-judge-tools

なんと日本語リファレンスもあります。環境を作る上で参考にさせていただきました。
Introduction to online-judge-tools (Japanese) — online-judge-tools documentation
https://online-judge-tools.readthedocs.io/en/master/introduction.ja.html


# 環境構築
上記の環境を構築した時点で以下の作業はコマンド一発で可能です。

- 作成した.cppファイルをコンパイルする```g++ -g -o $実行ファイル名 $コンパイル対象.cpp```

- Atcoderからコンテストのサンプル問題をDLする```oj dl $コンテストの問題ページURL（ex: https://atcoder.jp/contests/abcxxx/tasks/abcxxx_y）```
- 実行ファイルを指定して、DLしたサンプル問題に対して検証を行う```oj t -c $実行ファイルのパス  ```

が、正直コーディング中に余計なShellコマンドを打つのは面倒だと思ったので、VSCodeのキーボードショートカットに登録することにしました。

# コンパイル-テストまでを行うShellの作成
以下のようなShellスクリプトを作成しました。これだと毎回```oj dl ```コマンドを呼ぶので、別途コンパイルと検証だけを行うshellも作成しておきます。

```shell:cpp_dl_test.sh

#!/bin/sh
file=$1
# 引数を受け取りファイル名を抽出
fname=$(basename $file)
objfile=`echo $fname | sed 's/\.[^\.]*$//'`
# ディレクトリに移動
cd $(dirname $file)

echo "テストケースURLを記載"
read str 

g++ -g -o $objfile $file

rm -r ./test
oj dl $str

oj t --jobs 3 -c "./"$objfile 
```

加えて、```oj```コマンドで対応していない、実行ファイルに対して１ケースだけテストするshellを作成します。

```shell:cpp_onecase_only.sh

#!/bin/sh
file=$1
# 引数を受け取りファイル名を抽出
fname=$(basename $file)
objfile=`echo $fname | sed 's/\.[^\.]*$//'`
# ディレクトリに移動
cd $(dirname $file)

g++ -g -o x $file

echo "in:"
cat ./test/sample-1.in
echo ""
echo "out:"
cat ./test/sample-1.in | ./x
```

# VSCodeタスクに作成したShellを指定
あとは以下のようにtasks.jsonに作成したshellを記載することで、VSCodeのタスクからshellスクリプトを呼び出せるようになります。

```json:tasks.json

{
    "version": "2.0.0",
    "tasks": [
        {
            "showOutput": "always",
            "label": "atcr test",
            "type": "shell",
            "args": ["${file}"],
            "command": "/Users/xxx/Atcoder/cpp_testonly.sh",
            "problemMatcher":[]
        },
        {
            "showOutput": "always",
            "label": "atcr dl test",
            "type": "shell",
            "args": ["${file}"],
            "command": "/Users/xxx/Atcoder/cpp_dl_test.sh",
            "problemMatcher":[]
        },
        {
            "showOutput": "always",
            "label": "atcr only one",
            "type": "shell",
            "args": ["${file}"],
            "command": "/Users/xxx/Atcoder/cpp_onecase_only.sh",
            "problemMatcher":[]
        }
    ]
}
```

# VSCodeのショートカットにタスクを登録
VSCodeの以下の画面でキーボードショートカットが設定できるので、ここでタスクの実行をショートカットに登録しておくと楽。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/254034/5be065d7-8ebc-1fe4-8586-0d34096bf269.png)

# 最後に
これでコーディングに集中できるようになるので、コンテストだけでなく精進も捗ります。