Quantcast
Channel: Vimタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 5608

最速最短でターミナルカスタマイズをする。

$
0
0

はじめに

初めまして!DMM WEBCAMPでメンターをしている@y-hirako0928です。

この記事では、日々プログラムを書いていく中で頻繁に使うターミナルを使いやすく、カッコよくしていく方法を紹介していく記事です。

ターミナルといえば、黒い背景に白い文字。実行された結果も全部白文字。

正直、ダサくないですか?
もっとかっこいいターミナル、欲しくない?

この質問にYES!と思った人は、ぜひぜひターミナルを自分の思いのままにカスタマイズしていきましょう!

この記事に書かれていること:
Macのターミナルに使えるカスタマイズ知識
カスタマイズ未経験者向けの簡単な解説
最低限のカスタマイズの例
さらに進んだカスタマイズをする場合に便利な記事一覧

この記事に書かれていないこと:
・windowsのコマンドプロンプトやPowerShellのカスタマイズ
・シェルについての詳しい解説
・zshプラグインなど、外部ツールやインストールが必要なツールを用いたカスタマイズについて

1. iTerm2を導入しよう

iTerm2とは、ターミナルと同じコマンドラインツールです。
この記事では、ターミナルのカスタマイズよりもiTerm2を導入し、カスタマイズすることをオススメしています。

iTerm2

スクリーンショット 2019-12-19 2.55.05.png

iTermは

ターミナルを素早く&カッコよく開く設定をつけることができる!
画面収録 2019-12-18 1.32.16.mov.gif

私は、controlを2回連続で入力するとしたからニュッ!とiTerm2のコマンドラインが表示されるように設定しています。設定を変更すれば上部、右側、左側からニュッ!と表示できるように設定することもできます。

ね?かっこいいでしょ?
かっこいい以外にも、ブラウザでサイトをみながらちょっとしたコマンドを実行したい時にも便利に使えます。

また、iTerm2は設定できる項目が多く、ユーザーの好みに合わせてより細かなカスタマイズができます。

iTerm2のインストールに特別な設定は必要ありませんので、外部アプリをダウンロードする手順を素直にこなしていけば問題なくダウンロードできます。サイトのDownloadをクリックし、アプリを起動してみましょう。

もし、細かい手順を知りたい方はこちらの記事を参考にすると良いかもしれません。

初心者向け iTerm2のインストール方法 - Qiita

ニュッ! と飛び出るターミナルの設定方法

  1. iTerm2 > preferences...をクリックして設定を開きます
    スクリーンショット 2019-12-19 3.14.29.png

  2. ホットキー用の設定を作ります
    メニューからProfileを選び、+をクリックして新しいプロファイルを作成。舐めをわかりやすいようにHotkey windowを作ります。
    こうすることで、windowHotkey windowの二つを同時に使うことができます。
    スクリーンショット 2019-12-19 3.17.31.png

  3. keyメニューに移り、A hotkey opens a dedicated window with this profileの項目にチェックを入れ、configure Hotkey WindowをクリックしてHotkeyの設定画面を開きます。
    スクリーンショット 2019-12-19 3.23.27.png

  4. ホットキーを開くためのアクションをここで自由に設定することができます。
    個人的にオススメは、^Controlキーのダブルタップでニュッ!と開く設定です。もし同じ設定にするならば、Double-tap keyの項目にチェックを入れ、^Controlを選択すると良いでしょう。
    スクリーンショット 2019-12-19 3.28.27.png

これで、カッコよくターミナルを開く設定は完成です。
もし細かくカスタマイズをしたい場合は設定項目を調べてみると良いかもしれません。
iTermの設定に関しては、Qiitaやその他のサイトで設定例を公開している方がたくさんいらっしゃいますので、そうした記事を参考にしてみるのも良いかもしれません。

記事によってはバージョンが古く、レイアウトが変わっているため設定を読み解く若干の英語力が必要になってきます。まぁ、エラー文を読む労力とそこまで変わらないと思いますのでぜひぜひチャレンジしてみてください。

これまで私がカスタマイズしていく中で参考にした先駆者様の記事一覧
僕がiTerm2を使ってる理由 - Qiita
iTerm2のHotkeyを使わないなんてもったいない!! - Qiita


2. .zshrcを見つけよう

では、シェルの設定をしましょう。

設定を始める前に、現在使っているシェルを確認しましょう。

hogehoge[~] % echo $0
-zsh

hogehoge[~] %

シェルという言葉に聞き馴染みがなかったら、”ターミナルの中で動いているプログラム、パソコンを動かす時に使うプログラムなんだなー”ぐらいのイメージでOKです。

(ちょっと知っている人向けの蛇足)
ここで、少しシェルを齧ったことがある方であれば、なんでbashじゃなくてzshなの?と疑問に思うかもしれません。zshのカスタマイズ方法を書いている理由としては、macOS 10.15 Catalinaからデフォルトシェルがbashからzshに変更されたからです。
おそらく、macを最近買った方や、Catalinaにアプデートしている方のターミナルはzshが動いているハズなので、zshの設定ファイルをカスタマイズすれば問題ないと思います・・・!

自分は、Catalinaになる前からzshを使っていたため、アップデート後自動的にbashからzshに変わるかどうか定かではありません。もし「echo $0って入力したら-Bashって表示されたよー!」とか、「echo $SHELLと入力したら/bin/bashと表示されたよー!」などの現象がありましたら、コメント蘭でMacのバージョンを添えてお知らせいただけると幸いです。

まず、設定ファイルがある場所を確認します。
cd ~
でrootディレクトリ へ移動してください。

ls -a
で、カレントディレクトリ内にある隠しファイルを探しましょう。
.zshrcというファイルがあれば、それがシェルの設定ファイルです。
もしも.zshrcファイルが存在しなければ、source .zshrcで.zshrcファイルを作りましょう。

hogehoge[~] % ls -a
~(その他いろいろなファイルやディレクトリ)~
.zprofile
.zsh_history
.zshenv
.zshrc

hogehoge[~] %

rootディレクトリに.zshrcがあることが確認できましたら、いよいよ.zshrcの編集に移ります。

3. vimの基本的な使い方

設定ファイルの編集にはVimを使うと良いでしょう。.(ピリオド)から始まる設定ファイルは、Sublime TextやVisual Studio Codeのようなスクリプトエディタを使って編集することができないファイルです。
(カスタマイズ次第でできると思いますが、vimと触れ合う良い機会ですのでvimを使ってみましょう。)

Vimを使って設定ファイルを開いてみましょう。

hogehoge[~] % vi .zshrc

(もしファイルが見つからなければ、cd ~ でディレクトリを変えてから実行してみましょう。もしそれでもファイルが見つからなければ、touch .zshrcのコマンドを入力してください。)

すると、Vimのエディタが起動し.zshrcファイルの中身を見る事ができます。

Vimではコマンドを実行して保存などをします。

コマンド実行結果
escノーマルモードにする。(コマンドを入力できる状態にする)
i入力モードにする。
: wファイルの変更を保存する。
:wq変更点を保存してvimを終了する。
:q!変更点を保存せずにvimを終了する。

vimの操作についてさらに詳しく知りたければこちらのサイト( 知識0から始めるVim講座 - Qiita )や、vim 入門などのキーワードで調べてみてください。
また、ターミナル上でvimtutorのコマンドを実行すると、vimの日本語チュートリアルを見ることができます。

4. 簡単におしゃれにしたい人向け(コピー&ペーストでOK!)

1. Simple is the best
PROMPT='%*
%F{green}[%~]%f %# '

スクリーンショット 2019-12-18 1.50.51.png

現在の時刻と、カレントディレクトリを表示するプロンプトです。
作業時間を意識するため、常にプロンプトの脇に時間が表示されるようにしています。
(私はこのスタイルにしています。)

2. 見慣れたデフォルトプロンプトをカラフルに!
PROMPT='%F{magenta}%B%n%b%f@%F{blue}%U%m%u%f %F{green}[%~]%f %# '

スクリーンショット 2019-12-18 2.17.03.png

ユーザー名と現在利用しているPCの名前、カレントディレクトリを表示するプロンプトです。

User_name@UsernoMacBook-Pro ~ %

Zshプロンプトのデフォルトデザインがこんな感じなので、デフォルトデザインに慣れている人にとっては見やすいプロンプトかもしれません。

3. 左右を広く使ったプロンプト
PROMPT='%F{green}[%~]%f %# '
RPROMPT='%*'

スクリーンショット 2019-12-18 2.27.17.png

PROMPT='%F{magenta}%B%n%b%f@%F{blue}%U%m%u%f %# '
RPROMPT='%F{green}[%~]%f'

スクリーンショット 2019-12-18 2.43.40.png

RPROMPTで右側にもプロンプト の設定をすることができます。

4.コマンド実行結果ごとに、改行を入れたい!
PROMPT='
%*
%F{green}[%~]%f %# '

スクリーンショット 2019-12-18 2.39.54.png

プロンプト の頭に改行を入れるとこのようになります。
隙間が空いている方が見やすい!という方は、改行をしてみましょう。

ここまでカスタマイズができれば、だいぶ使いやすいターミナルになってきたと思います!

5. さらに自由なカスタマイズがしたい!(オススメ参考資料)

ここからは、ここまでのカスタマイズでも満足できない!もっとカスタマイズしたい!向けです。

紹介したカスタマイズの例で使用しているコードの意味をまとめていきます。

プロンプトの設定
PROMPT=''
RPROMPT=''

zshのプロンプトは、PROMPT=以降に書かれた内容は、コマンドラインの左端に表示。
RPROMPT=以降に記述した内容は、コマンドラインの右端に表示されます。

文字に色をつける
%F{color}お好きなコマンド%f

%F{color}%fで挟まれた場所は、colorで定義した色に文字色を変えます。
ここで使っているコマンド以外にも背景色を設定するやり方もあったりします。
詳しくは、こちらのQiitaを参考にすると良いです。

zshでプロンプトをカラー表示する - Qiita

その他のコード
コード出力
%#プロンプト右端の%
%~カレントディレクトリ
%nユーザー名
%mホスト名
%Bお好きなコード%b太文字
%Uお好きなコード%uアンダーバー

その他にも出力できる項目はまだまだありますので、調べてみると面白いかもしれません!

zshプロンプトのカスタマイズ - Qiita
zsh 設定 - プロンプト -

沼に挑戦したい方

fishシェルを導入してみよう!
何も、シェルはbashとzshしかないわけではありません。
世の中にはfishシェルというシェルも存在します。
もし、自分が今使っている環境以外のシェルにも興味が湧いたら、導入してみると楽しいですよ・・・!

fish shellが結構良かった話 - Qiita

shellスクリプトを勉強してみよう!

こんなサイトがあります。一通り中身に目を通せば、シェルスクリプトの意味がだいたい理解できるようになるかも・・・?

UNIX & Linux コマンド・シェルスクリプト リファレンス

もうここからは趣味の領域になってきます。興味がある人はググってみてください!

終わりに

ターミナルのカスタマイズは、ハマると結構楽しいです!oh-my-zshを導入してみたり、zshの補完機能を強化したり、gitのbranch名やcommit状況を表示するなどなど、できることは無限大と言って良いでしょう。
本当にハマってしまうと一日中ターミナルのカスタマイズを永遠とカスタマイズしてしまう・・・なんて状況も発生してしまうかもしれません。

もちろんハマってみるとかなりプログラミングの勉強になります。私も、bashやzshのカスタマイズを通じて、隠しファイルの存在やプログラムファイルの保存場所、ディレクトリの概念や"PATHを通す"という概念に触れることができました。

ポートフォリオ作りに疲れた時、休みの日にターミナル環境弄りに挑戦したいなと感じた時、時間に余裕があって心に余裕がある時。そんなタイミングがありましたら、ぜひターミナル環境弄りにハマってみてください!


Viewing all articles
Browse latest Browse all 5608

Trending Articles