devcontainerで簡単に言語入門 CodespacesでWeb上でも(17言語ほど)

_作り直し_
<br>


玄関開けたら2分でご飯を食べる前に、5分で言語入門
とりあえず入門したいけど、環境構築はしんどいわ.. って時にどうぞ
vscodeの設定は出来るだけ**LSP、ブレークポイント、フォーマット**が効くようにした状態です。
**(関数型言語は、言語ごとに用意されたデバッガーを使うのが一般的のようで
動作するデバッグ拡張が殆どありませんでした)**


<br><br>

テンプレート設定してるので、Creating a new repositoryしてお好きなようにして下さい。
_(Codespacesは環境構築にたまに失敗するようです。コンテナ削除、時間をおいてリトライ)_

<br><br><br>



## GUIの確認

**CodespacesのGUI確認は、web上でvscode内のシンプルブラウザで行います。**
webで全て完結

**ターミナルの横のポートを右クリックして、ブラウザで確認**

![port.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/57472/b63bad53-e5ec-fafb-c8e4-02f3ca670d16.png)

<br>

![pgui_AdobeExpress.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/57472/e0ac58b8-41b4-333c-de97-d9c39feb2754.gif)

<br><br>

devcontainerのGUIはubuntu, windowsなら何もしなくてOKです。
**macはXQuartz**をインストールして設定する必要があります。

![dc_AdobeExpress.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/57472/cb506b64-e54d-8d82-3894-cf703c937c8b.gif)



<br><br><br>



## Codespaces の使用時間

[GitHub Codespaces](https://github.com/codespaces)


無料で済ませたいなら、使った後は、停止してるか確認
無駄なコンテナは削除しましょう。停止はcodespecesをクリックして、メニューから停止
![m.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/57472/0888e225-9a6c-d93a-5b7e-10fd831340e0.png)

<br><br><br>




## 動作環境

##### Codespaces

webなので、ブラウザが使えればOKだと思います。

<br>

##### devcontainer

devcontainer版はubuntu, windowsで試しました。
macは**XQuartz**をインストールして設定する必要があるようです。

#### 音声

**Codespacesは未対応**です。

devcontainerは、**PulseAudio**が設定されていればOKだと思います。
ubuntuはデフォルトでPulseAudioだと思います。
WSLはインストール、設定をしないとダメです。


<br><br><br><br>

# 言語一覧

<br><br>

## Rust

[Codespaces Rust](https://github.com/kxkx5150/Codespaces-Rust-template)

[devcontainer-Rust](https://github.com/kxkx5150/devcontainer-Rust-template)

下記の拡張が設定されています。

    "rust-lang.rust-analyzer",
    "vadimcn.vscode-lldb",
    "bungcip.better-toml",
    "serayuzgur.crates"

<br><br>

## C++

[Codespaces CPP](https://github.com/kxkx5150/Codespaces-CPP-template)

[devcontainer CPP](https://github.com/kxkx5150/devcontainer-CPP-template)

下記の拡張が設定されています。

    "ms-vscode.cpptools",
    "ms-vscode.cpptools-extension-pack",
    "ms-vscode.cmake-tools",
    "vadimcn.vscode-lldb",
    "VisualStudioExptTeam.vscodeintellicode",
    "VisualStudioExptTeam.intellicode-api-usage-examples",
    "ms-vscode.makefile-tools",
    "ms-vscode.cpptools-themes",
    "twxs.cmake",
    "llvm-vs-code-extensions.vscode-clangd",
    "cheshirekow.cmake-format"

devcontainerだけですが　[C++ Qt5, GTK4, SDL2 でGUIアプリ開発](https://qiita.com/kxkx5150/items/78e3e413decb366aa3b1)



<br><br>

## Python

**PySimpleGUI**等に

[Codespaces Python](https://github.com/kxkx5150/Codespaces-Python-template)

[devcontainer Python](https://github.com/kxkx5150/devcontainer-Python-template)

下記の拡張が設定されています。

    "ms-python.python",
    "ms-python.vscode-pylance",
    "ms-vsliveshare.vsliveshare",
    "njpwerner.autodocstring"

<br><br>


## TypeScript/JavaScript

主に**Electron**用に作成しました。

[Codespaces Electron](https://github.com/kxkx5150/Codespaces-Electron-template)

[devcontainer Electron](https://github.com/kxkx5150/devcontainer-Electron-template) 

下記の拡張が設定されています。

    "dbaeumer.vscode-eslint",
    "esbenp.prettier-vscode",
    "xabikos.JavaScriptSnippets",
    "dsznajder.es7-react-js-snippets"

<br><br>

## Zig
lsp(zls), Formatter, Debug

[Codespaces Zig](https://github.com/kxkx5150/Codespaces-Zig-template)

[devcontainer Zig](https://github.com/kxkx5150/devcontainer-Zig-template)

下記の拡張が設定されています。

    "tiehuis.zig",
    "AugusteRame.zls-vscode",
    "lorenzopirro.zig-snippets",
    "vadimcn.vscode-lldb"



<br><br>

## C#

[Codespaces C#](https://github.com/kxkx5150/Codespaces-CSharp-template)

[devcontainer C#](https://github.com/kxkx5150/devcontainer-CSharp-template)

下記の拡張が設定されています。

    "ms-dotnettools.csharp",
    "ms-vscode.cpptools",
    "ms-vscode.powershell"

<br><br>


## F#

[Codespaces F#](https://github.com/kxkx5150/Codespaces-Fsharp-template)

[devcontainer F#](https://github.com/kxkx5150/devcontainer-Fsharp-template)

下記の拡張が設定されています。

    "ms-vscode.cpptools",
    "ms-dotnettools.csharp",
    "Ionide.Ionide-fsharp",
    "ms-vscode.powershell"



<br><br>


## Lua

Luaのみ、c言語との連携を勉強する時用です。

[Codespaces Lua](https://github.com/kxkx5150/Codespaces-Lua-template)

[devcontainer Lua](https://github.com/kxkx5150/devcontainer-Lua-template)

下記の拡張が設定されています。

    "ms-vscode.cpptools",
    "ms-vscode.cpptools-extension-pack",
    "vadimcn.vscode-lldb",
    "sumneko.lua",
    "actboy168.lua-debug"



<br><br>

## Golang

[Codespaces Golang](https://github.com/kxkx5150/Codespaces-Golang-template)

[devcontainer Golang](https://github.com/kxkx5150/devcontainer-Golang-template)

下記の拡張が設定されています。

    "golang.go"

<br><br>









## Julia

[Codespaces Julia](https://github.com/kxkx5150/Codespaces-Julia-template)

[devcontainer Julia](https://github.com/kxkx5150/devcontainer-Julia-template) 

下記の拡張が設定されています。

    "ms-python.python",
    "ms-python.vscode-pylance",
    "ms-vsliveshare.vsliveshare",
    "njpwerner.autodocstring",
    "julialang.language-julia"

<br><br>

## Haskell

_Codespacesは上手く環境を作れないようです_
[Codespaces Haskell](https://github.com/kxkx5150/Codespaces-Haskell-template)

[devcontainer Haskell](https://github.com/kxkx5150/devcontainer-Haskell-template)

下記の拡張が設定されています。

    "haskell.haskell"

<br><br>

## Erlang/Elixir

[Codespaces Elixir](https://github.com/kxkx5150/Codespaces-Elixir-template)

[devcontainer Elixir](https://github.com/kxkx5150/devcontainer-Elixir-template)

下記の拡張が設定されています。

<br><br>

    "pgourlain.erlang",
    "JakeBecker.elixir-ls"

## Scala

[Codespaces Scala](https://github.com/kxkx5150/Codespaces-Scala-template)

[devcontainer Scala](https://github.com/kxkx5150/devcontainer-Scala-template)

下記の拡張が設定されています。

    "vscjava.vscode-java-pack",
    "scalameta.metals"

<br><br>

## Common Lisp

[Codespaces Common Lisp](https://github.com/kxkx5150/Codespaces-Common-Lisp-template)

[devcontainer Common Lisp](https://github.com/kxkx5150/devcontainer-Common-Lisp-template)

下記の拡張が設定されています。

    "rheller.alive"

<br><br>

## Clojure

[Codespaces Clojure](https://github.com/kxkx5150/Codespaces-Clojure-template)

[devcontainer Clojure](https://github.com/kxkx5150/devcontainer-Clojure-template)

下記の拡張が設定されています。

    "vscjava.vscode-java-pack",
    "betterthantomorrow.calva"

<br><br>

## OCaml

[Codespaces OCaml](https://github.com/kxkx5150/Codespaces-OCaml-template)

[devcontainer OCaml](https://github.com/kxkx5150/devcontainer-OCaml-template)

下記の拡張が設定されています。

    "ocamllabs.ocaml-platform"

<br><br>

## Kotlin

[Codespaces Kotlin](https://github.com/kxkx5150/Codespaces-Kotlin-template)

[devcontainer Kotlin](https://github.com/kxkx5150/devcontainer-Kotlin-template)

下記の拡張が設定されています。

    "vscjava.vscode-java-pack",
    "fwcd.kotlin"

<br><br>

## ファミコンソフト　開発

[Codespaces NES](https://github.com/kxkx5150/Codespaces-NES)

[devcontainer NES](https://github.com/kxkx5150/devcontainer-NES)

下記の拡張が設定されています。

	"EngineDesigns.retroassembler"

<br><br>


## CASL2 (アセンブラ)

[CASL2 devcontainer/Codespaces](https://github.com/kxkx5150/CASL2-devcontainer)

下記の拡張が設定されています。

    "MaxfieldWalker.vscode-casl2-comet2"


<br><br>







## 言語設定無しの雛形

その他の言語で作成したい時の雛形です。
テンプレート設定してますので、お好きなようにして下さい。

<br><br>

Xvfb, lxde, x11vnc, novnc, supervisorの設定済み
[Codespaces GUI App](https://github.com/kxkx5150/Codespaces-GUI-App-template)

<br>

[devcontainer App](https://github.com/kxkx5150/devcontainer-App-template)

<br><br><br>
<br><br><br>