OpenShift 上の container に Dev Containers でアタッチする

# 要約
- OpenShift 上の container に Visual Studio Code ( 以降 VSCode ) の [Dev Containers extension](https://code.visualstudio.com/docs/devcontainers/containers) で接続できたら便利かもしれないと思った
- extension のドキュメントには Kubernetes 上の container に接続できそうな記載がある
- Kubernetes で接続できるのであれば OpenShift でも接続できるに違いない
- 試した結果、接続できたが途中何度かつまづいたため記事に残す
- OpenShift を初めて 2 日程度の初心者のためもっと良い方法や間違っている箇所がある場合は教えてください
- 環境は以下を用いた
  - クライアント ( VSCode の実行環境 ) は Windows 11
  - [Redhat Developer sandbox](https://developers.redhat.com/developer-sandbox)
    - sandbox は 30 日毎に環境がリセットされるが継続して使用できる様子 ( その他の制限は [FAQ](https://developers.redhat.com/developer-sandbox/FAQ) を参照 )

# 手順
## Redhat Developer sandbox に登録する
- Qiita にも登録方法を纏めている記事があるためここでは省略する
- OpenShift の console を開けるところまで進める

## kubectl を準備する
- [Getting started with the OpenShift CLI](https://docs.openshift.com/container-platform/4.14/cli_reference/openshift_cli/getting-started-cli.html) などからアーカイブをダウンロードする
  - Kubernetes 本家からダウンロードしても良いかもしれないが 念の為 OpenShift が提供している kubectl を用いる
    - [kubectl バイナリーは、バイナリーをダウンロードする場合にアーカイブに含まれます](https://access.redhat.com/documentation/ja-jp/openshift_container_platform/4.3/html/cli_tools/usage-oc-kubectl)
- Windows のアーカイブには `kubectl.exe` が同梱されていないが代わりに同梱されている README.md に以下のような記載があるため `oc.exe` をコピーしたものを `kubectl.exe` にリネームして使用する
````
If you would like to use `kubectl.exe` instead, copy the `oc.exe` file and rename it to `kubectl.exe`.
The interface will follow the conventions of that CLI.
````
- `oc.exe` と `kubectl.exe` をパスが通ったフォルダに格納する
  - フォルダ本来の目的から外れているかもしれないが、個人的には以下のフォルダを使うことが多い
````
%userprofile%\AppData\Local\Microsoft\WindowsApps
````

## VSCode に extension を追加する
- 以下 2 つを追加する
  1. [Dev Containers](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containers)
  1. [Kubernetes](https://marketplace.visualstudio.com/items?itemName=ms-kubernetes-tools.vscode-kubernetes-tools)

## container を起動する
- ここではベースのイメージに [node](https://hub.docker.com/_/node/) を使用する
- ただしこのイメージをそのまま使用すると container が終了する、接続後にエラーが発生するなど問題が発生するため node を ベース・イメージ に最低限の設定を行う Dockerfileを準備する
  - 準備した Dockerfile が [コチラ](https://github.com/attackmy/openshift-node/blob/main/Dockerfile)
- OpenShift の console にて、
  - "Developr > Topology" の画面にて右クリックして "Import from Git" をクリックする
    - ![import-from-git.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1060173/e1b9687a-0710-6824-55a8-1d9d73ca0c74.png)
  - Dockerfile を含むリポジトリの URL を入力する
    - ![git-repo-url.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1060173/e02bd0ac-0d86-9a7a-b443-2731a6bfc32f.png)
  - container 作成後に Dockerfile を変更したい場合は Pipeline を追加する、インターネットに公開しない場合は Route を作成しない、など適宜設定してから Create をクリックする
    - ![pipeline-route.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1060173/762e0bf6-dc50-c33d-b784-b7b888459925.png)
  - しばらく待ってから Pod が動いている ( 濃い青円になっている ) ことを確認する
    - ![pod-is-running.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1060173/d7c6bb28-a528-d8ad-4f52-c141bfe1e8cd.png)

## OpenShiftに接続する
- `oc login` コマンドを console から取得する
  - Copy login command > DevSandbox > Display Token
    - ![copy-login-command.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1060173/b8abad85-75ef-80d7-32d8-29d7f34ac1eb.png)
    - ![login-with-token.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1060173/87cf1b1d-e9a4-fc0c-acb7-5f7ca1195f6f.png)
- VSCode の Terminal に先ほど取得した `oc login` コマンドを貼り付けて実行する
````
PS C:\qiita> oc login --token=sha256~nt_tekitonaataidayo5jZfYFwumOaCBPSXueIUf3n0 --server=https://api.sandbox-nx.999k.p9.openshiftapps.com:6443
Logged into "https://api.sandbox-nx.999k.p9.openshiftapps.com:6443" as "ark38" using the token provided.

You have one project on this server: "ark38-dev"

Using project "ark38-dev".
````
- この状態で Kubernetes のビューを確認すると先ほど起動した container を確認できる
    - ![pods-in-extension.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1060173/dd01becc-5c34-2f52-d881-26361033d701.png)
- container で右クリックして "Attach Visual Studio Code" を選択する
    - ![attach-vscode.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1060173/720fa132-9146-6254-1a3a-3d2832e6f185.png)
- 新しい VSCode のウィンドウが表示されるのでしばらく待つ
- 画面が落ち着いたら "File > Open Folder..." をクリックする
- 読み書きができる Directory を選択する
  - ![open-folder.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1060173/85bb42ef-a6cb-d4a2-0ed9-0d0d12d69561.png)
- Terminal を開こうとするとエラー (The terminal process "/sbin/nologin" terminated with exit code: 1.) が発生する場合、
  - ![terminal-error.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1060173/e9133e49-c859-b1bb-6352-a921b2975143.png)
  - `Ctrl+Shift+P` から以下を実行した後にもう一度 Terminal を開いてみる
````
>Terminal: Select Default Profile
bash
````
- 無事 Terminal が開いたら適当なコマンドを実行してみる
````
1012030000@openshift-node-git-5c787dd8d9-bztb9:~$ node -v
v21.6.1
1012030000@openshift-node-git-5c787dd8d9-bztb9:~$ echo "console.log('Hello Goodbye.')" > index.js
1012030000@openshift-node-git-5c787dd8d9-bztb9:~$ node index.js
Hello Goodbye.
````
- 以上です