100行で作るアクションゲーム講習会環境構築資料

C++ & Siv3D (Windows)
C++ & Siv3D (macOS)
JavaScript & Canvas API
Python & PyGame
Processing

C++ & Siv3D (Windows)

基本的にこちらの資料に従います https://siv3d.github.io/ja-jp/download/windows/

Visual Studio Communityをインストール
- VSCodeとは別物です
- 「C++によるデスクトップ開発」にチェックを付けてインストールしましょう
Siv3Dインストーラをダウンロードしてインストール
「新しいプロジェクトの作成」から新規プロジェクトを作成
- プロジェクトテンプレートから「OpenSiv3D_(バージョン番号)」を選択
画面上のボタンorF5キーを押して実行

C++ & Siv3D (macOS)

基本的にこちらの資料に従います https://siv3d.github.io/ja-jp/download/macos/

XCodeをインストール
Siv3D プロジェクトテンプレートをダウンロードして展開
- 開発時にはこれを編集していくので、適当な場所に配置
プロジェクトファイルexamples/empty/empty.xcodeprojをXCodeで開く
Rosetta Modeを有効化する
- Siv3D公式のページに解説があるので、それに従う
左上のボタンを押して実行

JavaScript & Canvas API

適当なフォルダを作成してVSCodeで開いてください

以下の2ファイルを作りましょう

index.html

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="utf-8" />
    <title>game</title>
</head>
<body>
    <canvas id="main" width="640" height="480" style="border: 1px solid;"></canvas>
    <script src="./script.js"></script>
</body>
</html>

script.js

const canvas = document.getElementById("main");
const ctx = canvas.getContext("2d");

function update() {

    window.requestAnimationFrame(update);
}

window.requestAnimationFrame(update);

VSCode拡張「Live Server」をインストール
Ctrl+Shift+Pでコマンドパレットを開く→「Open with Live Server」
ブラウザが立ち上がって白枠だけのページが表示されればOK

Python & PyGame

Pythonをインストール
pip install pygameでPyGameをインストール

以下のソースコードをgame.pyなど適当な名前で保存

import pygame
import sys

pygame.init()
screen = pygame.display.set_mode((640, 480))

while (1):
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            pygame.quit()
            sys.exit()

    pygame.display.update()

コマンドラインでpython (ファイル名).pyとして実行、何もないウィンドウが出ればOK

Processing

これをダウンロードして実行、インストール https://processing.org/download
以下のソースコードを入力し、左上のボタンをクリックして実行
```
void setup() {
    size(640, 480);
}

void draw() {

}
```
何もないウィンドウが出ればOK