Go to Qiita Advent Calendar 2024 Top
LoginSignup
11
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Visual Studio CodeAdvent Calendar 2020

Day 5
@iydmsk(iyd msk)

VSCode, Remote-ContainerでHelloWorldを10言語やってみる

Last updated at Posted at 2020-12-05

はじめに

  • VSCodeのremote-containersが開発環境構築時にすごく便利だと感じたので、適当な10のプログラミング言語でHelloWorldやってみます
    • Rust, Go, Python, C++, C#, Ruby, TypeScript, Java, Dart, プロデル！
  • なるべくシンプルに、汎用的に
  • まだ全てにおいてはデバッグ実行できるところまで記述していません（手抜き。。）

準備

  • 前提：VSCode 1.51.1
  • 前提：Windows10 home(Insider Previewバージョン)の環境で試していますが、Macでもほぼ変わらないと思います
  • VSCodeをインストールする（方法は割愛）
    • Extension：Remote-Containerをインストールする
  • Docker環境を用意する
    • Windowsなら、Docker Desktop for Windowsを使えるようにします。
    • Macなら、Docker Desktop for Macのインストールは簡単です。

①Rust

  • １．まず適当なworkディレクトリを作ってVSCodeで開きます
    • この時点でディレクトリ内は空でいいです
  • ２．「Command Palette」を開いて、Remote-Containers:Add Development Container Configuration Files...を実行
    • image.png
    • Show All Definition...を選択すると全て表示されます
    • Rustを選択します
    • .devcontainerディレクトリ、その配下にdevcontainer.jsonとDockerfileが生成されます
  • ３．コンテナを生成して、VSCodeをコンテナ接続に切り替えます
    • ポップアップでも促されると思いますが、「Command Palette」を開いて、Remote-Containers:Add Development Container Configuration Files...を実行
      • image.png
    • Dockerデーモンが起動していることが前提です、初回はdocker imageのダウンロードやビルドもあるので少々時間がかかります。
    • コンテナが起動すると、VSCodeも新しく起動されます
  • ４．helloworld.rsを作成して、コーディングします。

fn main(){
    println!("hello world!");
}
  • ５．vscode内のterminalでビルドします、バイナリが生成されます
$ rustc helloworld.rs
  • ６．実行します
    • まずlaunch.jsonを作成
      • 「Command Pallete」を開いて、Open launch.jsonを選択、LLDBを選択
      • image.png
      • image.png
    • 中身を少し書き換えます、"program": "${workspaceFolde}/helloworld"とします。
{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "lldb",
            "request": "launch",
            "name": "Debug",
            "program": "${workspaceFolder}/helloworld",
            "args": [],
            "cwd": "${workspaceFolder}"
        }
    ]
}
    • F5で実行します
    • image.png

  • ７．最終的な構成です

│  helloworld
│  helloworld.rs
│
├─.devcontainer
│      devcontainer.json
│      Dockerfile
│
└─.vscode
        launch.json

②Go

  • １．前項参照
  • ２．ほぼ前項と同じ
    • Go → 1.15、選択していく
  • ３．前項参照
  • ４．helloworld.goを作成して、コーディングします。

package main

import "fmt"

func main() {
	fmt.Printf("hello world!\n")
}
  • ５．vscode内のterminalで実行します
$ go run helloworld.go
  • ６．とりあえずここまでですが、余裕があればvscode内から実行＆デバッグできるところまで、何れは記述しておきます。

③Python

  • １．前項参照
  • ２．ほぼ前項と同じ
    • Python 3 → 3.9、選択していく
  • ３．前項参照
  • ４．helloworld.pyを作成して、コーディングします。
print("hello world!")
  • ５．vscode内のterminalで実行します
$ python helloworld.py
  • ６．こちらも、とりあえずここまでですが、余裕があればvscode内から実行＆デバッグできるところまで、何れは記述しておきます。

④C++

  • １．前項参照
  • ２．ほぼ前項と同じ
    • C++ → Ubuntu20.04、選択していく
  • ３．前項参照
  • ４．helloworld.cppを作成して、コーディングします。

#include <stdio.h>
int main() {
    printf("hello world");
    return 0;
}

  • ５．ビルド＆実行します

    • 最初だけ次のようにlaunch.json, tasks.jsonを作成
    • 「Command Pallete」を開いて、Open launch.json →　C++(GDB/LLDB)　→ g++ Build and debug active file compiler:/usr/bin/g++を選択
    • image.png
    • あとはF5で実行できます

  • ６．ディレクトリ構造です、余裕があればcmake対応についても今後記述しておきます

│  helloworld
│  helloworld.cpp
│
├─.devcontainer
│      devcontainer.json
│      Dockerfile
│
└─.vscode
        launch.json
        tasks.json

⑤C#'

  • １．前項参照
  • ２．ほぼ前項と同じ
    • C＃(.NET Core) → 3.1(default)、選択していく
  • ３．前項参照
  • ４．Terminalからプロジェクトを生成します。
$ dotnet new console

  • ５．ビルド＆実行します

    • F5実行で下記のダウンロードが始まります（数分かかる）
      - image.png
    • .NET Coreを選択すると、launch.jsonとtask.jsonが生成されます

  • ６．ディレクトリ構造です

│  Program.cs
│  test-devcontainer-csharp-helloworld.csproj
│
├─.devcontainer
│  │  devcontainer.json
│  │  Dockerfile
│  │
│  └─library-scripts
│          azcli-debian.sh
│
├─.vscode
│      launch.json
│      tasks.json

⑥Ruby

  • １．前項参照
  • ２．ほぼ前項と同じ
    • Ruby → 2.7、選択していく
  • ３．前項参照
  • ４．helloworld.rbを作成して、コーディングします。
print "hello world!\n"
  • ５．vscode内のterminalで実行します
$ ruby helloworld.rb
  • ６．ディレクトリ構造です、余裕があればvscode内から実行＆デバッグできるところまで、何れは記述しておきます。
│  helloworld.rb
│
└─.devcontainer
        devcontainer.json
        Dockerfile

⑦TypeScript

  • １．前項参照
  • ２．ほぼ前項と同じ
    • Node.js & TypeScript → 14、選択していく
  • ３．前項参照
  • ４．helloworld.rbを作成して、コーディングします。
console.log("hello world!");
  • ５．vscode内のterminalで実行します
$ tsc helloworld.cs
$ node helloworld.js
  • ６．ディレクトリ構造です、余裕があればvscode内から実行＆デバッグできるところまで、何れは記述しておきます。
│  helloworld.js
│  helloworld.ts
│
└─.devcontainer
        devcontainer.json
        Dockerfile

⑧Java

  • １．前項参照
  • ２．ほぼ前項と同じ
    • Java → 15、選択していく
  • ３．前項参照
  • ４．helloworld.javaを作成して、コーディングします。
public class helloworld{
   public static void main(String[] args){
     System.out.println("hello world!!");
   }
}
  • ５．vscode内のterminalで実行します
$ javac helloworld.java
$ java helloworld
  • ６．ディレクトリ構造です、余裕があればvscode内から実行＆デバッグできるところまで、何れは記述しておきます。
│  helloworld.class
│  helloworld.java
│
└─.devcontainer
        devcontainer.json
        Dockerfile

⑨Dart

  • １．前項参照
  • ２．ほぼ前項と同じ
    • Dartを選択していく
  • ３．前項参照
  • ４．helloworld.dartを作成して、コーディングします。
void main() {
  print('hello world!');
}
  • ５．vscode内のterminalで実行します
$ dart helloworld.dart
  • ６．ディレクトリ構造です、余裕があればvscode内から実行＆デバッグできるところまで、何れは記述しておきます。
│  helloworld.dart
│
└─.devcontainer
    │  devcontainer.json
    │  Dockerfile
    │
    └─library-scripts
            common-debian.sh

⑩プロデル（笑）

  • １．前項参照
  • ２．下記のディレクトリ、ファイルを手動で作成
└─.devcontainer
        devcontainer.json
        Dockerfile
devconainer.json
{
	"name": "Produire",
	"build": {
		"dockerfile": "Dockerfile",
		"context": "..",
	},

	"settings": { 
		"terminal.integrated.shell.linux": "/bin/bash",
	},

	"extensions": [
		"utopiat.produirelang"
	],
}
Dockerfile
FROM mono

RUN \
apt-get update && \
apt-get install unzip wget -y && \
rm -rf /var/lib/apt/lists/*

RUN wget -O produire.zip https://rdr.utopiat.net/files/mono//produire-mono-1.6.965.zip \
&& unzip 'produire.zip' -d /usr/bin
  • ３．前項参照
  • ４．helloworld.rdrを作成して、コーディングします。
「hello world!」を表示する
  • ５．vscode内のterminalで実行します
$ mono /usr/bin/produire-mono/pconsole.exe  helloworld.rdr
  • ６．ディレクトリ構造です、業務用に使うことはなさそうですが教育用にいかがでしょうか、ただ、これに関してはパッケージマネージャとかもなく、ローカル環境にいろいろ入れ込むわけではないので、コンテナ上に構築する意味は薄そうです。
│  helloworld.rdr
│
└─.devcontainer
        devcontainer.json
        Dockerfile
11
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
11
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?