本記事の概要

概要

『新しいクロームブックがやって来た』は以下の３回に分けて書いていきます。

【一般人向け：英字キーボードの洗礼 編】← 前回
【Linuxユーザー向け：Gimp/VSCode インストール 編】 ← いまココ
【エンジニア向け：Node.js/Vite インストール 編】 ← 次回

今回は、クロームブックへLinuxコンテナを導入し、その中に「Gimp」と「VSCode」をインストールしていきます。

● Gimp
画像編集にて、四角枠やテキスト挿入が出来る。

● VSCode
アウトライン機能や自動保存が出来る

・アウトライン機能
文章は長くなると、移動も大変になります。
そこで、見出しごとの目次のようなものをサイドメニューに表示し、それをクリックすると対象見出しに移動出来れば便利です。

・自動保存にする
手動保存だと面倒だし、何より保存し忘れて、今までの編集が消えてしまう等のリスクがあります。
そこで「自動保存」という機能を使います。

うれしいお知らせ

前回の

ですが、何とnoteマガジンの
『買ってよかったもの（ガジェット） 記事まとめ』に掲載されました📝

『noteマガジン』のアカウントからも見れる

どの辺りが評価されたのだろう❓
英字キーボードがツボにはまったとか(笑)

Linuxコンテナを導入する

Linuxコンテナを導入しましょう。
前回の記事でも説明しましたが、ここで言うLinuxコンテナとは、Crostini(ChromeOSのLinux仮想環境)を指します。

「設定 - 詳細設定 - デベロッパー」での設定を試すことに『Linux 開発環境を』オンにします。

「オンにする」ボタン押下

『Linux 開発環境をセットアップする』で「次へ」ボタン押下

・ユーザー名
デフォルトではアカウント名となります。
アカウント名のままでも良いのですが、ここでは「test」にします。

・ディスクサイズ
Linuxコンテナのディスクサイズは各自クロームブックの空き容量次第。
「C425TA」の場合では、ストレージが64GBなので、今回は『 推奨（10.0 GB）』のまま「インストール」ボタン押下します

『 Linux をインストールしています… 』と出るので数分待つ

インストール完了すれば、ターミナルが立ち上がります。

また、ランチャーの一番下の方に「Linux アプリ … 」が追加されてます

これをクリックすると「ターミナル」アイコンがアップされ

「ターミナル」アイコンをクリックすると

メニューっぽい画面がでてきます。
Linux - penguin あたりをクリックすると

ターミナルのウィンドウが立ち上がります

上の方の「＋」ボタンクリックで、新規タブで立ち上がります
ブラウザのタブのように、複数の切り替えが出来るわけです

cat /etc/os-release

OSの情報を見てみる

Debian 11 (bullseye) となります（本記事執筆時点）

pwd

カレントディレクトリの確認

インストール時にユーザー名「test」としたので、HOMEディレクトリはここになる。

ここから「Gimp」と「VSCode」をインストールしていきます。
その前にパッケージ管理のコマンドをアップデートし

sudo apt-get update

apt-get のアップデート

Gimp

Gimpをインストールする

sudo apt-get install gimp

「Gimp」をインストール

目にも留まらぬ速さで、ログメッセージが流れていきます。

何か聞かれたら、とりあえず「Y」（はい）で進める。
まあ、駄目だったらやり直せば良いだけ。

もっとも、今回は ” 253MB使うけど大丈夫っすか❓ ” という質問なのが一目瞭然なんですけどね。

しばらく、ログメッセージ流れます。
ていうか、長い。数分掛かった。

終わるとこんな感じ

ランチャーを確認してみると

Gimpがインストールされているぞ💡

Gimpを立ち上げる

すっげー😳
こんな本格的なツールがフリーだなんてありがたい。

先のほどのランチャーのキャプチャ画像を編集してみましょう
なおファイル名はlauncher.pngとしておいた

ああそういうことか

編集したい画像ファイルは、Linuxコンテナ内に持っていく必要がある

とはいえ、Crostiniの場合、簡単に出来る。
先程のLinuxコンテナ導入後には「Linuxファイル」という場所が出来ているので、ここに画像ファイルをコピーする。

そうすると、ユーザー名「test」の場合、そのHOMEディレクトリである /home/test にコピーが出来る

これで画像ファイルをGimpから開くことが出来る

いいですね〜、素晴らしい

「赤い四角枠」を付ける

「赤い四角枠」を付けましょう

パレット色のデフォルトは「黒」なので「赤」にします。
左メニューのパレットをクリック。

こんな感じで「赤」に設定

黒 → 赤 へとなる

上段の左から2番めの四角をクリック

こんな感じで対象を囲んで

メニューの「Edit」から、この「Stroke Selection」で

このように設定すると

赤い四角枠が入る

「テキスト」を挿入する

テキスト挿入をしましょう

左メニューの「Ａ」アイコンをクリック（画面でいう左上）

こうなるので「あいうえお」と入力したいのだが

　日　本　語　が　入　力　出　来　な　ー　い　😂

日本語を入力出来るようにする

fcitx-mozcをインストールする

これは、C425TAが英字キーボードだとかは関係なく、Debianの環境的な問題となります（ もちろん、Debianにも色々な種類があって一概には言えませんが … ）。
とはいえ、Crostiniの場合、日本語入力メソッドをインストールして、設定するだけで解決できます。

ここでは「fcitx-mozc」という日本語入力メソッドをインストールしたいと思います。

sudo apt-get install fcitx-mozc -y

fcitx-mozcをインストールする

fcitx-configtool

fcitx-configtoolを開く
（※ 注意：散々嵌った後から気づいたのですが、fcitx-configtool の前に fcitx を実行する必要があります。実際の臨場感を出したいので、記事としては失敗例としてこのまま進めていきます ）

空白ですね。これは、あやしい …

何かエラーが出てるし

てか、何この「GDBus.Error」って❓

sudo apt-get remove gnome-calendar

グーグル先生に聞いたたどり着いたサイトから、出てきたコマンド。
試しに gnome-calendar を削除してみたらって、やつですね。

まだ直らない

sudo apt-get install -y gnome-keyring

このコマンドは、クロームブックのLinuxコンテナに「VSCode」をインストールする記事でよく見かけるもの。
要は「Gnome Keyring」というキーリングツールをインストール。
関係あるかもしれない、試してみよう。

まだなおらない

sudo apt-get remove fcitx-mozc -y

一旦、アンインストールする

sudo apt install fcitx-mozc

「 apt-get 」でなく「 apt 」の方でインストールしてみるテスト（とりあえず sudo apt update はしないまま）

fcitx-configtool

で、もう一度試す

やっぱだめか。
もう、心が折れそうです orz

再度、いろいろと技術系サイトを徘徊して情報収集をすると
ランチャーの「Fcitx」のクリックからとありますね。
先ほど fcitx-mozc をインストールした段階で出来たもの。

ランチャーの「Fcitx」をクリックしてみる

・・・

・・・

・・・

特に何も起こらない。
一応、起動はされているのでしょうね。

まあここで再度

fcitx-configtool

　エ　ラ　ー　が　起　き　な　ー　い　✨

しかも「Keyboard - English(US)　　English」の表示もされているぞ💡

そうなんです❗
そもそも「 fcitx-configtool 」の前に「 fcitx 」を実行すべきなのです。

Fcitx本体を起動せずに、Fcitx設定ツールだけ起動しても、そりゃあ駄目だわな🤣
こんな、しょうもないケアレスミスの解決に2時間近く掛かったわ(笑)

Input Method 画面で、下メニューの「＋」ボタン押下

色々出ている〜😳
これ、エラーが出ていた時は何も出なかったんです。

「Only Show Current Langage」 のチェックを外し
サーチ欄に「Mozc」と入力すると

「Mozc　　Japanese」が出てくるのでOKを押す

「Mozc　　Japanese」が追加されているので
「Keyboard - English(US)　　English」を選択し、下メニューの「ー」ボタンで削除する

ターミナルが再起動された時でも、反映するように環境変数を設定しましょう。
ここでは、以下のコマンドで .profile （ログインシェルの終盤候補）に設定します。

echo "fcitx > /dev/null 2>&1" >> ~/.profile

cat .profile

一応、確認

これにより、ターミナルが再起動された際に fcitx コマンドが実行されるようになります。

さっきの続き

いやはや、長い戦いだった。
Gimpで日本語入力出来るか試してみましょう。

今度こそ、今度こそ …

・・・

・・・

・・・

　日　本　語　の　入　力　が　出　来　た　じ　ょ　ー　😭

教訓

ちょっと愚痴を言っていいですかね。

まずね、中途半端にFcitx設定ツールだけ起動しちゃうのがいけないんですよ。
起動せずに ” Fcitx本体が起動されいてません ” 的な分かりやすいエラーを吐いて欲しかったわ〜。

それが、中途半端に設定ツールが起動できちゃって、エラーもマニアックなもの吐くしさ😒

ちょっと一息

腹がへったので、ちょっと一息🍔

VSCode

VSCodeをインストールする

●Gnome Keyring

sudo apt-get install -y gnome-keyring

まず、クロームブックのLinuxコンテナに「VSCode」を入れる場合、まず「Gnome Keyring」というキーリングツールをインストールします。

公式にも色々書かれてます。

（ もっとも、私の場合は、先ほど「Gnome Keyring」のインストールは済ませましたが ）

●CPUアーキテクチャ
VSCodeですが、Debian用に .debパッケージ が用意されてます。
CPUアーキテクチャ別となるので、あらかじめ確認しておきま

lscpu

「 Architecture: x86_64 」
なので『 amd64 』に該当します。

●ダウンロード

にアクセス

amd64（ C425TA の場合）なので .debパッケージの「 64bit 」をクリックでダウンロードします。

●インストール
ダウンロードされた .debパッケージ をダブルクリック

「インストール」をクリック

「OK」をクリック

インストールが完了すると、ランチャーにアイコンが追加される

起動させましょう

初回起動時には「Get Started」なるタブが開かれてます
簡単なチュートリアルです。これはテーマ選択。

こういうのもある。

Web系ファイルの説明もあります。

ちなみに App.tsx の「.tsx」拡張子は、ReactのJSX記法のTypeScript版。

テキストファイル

テキストファイルを作成してみましょう

File - New Text File で新規作成

タブには「Untitled-1」となっている

「Ctrl + S」での保存時にファイル名を付けます

「 test.txt 」とでもしておきましょう。

「Save」ボタン押下で保存します

日本語入力は、さっきのGimpで対応済みなのでばっちりだぜ👍️

アウトライン機能

先程も説明しましたが、文章は長くなると、移動も大変になります。
そこで、見出しごとの目次のようなものをサイドメニューに表示し、それをクリックすると対象見出しに移動出来れば便利です。

●拡張機能をインストール
『 Markdown 』という拡張機能をインストールしたいと思います。

左サイドバーの拡張機能ボタン押下

拡張機能の検索欄が開かれるので

「 markdown 」と入力、結果一覧より『 Markdown 』を選択

『 Markdown 』がインストールされます

「Plain Text」をクリック

形式一覧が出てくるので

「Mark down」を選択

「Mark down」になる

Markdown記法が使えるようになります。

「Ctrl + B」でサイドメニューを開く

「OUTLINE」をクリック

「# 」(シャープと半角スペース)を先頭につけると、見出しとなります。

ポメラのアウトライン機能でいう「.」(ピリオド)に該当
※ VSCodeの場合、シャープの後に半角スペースも入れる点に注意

こんな感じです

階層を開く

階層は、シャープの数で調整。

機能検証のため、適当に長文

アウトラインの「小小見出し1-1-1」クリックで、エディタの該当箇所に移動します。

「小見出し2-1」クリックで、見出しワープだぜ❗

ライターや作家にとっては必須の機能ともいえよう。

自動保存にする

では、自動保存にしましょう。

上部メニューより File - Preferences - Settings の順でクリックし、設定画面を開きます
（ ※「Ctrl + , (カンマ) 」でも可 ）

Search settings 欄に「auto save」と入力

自動保存の設定欄が表示されます

この off の部分をクリックすると選択リストが出ます

off : 自動保存をしない(デフォルト)
afterDelay : 編集後「Auto Save Delay」で設定したミリ秒経過後に自動保存
onFocusChange : エディタからフォーカスがはずれた時に自動保存
onWindowChange : ウィンドウからフォーカスがはずれた時に自動保存

ここでは「afterDelay」を選択します。
その下に「Auto Save Delay」項目があり値が 1000 となっています(値は調整可)。

編集後、1秒(1000ミリ秒)経過に自動保存ということになります。

おまけ

いや〜、ここまでお読みいただきありがとうございます。

トマトナーラは、いかがでしょうか🍅🧀🍝

次回は【エンジニア向け：Node.js/Vite インストール 編】乞うご期待❗

【辛島信芳の著書】
IT技術などに興味のある方は、是非ご覧になってください。