GitHub CodespacesでJupyter Notebookを利用しよう

Jupyter Notebookは「Pythonが実行できる環境」であり、さらに以下のような便利な機能が付いている。

※１matplotlibは、Pythonで2Dや3Dのグラフを描画するためのライブラリである。
※２seabornとはPythonのデータ可視化ライブラリで、同じPythonの可視化ライブラリであるmatplotlibが内部で動いている。

それでは、GitHubリポジトリの設定からJupyter Notebookを起動するまでの手順をご紹介しよう。

1. 新しいGitHubリポジトリを作成する

まず、Jupyter Notebookをホストするためのリポジトリを作成する。

1. GitHubにログインし、Dashboard画面左上の「Top repositories」の横の「New」をクリックしよう。
2. 「Repository name」に任意の名前（例: jupyter-notebook-project）を入力しよう。
3. 「Public」または「Private」を選択する。
4. 「Add README」をONに入れると、後で設定が簡単になる。
5. 「Create repository」ボタンをクリックして、リポジトリを作成しよう。

2. Codespacesの設定と起動

次に、作成したリポジトリでCodespacesを起動しよう。

1. Dashboard画面から作成したリポジトリのページに移動し、緑色の「Code」ボタンをクリックしよう。
2. ドロップダウンメニューの「Codespaces」タブを選択し、「＋（Create codespace on main）」ボタンをクリックしよう。
3. Codespaceがプロビジョニング※され、数分でブラウザにVS Codeのインターフェースが表示される。
   ※リソース（サーバー、ネットワーク、アプリケーション、ユーザーアカウントなど）を、需要に応じて準備、設定、割り当て、提供するプロセスのこと

3. Jupyter Notebookをインストールする

Codespacesは、事前に構成された開発環境を提供するが、Jupyter Notebookは通常、VS Codeの拡張機能として導入する。

1. VS Codeの左側にある拡張機能アイコン（四角が3つ並んだアイコン）をクリックしよう。
2. 検索バーに「Jupyter」と入力しよう。
3. Jupyter拡張機能を探し、「Install」ボタンをクリックしてインストールしよう。
   この拡張機能が、ノートブックの表示・編集・実行を可能にする。

4. Jupyter Notebookファイルを作成し、コードを実行する

拡張機能をインストールしたら、.ipynbファイルを作成してコードを書き始めよう。

1. VS Codeのファイルエクスプローラー（左側のサイドバー）で「New File」ボタンをクリックしよう。
2. ファイル名に「sample.ipynb」と入力し、Enterキーを押す。
3. 新しいファイルが作成されると、Jupyter Notebookのインターフェースが自動的に開く。
4. 表示されたセルに、Pythonコード（例: print(“Hello, GitHub Codespaces!”)）を入力しよう。
5. セルの左側にある再生ボタン（▶）をクリックするか、Shift + Enterを押してコードを実行しよう。

これにより、VS CODEの上でJupyter Notebookのコード実行結果を確認できる。これで、GitHub Codespacesをデータ分析や機械学習のサンドボックスとして利用する準備が整った。

以下にサンプルとして、九九を表示するコードをご紹介する。

import pandas as pd

# 九九の表を作成（1〜9の掛け算）
table = pd.DataFrame(
    [[i * j for j in range(1, 10)] for i in range(1, 10)],
    index=[f"{i}段" for i in range(1, 10)],
    columns=[str(j) for j in range(1, 10)]
)

# Jupyter Notebook上で整形表示（中央揃え）
table.style.set_properties(**{'text-align': 'center'}).set_table_styles(
    [{'selector': 'th', 'props': [('text-align', 'center')]}]
)

実行結果

　　　　1　　	2	3	4	5	6	7	8	9
1段	1	2	3	4	5	6	7	8	9
2段	2	4	6	8	10	12	14	16	18
3段	3	6	9	12	15	18	21	24	27
4段	4	8	12	16	20	24	28	32	36
5段	5	10	15	20	25	30	35	40	45
6段	6	12	18	24	30	36	42	48	54
7段	7	14	21	28	35	42	49	56	63
8段	8	16	24	32	40	48	56	64	72
9段	9	18	27	36	45	54	63	72	81

• pandas.DataFrame で九九の表を作成する。
• style.set_properties() でセルを中央揃えにする。
• set_table_styles() でヘッダーも中央揃えにする。