Linux開発環境の構築メモ

はじめに

Web系の開発環境として長年Windowsを使っていましたが、数ヶ月前にLinux環境に切り替えました。

使用環境が安定してきたので、利用環境構築の備忘録として使用中のソフトとインストール方法を簡単にまとめました。

利用環境紹介

OS

Ubuntu 18.04

ディストリビューションは特にこだわり無いため、シェアの高いものを選びました。
デスクトップ環境ですが、低スペックPCの再利用などの用途では無いため、デフォルトのGNOMEを使っています。

最小設定でインストールしました。

パーティションも、デフォルト設定です。
500GBのSSDなので、
ブートローダー用の「EFIシステムパーティション（/boot/efi）」が500MBほど、
残りがルート（/）領域で設定されました。

外観/Ubuntuの設定

標準の設定ツールではテーマやフォントの変更ができないため、tweakをインストールします。

Ubuntu標準のソフトウェア管理ツール「Ubuntu software」でインストールするか、下記コマンドでインストール

sudo apt install gnome-tweaks

テーマ

下記のように設定しました

• アプリケーション：materia-dark
• カーソル：paper
• アイコン：paper

テーマインストール

sudo add-apt-repository ppa:dyatlov-igor/materia-theme
sudo apt update
sudo apt install -y materia-gtk-theme

アイコンインストール

sudo add-apt-repository -u ppa:snwh/ppa
sudo apt install -y paper-icon-theme

フォント

Ricty Diminishedをインストールしました。

インストール

sudo apt install -y fonts-ricty-diminished

設定はとりあえず下記の感じに

アプリ切り替えをウィンドウ単位に変更

デフォルトでは「Alt+Tabキー」での切り替えがアプリ単位となる。
Windowsと同じように、ウィンドウ単位での切り替えとなるよう、設定画面からキーバインドを変更する

設定ツールを開き、「Device」→「Keyboard」の中の「Switch Windows」に「Alt+Tabキー」を設定する

日本語環境のインストール

こちらを参考にインストールしました。

普通にaptからインストールすると、日本語切替時のデフォルトが英語モードとなったり、辞書の性能が低かったりします。

日本語の変換はSuper(Win)+Spaceとなっています。

ターミナル/シェル

terminator

ターミナルエミュレータにterminatorを設定しました。

インストール

sudo apt install -y terminator

ほぼこちら方の設定をそのまま使っています。参考リンク

また、下記を追加で設定しました。

• hide_windowのショートカットキーを「Ctrl+T」に変更
• 設定の「一般」タブの「フォーカスから外れたら隠す」にチェックを入れる

コマンドが必要なときだけ「Ctrl+Tabキー」を押してターミナルで操作し、「Alt+Tabキー」などでエディタに戻ると自動でターミナルが閉じてくれます。

fish

シェルはfishを使っています。
コマンドやディレクトリ名の補完機能が便利です。

bashと書式が違うため、bashのスクリプトでは動かないものがあったりしますが、ほぼ初期状態で十分使えるのがおすすめです。
テーマはシンプルな「clearance」に設定しました。

また、aliasなどをbashで設定し、.bashrcの末尾に"exec fish"を記載してbash経由で起動しています。

.bashrc

...
exec fish

• fishのインストール
  インストールは公式の情報を参考にしました。

sudo apt-add-repository ppa:fish-shell/release-3
sudo apt-get update
sudo apt-get install fish

• fishermanのインストール
  プラグイン管理のツールもインストールします。（参考）

curl https://git.io/fisher --create-dirs -sLo ~/.config/fish/functions/fisher.fish

• テーマの変更
  テーマはシンプルな「clearance」をインストールしました。

fisher add oh-my-fish/theme-clearance

• プラグイン：bassのインストール

fishでbashコマンドを使えるようにするためのプラグインです。

インストール

fisher add edc/bass

bashのスクリプトも下記のように動かすことができます。

bass test.sh
bass source config.sh

• プラグイン：pecoのインストール

pecoは入力された一覧から絞り込み検索と、選択ができるようになるツールだそうです。(参考)

いろいろな用途があるようですが、今回はhistoryの検索を設定しています。

インストール

sudo apt install peco
fisher add oh-my-fish/plugin-peco

下記設定ファイルに追加

~/.config/fish/config.fish

function fish_user_key_bindings
  bind \cr 'peco_select_history (commandline -b)'
end

設定の反映

 source ~/.config/fish/config.fish

キーバインドの設定

Xkeysnail

カーソルキーの移動などを設定したかったので、キーリマップツールを設定しました。

インストール方法

公式ページを参照してください。

① インストール

sudo apt install python3-pip
sudo pip3 install xkeysnail

② 設定ファイルを~/.Xkeysnail/config.pyに保存する

自分用の設定をこちらに保存
https://github.com/odaryo/my_xkeysnail_config

③ 起動

sudo xkeysnail ~/.Xkeysnail/config.py

エラーが起きる場合は下記を実行した後に、上記コマンドを実行してください

xhost +SI:localuser:root

PC起動時に実行する方法

コマンドを毎回打つのは面倒なので、自動起動の設定を行います。
デーモン化させる方法がいくつか紹介されていましたが、自分の環境では頻繁に停止して、その度に再実行が必要でした。

そのため、.bashrcに起動コマンドを書いて起動させる方法で設定します。

① xkeysnailをパスワード無しでsudo実行させる

visudo で下記を追記します。
※ちなみに、私の環境では/usr/local/bin/xkeysnailにインストールされていました。

// 設定を開く
sudo visudo

// 下記行を追加
user_id ALL=NOPASSWD: /usr/local/bin/xkeysnail

② .bashrcに自動起動の設定を記載

.bashrc

if [ -z `pgrep xkeysnail` ]; then
  xhost +SI:localuser:root
  sudo xkeysnail /home/user_id/.Xkeysnail/config.py -q > /dev/null &
fi

※起動中の確認にpgrepを利用しましたが、他に良い方法があるかも知れません。

エディタ

vim

ちょっとした設定変更に利用。
カーソル移動でABCDのような記号が入力されるようになったため、設定します。
~/.vimrcに下記を追加して保存

.vimrc

set nocompatible

nano

同じくターミナル上での編集用に利用

開発ツール

下記のものをインストールして使っています。

git

言わずと知れたバージョン管理ツール

クライアントはコマンドラインとPhpStormを使っています。

ssh

最小構成では入っていないため、後から入れる必要があります。

$ sudo apt install openssh-server

とりあえずrootログインとパスワードログインを無効化

/etc/ssh/sshd_config

PasswordAuthentication no
PermitRootLogin no

Docker/docker-compose

開発環境はほぼDocker内に設定しています。

公式サイトに従ってインストール

Docker
Docker Compose

ちなみに、docker-composeを毎回打つのは面倒なので、下記エイリアスを設定しています。
（２番めは本番環境用ファイルの起動用）

.bashrc

alias doc='docker-compose'
alias docp='docker-compose -f prod.docker-compose.yml'

PhpStorm

IDEはJetBrain派です。

最近Intellij IDEAにマイグレートしました。
PhpStormからIntelliJ IDEAは契約期間を引き継いでマイグレートできるみたいですね。

特に設定しなくても便利に使えます。
DB閲覧やGit管理など、ほぼこれ1つで完結します。

バージョンなどはToolbox Appを使ってインストールして管理しています。

設定は、ファイルにエクスポートしてクラウドに保存しています。
（設定はアカウントに紐付けて自動同期を行えば楽なのですが、他PCにインストールしたときにすべてのPCの設定が初期状態に上書きされたりと、管理方法が良くわかりませんでした。）

VSCode

Microsoft製のIDE
主にメモ書きくらいしか使っていない・・・

リモートデベロップなど便利な機能があるため使ってみたいと思いつつそのままに。

余談ですがIntelij系をメインにする問題は、後輩とかにVSCodeのショートカットキーを聞かれたときに即答できない。

Node.js

ホストにはあまりものを入れたくないのですが、IDEからLintツールで整形するときなど、コンテナ内だとうまく設定できなかったためホスト側に入れています。

nvmからインストールしました。

インストール

// nvmのインストール
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.0/install.sh | bash

// Node.jsのインストール
nvm install --lts

// ついでにyarnもインストール
npm install -g yarn

リモート環境

Chrome Remote Desktop

自宅外から操作する際にChromeリモートデスクトップを使っています。
VPN張ってVNC接続よりも簡単にできるのが良いです。

設定は下記の記事を参考にしました。

Ubuntu へ Chrome Remote Desktop を使ってMacからリモート接続
引用元： How to Install Chrome Remote Desktop on Ubuntu 18.04

ほぼ書いてあるとおりに設定しております。

記事から変更した点はこちら

• リモートデスクトップアプリがサポート終了したため、Webアプリ版をインストール
  • https://remotedesktop.google.com/
• .chrome-remote-desktop-sessionの内容を下記に設定
  • （X環境はデフォルトのままGnomeを使っています）

.chrome-remote-desktop-session

exec /usr/sbin/lightdm-session "gnome-session --session=ubuntu"
DESKTOP_SESSION=ubuntu XDG_CURRENT_DESKTOP=Unity XDG_RUNTIME_DIR=/run/user/$(id -u) exec /usr/sbin/lightdm-session 'gnome-session --session=ubuntu'

• Windowsキーを右Ctrlに変更

  • デフォルトだとWindowsキーがホスト側に反応してしまうため、右CtrlをWindowsキーにマッピングしました
    

• 使ってみての感想

  • 簡単に設定できるのが良い
  • レスポンスや描画速度は申し分ない上に無料
  • Teamviewerよりも早い（気がする）上に、商用利用も問題無さそう

• 設定がわからなかった所

  1. キーボードレイアウト変換方法
     • ホストのキーボードは英語配列のものを使っているのですが、クライアントPCが日本語キーボードの場合に英語キーボードと認識されてしまいます。
     • 特に押せないキーは無いようなのでそのまま使っています
  2. ホストがマルチディスプレイの場合に全ディスプレイが表示されてしまう（ブラウザの中に全画面が横並びで表示される）
     • ググったら設定欄にディスプレイの選択メニューがあるようですが、私の環境では表示されませんでした。
     • ホストの設定の問題？

終わりに

IDEの設定は省いていますが、一通り開発できる環境が整いました。
今後、もっと良いツールがあれば追記していく予定です。