Chromebook PlusにWeb開発環境を構築したのでメモ

2025/05/10

Chromebook PlusにWeb開発環境を構築したので書き留めておきます。

Linux（Beta）環境のセットアップ

まず最初に、Chromebookの「設定」からLinux（Beta）環境を有効にします。まだ設定がお済みでない方は、以下の手順で進めてください。

画面右下の時刻表示をクリックし、「設定」（歯車アイコン）を開きます。
左側のメニューから「詳細設定」をクリックし、「デベロッパー」を展開。
「Linux開発環境」の横にある「オンにする」をクリックし、表示される指示に従ってユーザー名やディスクサイズなどを設定してインストールを開始します。数分で完了します。

これで、Chromebook上で本格的なLinuxコマンドが利用できるようになります。

Web開発に欠かせないのが、高機能なテキストエディタです。ここでは、「Visual Studio Code (VS Code)」をChromebookのLinux環境にインストールします。

$ sudo dpkg -i code_1.100.0-1746623151_amd64.deb

インストール中に依存関係のエラーが表示された場合は、以下のコマンドを実行して依存関係を解決します。

$ sudo apt --fix-broken install

Webサイトを公開したり、サーバー上のファイルを管理する際に便利なのがFTPクライアントソフトです。ここでは、高機能で使いやすい「FileZilla」をLinux環境にインストールします。ターミナルで以下のコマンドを実行してください。

$ sudo apt update
$ sudo apt install filezilla

インストールが完了したら、アプリ一覧からFileZillaを起動し、サーバー情報（ホスト、ユーザー名、パスワード、ポート番号）を入力して接続すれば、ローカルとサーバー間のファイル転送がGUIで簡単に行えます。

開発中のWebサイトやHTMLファイルを簡単にプレビューしたい時、Pythonの簡易サーバーが非常に便利です。Linux環境が整ったら、ターミナルを開いて以下のコマンドを実行するだけで準備完了です。

$ cd [あなたのWebサイトのルートディレクトリ]
$ python3 -m http.server 8000

このコマンドを実行すると、8000番ポートで簡易サーバーが起動し、ブラウザから “`http://localhost:8000“` にアクセスすることで、Webサイトを確認できます。