yoppa.org


PCD Tokyo 2020 ワークショップ – Teachable Machineとml5.jsとp5.jsで機械学習プログラミング入門

ワークショップ資料

ワークショップ内で使用するスライド資料とサンプルプログラムは、以下のリンクからダウンロードしてください。

事前準備

Processing Community Day Tokyo 2020で開催されるワークショップ「Teachable Machineとml5.jsとp5.jsで機械学習プログラミング入門」に参加予定のみなさん、以下の事前準備をしてくるようお願いいたします。

ワークショップで使用するエディター

ワークショップでは、Visual Studio Codeを使用してコーディングの解説をしていきます。今までプログラミング用にテキストエディターを使用したことのない方や、特にこだわりの無い方はVisual Studio Codeを以下の解説を読んでダウンロードしてインストールしてください。

Visual Studio Code以外のテキストエディターを使用していてそちらの方が慣れているという方は、普段使用しているエディターでも受講可能です。ただし、環境設定やファイルの操作などはVisual Studio Codeで説明していきますので、使用するエディター用に各自で環境設定を行ってください。

Visual Studio Codeのインストール

Visual Studio Codeを以下のサイトからダウンロードしてインストールしてください。

Visual Studio Codeの環境設定

Visual Studio Codeでは、Extensionという機能拡張をする仕組みが用意されています。このワークショップでは以下の2つのExtensionを使用します。

  • Live Server
  • p5js Snipets

Extensionをインストールするには、まずVisual Studio Codeを起動してウィンドウの左に並んでいるボタンから、以下のExtensionボタンをクリックします。すると、画面左にExtensionのインストール画面が表示されます。

Extension画面の上にある検索欄に「Live Server」と入力してください。Live ServerのExtensionが一番上に表示されます。説明の横にある「Install」ボタンを押してLive Serverをインストールします。

次に「p5js」で検索します。すると「p5js Snippets」が一番上に表示されます。こちらも説明の横の「Install」ボタンを押してインストールします。

以上で準備は完了です! もし分からない場合は少し早めに来て質問してください。