ChromebookにJupyterとDockerComposeを入れて、軽い開発環境として使ってみよう！


# 前書き

Chromebookは、ブラウザのみ、ネット利用前提のマシン、
と思われがちであるが、
実は簡単なLinuxマシンとして使うことも出来る。

* ブラウジングやメール、Officeなど（本来のChromeBook機能）
* Androidタブレットとして（GooglePlayのアプリが使える）
* Linuxのミニ・開発環境として

といった**３つの使い方**が出来て、
非常に**軽く**、**早く**。**安く**、**電池も持つ**端末として、
**サブ機として超オススメ**と言える。

本稿では、Linuxのミニ・開発環境として、
Chromebookの基本的な使い方(開発向け)から始まり、
①ローカルJupyterNotebookとしてのPython環境
②Docker-Composeを使えるコンテナ実行環境
としての構築手順とコマンド、
そしてその後の疎通用コードをゼロから記載しておく、
超初心者用の環境構築 ALL-IN-ONE メモである。
Chromebookで本格的にプログラミングをしたい、という人にもオススメ。
（2020/09 初稿作成）

# 前提情報

## 使用ハードウェア

HP ノートパソコン クロームブック HP Chromebook x360 12b 12インチ 
2in1 コンバーチブルタイプ インテル® Pentium 4GB 64GB eMMC 
日本語キーボード （型番：8MD65PA-AAAC）
（更新期限：2026年）

## HP Chromebook x360 12b の「推し」について

* タッチスクリーン＆360°回転でAndroidタブレットとして使えること
* キーボードが本格的でクライムシェル型で使えること
* 上記２条件を満たす中ではかなり軽量であること
* 少し縦に長めのスクリーンが情報表示的に良い
* 左右のUSBTypeCのどちらからも給電可能なのが地味に便利
* USBTypeB、SDカード、イヤフォンジャック、があること
* キーボードバックライト、打鍵感も十分良い
* ディスプレイの発色、タッチも良い。電池の持ちも良い
* 通気口/ファンが無く静か、膝の上にもおける
* 総じて、値段の割にバランスが良く、サブ機として使いやすい

なお、小型系でAndroidタブレット的な使い方がメインであれば、
Lenovo IdeaPad Duet Chromebook
もオススメではあるが、キーボードがカバー型であるため
クライムシェル型での利用がいまいちであり、開発系には向かない。
また、USBTYpeB、SDカード、イヤフォンジャックが無い、なども、
拡張性の観点からデメリットに感じられ、候補から除外した。

逆にAndroidタブレット的な使い方をしない、ならば、
14インチ型など多少大きめのものだと、性能も選択肢の幅が広がる。

個人の感想ではあるが、Chromebookの良いところは、
タブレットと同じような感覚で、持ち運びも起動も「軽い」ことと感じる。
メインとして使うならば１４インチ型が良く、サブとして使うならば、
室内であっても持ち運びが便利＆多用途という点で１２インチ以下タッチ有り、
がオススメである。

※購入までに相当逡巡し、数カ月の比較に比較を重ねた結果、
　現行ではこれ１点、と確信するに至り本機を購入した。
　概ね期待通りかそれ以上の動きをしてくれている。

## システムの詳細情報の出し方

ブラウザ上で下記のようにアクセス

```:URL欄に以下を入力
chrome://system/
```

```:結果（一部抜粋）
CHROMEOS_RELEASE_CHROME_MILESTONE
84

CHROMEOS_RELEASE_VERSION
13099.102.0

CHROME VERSION
84.0.4147.127
```

# ChromeBook自体の操作方法。事前実行すると良いこと

## 個人的おすすめショートカット

「Ctrl + Alt + /」
　キーボードショートカットの一覧を出す

「Ctrl + W」
　現在のWindowを閉じる

「Ctrl + Shift + V」
　クリップボードの内容をプレーンテキストとして貼り付け
　※特にオススメ・便利

「Ctrl + Window表示キー(□||)」
　画面キャプチャを取る

「alt + @ 」「alt +「 」
  Windowを画面の左半分（or右半分）の固定サイズにする
  
「alt+^」
  Windowを画面の全体にする・通常サイズにする、の切り替え


## Androidアプリについて

GooglePlayから普通にインストール出来る。
対応しているものは表示される（基本的にほとんどのものが対応している）
全機能がfullで動くとは限らない。
ネットワーク周りの機能は少し独特な模様。
この機能が便利すぎるので、
タッチパッド使用可能＆タブレット形態可能、な機種を選ぶべし。
Chrome拡張機能などもそうだが、Androidアプリについても、
ChromeBookのアプリたちと平行する形でショートカットが追加される。


## メモ帳・テキストエディタ

とりあえず一番ベーシックかつシンタックスハイライトが効くものを入れておくと吉
「Text」というエディタアプリを入れておこう。
https://chrome.google.com/webstore/detail/text/mmfbcljfglbokpmkimbfghdkjmjhdgbg

VisualStudioCodeなどを入れる方法もあるが、
とにかく「簡単・軽快」なのでまずコレで十分。

## ファイル・フォルダ構成

エクスプローラー相当の「ファイル」というアプリから
「ダウンロード」したファイル（ローカルのファイル）、
「Linux(β)」のファイル（後述のターミナルのマウント）、
「Playファイル」≒ Androidとしてのファイル、
及びGoogleDriveに、透過的にアクセス可能。
ローカルで完結するファイルやアプリも多く、
Web・ネットワークが無いと無いも出来ないというわけではない。

---

# Linux(β)機能と、Python環境の構築

Linux(Debian stretch)のターミナルを動作させる機能。
ChromeOS ver.69 以降で導入された。

* 設定画面を開く（右下の時計など⇒歯車のアイコン）
* 設定画面の下のほうの、Linux(ベータ版)という項目をオンにする
* ターミナルがインストールされ、ランチャにも登録される
 
## ファイル・フォルダの共有

* Linux側からは、/mnt/chromeos がchromeOS側のマウント
* chromeOS側からは、標準の「ファイル」アプリで見れる。
* マイファイル＞Linuxファイル ＝ home/ユーザ名

## コピペ（クリップボード共有）

Linux側とchromeOS側はクリップボードの共有がなされているが、
例えばコマンドをchromeOS側のブラウザで調べて、
Pasteしようというときに、ショートカットが違うので注意が必要。
chromeOS側で、「Ctrl+C」しておき、「Ctrl+V」ではだめ。
Linuxターミナル側のお作法で、「Ctrl + Shift(⇧) + V」で貼り付く。
もちろん、Jupyterなどを起動後は
ブラウザ上でコードを書く形になるので「Ctrl+V」で良い。

## Linux環境全体のバックアップと復元

意外と情報が少ない気がするけど、知っておくと良いのは、
このlinux環境を「公式」の手順でまるごとバックアップ出来ること。
chromebook公式のヘルプ
https://support.google.com/chromebook/answer/9592813?hl=ja
GoogleDriveなどに直接バックアップを保存しておけば安心出来ますね。

ちなみに、本稿の手順全て実行してHackMDのDockerイメージがある状態で
1.2GB程度の容量になった。ベースではおそらく300MB〜400MB程度か。

## ターミナル全体のバージョン確認

```
# ターミナルのバージョンは下記で確認
cat /etc/debian_version
> 10.1
```

なお、ターミナルが立ち上がっている状態で
「Ctrl + Shift + p」で設定画面が表示される。
テーマの色替えなどが出来る。


## Python3のバージョン確認

```
# Python2は入っておらず、Python3が入っている。
# pip/pip3は入っていない。

python -V
> -bash: python: command not found

python3 -V
> Python 3.7.3

which pip
> ※無し

```

## pip のインストール

```
# 以下のコマンドでインストーラをダウンロード
curl -O https://bootstrap.pypa.io/get-pip.py

# 重要：distuils.utilを事前にインストールしないと以下のエラーになる。
# ModuleNotFoundError: No module named 'distutils.util'
sudo apt-get install python3-distutils

# get-pipを実行してpipを導入する
sudo python3 get-pip.py 

# pipが入ったことを確認する
which pip
> /usr/local/bin/pip

pip -V
> pip 20.2.2 from /usr/local/lib/python3.7/dist-packages/pip (python 3.7)

```

## Matplotlibなどライブラリ群のインストール


```
# 一発で導入できた。
sudo pip install matplotlib

# 日本語豆腐対応モジュールも合わせていれておく。
sudo pip install japanize-matplotlib

# pandasも入れておく
sudo pip install pandas

# seabornも入れておく
sudo pip install seaborn

```

## JupyterNotebookのインストールと起動


```
# インストール
sudo pip install jupyter

# 起動（※chromeOS側でブラウザが自動起動）
jupyter notebook

```

ターミナル側とchromeOS側とでポートフォワーディングなど
設定しないといけないかと思ってたけど
直通しているようなので楽で便利！！

    
## JupyterNotebook上で実行するサンプルコード

立ち上がったブラウザ上でNotebookを新規作成し、
以下のコードを実行して疎通確認が出来る。

```python:pythonの確認用コード
##Jupyter上でグラフをインライン表示する設定
%matplotlib inline

#### 必要なライブラリの利用を宣言
## グラフ描画ライブラリ
import matplotlib.pyplot as plt

## 算術計算ライブラリ
import numpy as np

##matplotlib を日本語表示対応するライブラリ
import japanize_matplotlib

#### 以下で実行
# グラフを描画
x = np.arange(0, 20, 0.1)
y = np.cos(x)
#プロット
plt.plot(x,y)
#ラベル名をつける
plt.xlabel('コサインのグラフ')
#表示
plt.show()
```

わざわざChromebookでJupyter立ち上げなくても、
Colaboratoryでいいじゃん、という話も十分あるのだが、
ローカルで軽度に試せる場所があるというのは
それはそれで利便性が高い。

---


# Dockerの利用

## Dockerのインストール

Docker公式サイトのdebianにインストールする手順をそのまま使う
https://docs.docker.com/engine/install/debian/

公式サイトを参照しながら「Ctrl + Shift(⇧) + V」で
コマンドをコピペしていけばだいたいOK。


### 旧バージョンがある場合のアンインストール

```
sudo apt-get remove docker docker-engine docker.io containerd runc
```

### 依存パッケージのインストール

```
sudo apt-get update

sudo apt-get install \
    apt-transport-https \
    ca-certificates \
    curl \
    gnupg-agent \
    software-properties-common
```


### Docker公式のGPGkeyの追加

GPGとは、インストラーが本物かどうか、
検証するために用いられる暗号化の仕組み。

```
curl -fsSL https://download.docker.com/linux/debian/gpg | sudo apt-key add -
sudo apt-key fingerprint 0EBFCD88
```

### Dockerの安定版(stable)repositoryの追加

一応CPUのアーキテクチャ情報を確認し、x86_64の手順を参照して実行

```
lscpu
#出力 ⇒ Architecture:        x86_64
```

```
sudo add-apt-repository \
   "deb [arch=amd64] https://download.docker.com/linux/debian \
   $(lsb_release -cs) \
   stable"
```

### Docker本体のインストール

```
sudo apt-get update
sudo apt-get install docker-ce docker-ce-cli containerd.io
```

※公式サイトを参照しての実施はここまで。

## インストールの確認と疎通

### インストール出来たことの確認

```
docker version
# 出力 ⇒ 
# Client: Docker Engine - Community
#  Version:           19.03.12
#  API version:       1.40
#  Go version:        go1.13.10
#  Git commit:        48a66213fe
#  Built:             Mon Jun 22 15:45:50 2020
#  OS/Arch:           linux/amd64
#  Experimental:      false
```

### 疎通実行

--rm オプションをつけると
コンテナ終了時に自動的に削除出来るので、
終了したコンテナが貯まらずに済む。

```
sudo docker run --rm hello-world
# 出力(一部) ⇒ 
# Hello from Docker!
# This message shows that your installation appears to be working correctly.
```

# Docker-Composeの利用

## Docker-Composeのインストール

同様に公式サイトのlinuxのインストール手順を参照して行う。
https://docs.docker.com/compose/install/


### 最新の安定版のダウンロード

```
sudo curl -L "https://github.com/docker/compose/releases/download/1.27.1/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose
```


### 実行権限の付与

```
sudo chmod +x /usr/local/bin/docker-compose
```

### インストールされたバージョン確認

```
docker-compose --version
# 出力 ⇒ docker-compose version 1.27.1, build 1110ad01
```

## Docker-Composeの実用：HackMDの利用

同時利用可能のMarkdownエディタ：HackMDのサーバを
Docker-Composeを使って一瞬で立ててみる。

```
# gitは最初から入っている模様
git clone https://github.com/hackmdio/docker-hackmd.git
cd docker-hackmd
# 早速起動する
sudo docker-compose up
# 出力 ⇒ 末尾に以下の情報がでれば、3000番ポートで起動出来ている
# info: HTTP Server listening at port 3000
```

## HackMDにアクセス

chromeブラウザを立ち上げて、以下にアクセス。
http://localhost:3000/

chromebookのローカル環境でHackMD(同時利用可能Markdownエディタ)
のDockerイメージが簡単に立ち上がって使えるようになった。

HackMD自体、Markdownの編集ツールとして大変優秀なので、
普通にコレだけ使ってもかなり有用であろう。

ちなみに、localhostではコンテナにアクセス出来ない、という情報を見かけたが、
2020年1月以降のChrome OSアップデートを実施しているChromebookでは、
localhostがChrome OSとLinux環境で共通化しており、
Linux環境で立ち上げたコンテナには
「localhost:ポート番号」でアクセス可能である。

## HackMDの停止

「ctrl + c」で起動中のプロセスを停止すれば良い。
もうlocalhost:3000にはアクセス出来なくなっているハズ。


---


# あとがき・所感など

## Chromebookは予想以上に使い勝手が良かった！

まずChromebookは扱いやすく、とにかく起動的にも物理的にも「軽い」点がオススメ。
パソコンを触る時より、タブレット・スマホを触る時のほうが
心理的障壁が少ないと思うのだがそうした感覚に近いパソコンと言える。

そして、Androidタブレットとして予想以上にかなりの割合のソフトが使える点も良い。

基本的にはデータはクラウド側に保存するため、
サブ機としてのデータ連携の手間が少ない点も便利である。

さらに本稿のような簡単な開発環境にもなるとすれば、
Chromebookは一台持っておいて損は感じないのではないか？

とても「軽い」開発環境を得ることが出来てよかった！

## 開発環境としてのノートブック型端末の競争についての私見

文教用としても、Windows,Chromebookの安い端末は普及してきている。
子供が最初に触るプログラミング環境はScratchなどだとしても、
次に触る環境は本稿のような環境になるような気がする。

近年、WindowsにもWLS2環境が用意されてきており、
Windows,Mac,ChromebookなどのOSによらず、
linux系の環境・開発が出来るようになってきた。
これは従来はMacのアドバンテージだった点を、
Windows,Chromebookが猛追していることを意味する。

むしろ、GPU利用機械学習はMacでは難しいため、
下記のようにゲーミングPCで実現可能なWindowsが一歩リードした、とも言える

[ゲーミングPCで機械学習をして、CPU/GPUの性能の違いをColaboとも比較してみた話【Windowsの機械学習環境構築手順決定版。TF2.0対応】](https://qiita.com/youwht/items/b6fa208bcf0688ff51b0)

プログラムするならMac、みたいな風潮はちょっと変わってくるのかもしれない。
（Macもダメというわけではないけど）


## 本稿の作成も、もちろんChromebook

本稿自体も、もちろんChromebookのみで完結して作成している。
（試している際の自分用のメモを公開しているだけなので当たり前だが）
役立ったという方がいらっしゃればまた更新していくかもしれない。


以上。