狐好きぷろぐらまー

狐好きプログラマーのブログです。

【Tool】最近開発で使っているツールについてまとめてみました【macOS】

こんにちは。pregum_foxです。

最近使う電子マネーSuicaからQUICPayに変えてみたのですが、通知のタイトルを初めてみたときシンプルすぎて少し笑ってしました。

支払い自体はスムーズでチャージもしなくてよいので、今後も使っていこうと思ってます。

概要

さて今回は、最近開発で使っているツールをまとめてみようと思います。

いわゆる「ぼくのかんがえたさいきょうのつーる」のつもりで書いていますので

  • 「このツールの方が良いでしょJK」
  • 「このツール使ってないとか、にわか乙」
  • 「それ、GPTでできるよ」

などがあれば、コメントもらえると嬉しいです😉

注意点

この記事の対象OSはmacOS です。

ですのでWindows ならこれがあるやLinux では〜〜 などは聞き流してしまうのでご注意ください。

また、対象はモバイルアプリ・Webアプリの方をターゲット層のつもりで書いています。

インフラ系の方にはお口に合わない可能性があります。

その場合でも色々ご意見いただけますと幸いです 🙏

以下目次です。

バックグラウンド

普段どのような開発をしているか説明します。

普段はモバイルアプリの開発をやりつつ、React.jsやCloud Function for FirebaseなどのNode.js + TypeScriptのコードも書いていたりしています。

ですので、バックエンドは知ってるぐらいで詳しくないです。

趣味では、FlutterやBaaSの勉強をしつつ個人開発を細々とやっています。

そんな人間がよく使うツール一覧をまとめましたので、その認識で読んでいただけると幸いです。

ターミナル

まずは必ずと言っていいほど皆さん使っているターミナルについて書いていきます。

Warp

今年の中頃ぐらいから確かWarpを使い始めた記憶があります。

以前はiTerm2を使用していたのですが、Rust製の新しいターミナルアプリということで試しに使ってみたところ、見た目がカッコよかったのでそのまま使っていました。

サインインが必要ですが、GitHubアカウントが使えるので特に問題ないかと思います。

使っていて便利だと感じた点

  • デフォルトのキーバインドctrl + space を入力すると、サイドウィンドウでWarp AI(GPTみたいにチャット形式で対話できる機能)が表示され、そこでコマンドの意味などを聞いたりできる
    • ターミナル上でオプションなどについては、大体これで解決するようになったので楽です
    • gitコマンドやちょっとしたシェルスクリプトを組む際に、2ファイルの1行目だけ取り除いて連携してほしいみたいなことを聞くとそれができるコマンドを返してくれます
    • ちなみに1日100回までなら無料で聞けますが、今のところ100回超えたことはないです

画像はこんな感じです。

Warp AIにgit rebaseコマンドについて聞いているところ

  • もちろんzexaなどのコマンドも入れて使えます
  • cmd + d で画面分割ができcmd + [cmd + ] で左右のパネルを移動できます
    • 普通にタブも開けます
  • ちょっとしたワークフロー(スニペット的なもの)も登録できるので、複数行にわたるコマンドはワークフローに入れておいて呼び出すと良いかもです
  • Hot keyの設定ができるのでどの画面にいても一発でターミナルの表示ができる点が嬉しいです
    • もちろん同じウインドウを表示してくれるので、表示直後に一つ前のコマンドをhistoryから引っ張ってこれたりできます
    • ただ、Intel Macだとうまく動かない時があったので、その時は後述するRaycastのHot Keyで代用していました

少し困っている点

git コマンドを書く時に少し困っていることがあって、

  • 全角フォントが確定中は表示されない

という不具合が存在していて、まだ安定はしていないようです。

github.com

github.com

Spotlight系

Raycast

デフォルトで入っているSpotlightと同様の機能を持ったソフトです。

Raycastを使う前はAlfred を使っていましたが、ミーハーなので新しいものを試してみたりしていました。

その中でRaycastの方が嬉しい機能がついていたりして特に困った不具合もなかったので、Raycastに乗り換えました。

便利な点

  • Window Management というコマンドがデフォルトで存在していて、Windowsでよくやる画面分割(左右半分表示、表示モニタ移動、最大化、最小化、etc...)が無料でできるのが個人的にはすごい便利な点で今ではHot Keyに登録して使っています
    • 豊富なウインドウ操作コマンド
  • Quicklink に自分がよく使うサイトのURLを登録しておいて、名前でそのURLへ飛べるようにできるので毎朝のルーチンで使うページはとりあえず登録して、情報をまとめているスプレッドシートのURLやChatGPTのURLを登録していたりします
  • Quicklinkに似た機能でSnippet もあるので、そちらはちょっとした議事録のテンプレや作業メモのテンプレなどをとりあえず入れておいたりしてます
  • Toggle Floating Notes Window というコマンドを使うと、最前面に表示される簡易的なメモ帳を表示して、VSCodeを開いたりせず残しておけたりできます
    • ちょっとしたtokenだったり、DBのデータをちょっと入れ替えたりする際の書き残し先として使っています
    • これもHot Keyでctrl + cmd + ; で登録しています
  • コピーしたクリップボードの履歴をRaycast上でペーストできるところ
    • 地味に嬉しいのが、画像も同様にペーストできるので、間違えてテキストをコピーしてしまってもRaycastのClipboard History コマンドから取得できます

試してみたい点

  • Raycast Pro にアップグレードすることで、Raycast AIが使えるようになって、ChatGPTを開かずにRaycast上で完結できるようになるみたいなので、試してみたいなと思ったりしています。

作業記録系

toggl

作業記録ができるツールです。

最近複数の案件を持つことがあって、その時にどの案件にどれぐらいの時間をかけたかということを記録する際に重宝しています。

後は単純にどれぐらい作業がかかったか後で振り返る際為に作業ごとにプロジェクトを関連づけておくと、グループ分けされるので使いやすいです。

無料枠で今の所十二分に快適です。

画像は、ちょっと具体的な作業名を書いていたりするので出せませんが、ミニウィンドウもあるので手軽にStart, Stopができます。

また、時間を少し調整したい時も編集はできるので、間違えた時は調整して整えたりしています。

Window移動(cmd + tab的なもの)

AltTab

以前会社の人から教えていただいたもので、Macのデフォルトショートカットだと以下の点が不満でした。

  • 同じソフトのウィンドウがまとめられてしまう
  • 対象のモニタだけのソフトだけで移動ができない

上記の不満を解消してくれる素敵なツールです。

嬉しい点

  • vimキーバインド(h, j, k, l) で移動が可能
  • 移動中にウィンドウのキルができる(cmd + wcmd + q どちらも可能)
  • カスタムすることで、アクティブなソフトのウィンドウだけ表示させることも可能

ちょっと悲しい点

  • 一つ前のウィンドウを開こうとした時、最短でキーを離すとうまく切り替わってくれない時があります
    • なので、気持ち0.1ほど待ってキーを離すと良いです

git操作

tig コマンド

ターミナル上で、gitの色々な操作ができるツールです。

最初はgit status や git push 、git checkout(git switch) やgit resetなどをそのまま打っていましたが、毎日結構な頻度で打つと手が疲れてくるので、良さげなツールを探しているとtigというCUI上で動くgitのクライアントツールを見つけたので、試しに入れてみました。

1年ちょっと使っていると思いますが、便利です。

使ってみようかなと思った方は以下の記事を参考に試してみてください。

便利な点

  • push以外であれば大体できる
  • SourceTreeのようにビジュアライズされたgraphが表示される
  • 1ファイル内のhunk(塊)単位でstaging や unstagingができる
  • vimキーバインドで大体移動ができるところ
  • そこまで操作が複雑ではないので、1週間あれば業務で使用する範囲はカバーできるかなと思います

少し手を加える必要がある点

  • push 操作はデフォルトでは存在していないので、設定ファイルをいじってpushできるようにする必要があります
    • 私は 設定方法がわからない pushはターミナル上で確認しながら叩きたい派なので、特に設定していません

上記のpushができるようになって、もう少しリッチになったCUIクライアントを紹介します。

lazygit コマンド

つい先週こんな便利なツールがあることを知ったのですが、今使ってみてtigから乗り換えようか迷うぐらいには便利でカッコいいです。

便利な点

  • pushも含め基本的なgit コマンドが実行可能
  • git logが表示されているので、どの変更が入っているかがわかりやすいです
  • 日本語化可能
  • 自分でキーバインドを変更可能

少し困った点

  • キーバインドがtigで慣れていたので、若干新しいキーバインドを覚える学習コストがあります
  • 色々できるので、下手にショートカットキーを押すとどんなそう探されたかわからないので、最初は練習しておくと良いです
    • ? キーを押すことで、ショートカットキーの説明が表示されます

gh コマンド

  • Git Hub謹製のCLI
    • ターミナル上からリポジトリのブラウザへ飛べたり、プルリクをターミナル上で作れたり、マージできたりします

こちらの方の記事を見てある程度使い方を覚えました。

GitHub CLIで始める快適GitHub生活 #Git - Qiita

嬉しい点

  • プルリクエストのブランチへのチェックアウトが楽です
    • ghコマンドを使う前は結構難しいコマンドを打たないといけませんでしたが、今はGitHubのプルリクのページにコピペでチェックアウトできる項目があるので楽になりました
  • Chromeを開いてGitHub開いて、リポジトリ開いてという作業がなくなりました
    • ターミナルから直接開けるので楽です

クリップボード

Clipy

クリップボードの履歴を保持してくれるソフトです。

RaycastのClipboard historyと用途は被りますが、 こちらはすぐに貼り付けたい時に使っています。

嬉しい点

  • ショートカットキーでコンテキストメニュー形式で表示されるので、表示領域を占有されない
  • サクサク動作するので、手軽にコピペができます

ブラウザの拡張機能

vimium

この拡張機能Chromeのスクロールやnavigation操作をvimキーバインドでできるようにする拡張機能ですが、vimmerchromeには大体入っていると言っても過言ではないと思うぐらいには、使われている拡張機能だと思います。

嬉しい点

  • vimキーバインドでブラウザ操作ができること
    • ボタンまでカーソルを持っていかなくてもfキー押してaとかでボタンがクリックできるので楽です
    • ブラウザでもvimキーバインドが使用できるのでvimを覚える際にお世話になりました
      • 使う頻度が多いブラウザでもvimキーバインドを使うと学習時間を大幅に増やすことができました

悲しい点

  • 使えないサイトもあったりするので、その時は大人しくマウスで操作しています。

CLEAN crxMouse Gestures

マウスのジェスチャーでブラウザ操作ができる拡張機能です。

こちらはマウスだけで操作している時に罰ボタンを押さなくても右クリックしながら↓→へマウスを動かすとタブを閉じたりできる優れものです。

ボケーっとしながらネットサーフィンしている時によく使っています。

嬉しい点

  • 今のジェスチャの状態で話すと何が起こるか画面上に表示されているので安心して操作ができる
  • 移動した順番と方向がわかるので、次回同様の操作をしたい時にも思い出しやすい
  • デフォルトで大体使うジェスチャは登録されているので、特に設定しないまま使い始めることができる

対応が必要な点

  • 最初開くページはもしかするとジェスチャが効かない設定になっていることがあるので、全てのサイトで動作するように右上のメニューから設定が必要です

ちょっとした変換

Macのデフォルトの変換ショートカットキー

あとはMacのデフォルトの変換ショートカットキーを記載致します。

  • Macのデフォルトショートカットキー
    • ライブ変換中に以下のショートカットキーを押すと変換できるので、変な変換になった際に役立ちます
      • ctrl + j : ひらがな
      • ctrl + k : カタカナ
      • ctrl + l : 全角英字
      • ctrl + ; : 半角英字
  • 半角英字とひらがなはたまに使います
    • カーソル移動で以下のショートカットはテキスト入力時はほぼ毎秒使うぐらいには使っています
      • ctrl + a : カーソルを先頭へ移動
      • ctrl + e : カーソルを末尾へ移動
      • ctrl + h : カーソルを一文字消しつつ左へ移動
      • ctrl + f : カーソルを一文字右へ移動
      • ctrl + b : カーソルを一文字左へ移動
      • ctrl + k : カーソルより右側の文字を切り取ります
      • ctrl + y : ctrl + k で切り取った文字を貼り付けます
      • ctrl + p : カーソルを1行上に移動
      • ctrl + n : カーソルを1行下に移動

メモ帳

Scrapbox

オンラインで使えるちょっとしたメモの切れ端です。

特にサーバを立てなくても使えるので手軽に始めやすいと思います。

個人的には3年前ぐらいから使い始めていて、今は500pageぐらいになりました。

来年は650pageぐらい貯められると良いなと思っています。

どんな感じかみたい方は他の方が公開しているScrapboxのプロジェクトを見てみると良いかもです。

Scrapbox自体は以下のような意味らしいです。

[Scrapbox]とは、[工作]や[手芸]、[裁縫]の材料や道具を入れておく[棚]の事

Scrapboxという言葉の意味 から引用

またScrapboxはScrap と boxで分けるとまた違った意味になるそうです。

Scrapboxという言葉の意味

ちなみにこの記事のベースもScrapboxでまとめていました。

嬉しい点

  • 無料でプライベートプロジェクトが使用できるので、自分だけのメモ帳が作れます
    • ちょっとしたクローズドなメモも残しておけるのが個人的には嬉しいです
  • カスタムcssを設定することでタイトルにキーワードが入っている一覧には表示させないメモを作ることができます
    • 秘密/~~みたいな感じなタイトルをつけることで表示させなくできます
  • まとめたメモごとにTagを自分でつけられるので、関連する情報を閲覧しやすくできます
    • 調べるときに「iOS」や「Flutter」ってワードで調べると以前の自分が困ったことが出てくるのでわかりやすいです
      • ブログをよりもっと雑にしたような感じで使っています
  • 複数人で同時に編集もできるそうなのですが、ぼっちなので一人で使っています

ちょっと辛いところ

  • md形式ではそのままだと出力されないので、md形式に変換するにはconvert用アプリを使う必要があります

VSCode

こちらはおそらく使用されている方も多いかと思います。

  • エディタ兼 IDE
  • cmd + shift + o でメソッド名やメンバへ飛べたりするので嬉しい
  • cmd + shift + p でファイル名を検索・表示できたりするので嬉しい
  • 拡張機能が豊富で嬉しい

【VSCodeVim】vim-plugを使ったことがないけど、VSCodeVimからVSCode Neovimに移行した【VSCode Neovim】 - 狐好きぷろぐらまー

トンネリング

ngrok

  • webhookをローカルで試したい時とかに一時的にローカルサーバにネットワークから接続するための公開URLを発行してくれるツール・サービス

    • もちろんターミナルを閉じれば(=プロセスを終了すると)、外部のネットワークからは接続できなくできます
    • 開発中に毎回開発環境にデプロイするのが大変な時とかに役立ちます
    • ただ、ほとんどないと思いますが、URLだけでアクセスできるので、公開したサーバーに秘匿情報や個人情報も見えるものを置いておくと他人が盗み見れる可能性がある点だけ注意してください
  • VSCodeに同様の機能が搭載されたようなので、VSCodeで開発している時はそっち使う方が楽かもです

qiita.com

npmなどのバージョン管理ツール

anyenv

rbenvやnodenvなどの~~envを管理するツール

個人的にはDockerはまだ使いこなせていないので、このあたりのツールで頑張っています

よくcocoaPodsの操作でrbenvを使ったり、Cloud Functions for FirebaseでNode.jsを使う際にこのanyenvを入れているとプロジェクトごとに管理できるので良いです。

fvm

Flutterをプロジェクトごとに管理する際に使っています。

ホームディレクトリでfvm use stable --force としておくと、どこでもflutterコマンドが使えるようになるので、便利です。

vscodeに認識させる時には .vscode/settings.json に書いておかないと、プロジェクトごとのバージョンではなくPATHが通っているflutter sdkのバージョンを使おうとする時があるので注意が必要です。

homebrew

macOSデファクトスタンダードなパッケージ管理ツール

大体コマンド系のリポジトリのREADME.mdにはhomebrewでの導入手順が記載されていて、そのコマンドを叩けばインストールされます

WindowsではchocolateyLinux ではapt などがあります。

一時期Apple Silicon chip が出始めた時はIntel chip と Apple Silicon chip でそれぞれのhomebrew を用意する対処が必要だったりして、混乱もありましたが今では基本的に全てApple Silicon chipのhomebrewで困ったことは1,2年ぐらいないです。

SlackやChrome、zoom名どのデスクトップアプリも大体登録されているので、特に理由がない限りはhomebrew経由で入れておくと良いと思います。

アプリ名 homebrew とかで検索すると大体コマンドが載っているページが1つ目ぐらいに表示されます。

IME関連

英かな

USキーボードだと「英字」、「かな」キーがない為、代わりにcmdキーで代用してくれる常駐ソフトウェア

Karabiner-Elements

これもキー入力監視系の常駐ソフトウェアなのですが、こちらはより細かいカスタマイズができ

  • caps lock キーをctrlキーとして入力させる
  • 右のcmd(⌘)キーをF18キーとして入力させる

ということができます。

私は前述した英かなと組み合わせて右のコマンドをF18キーにしてF18キーをかなキーとして認識させています。

なんでわざわざF18キーにしているかというと、右の⌘キーを押しつつ「を」を入力しようとすると、ウィンドウが閉じるということがよくあったので、物理的に使っていないファンクションを探すとF20まで使えたので、最後と最後から2つは何かのソフトウェアで使われていそうで怖かったので、F18あたりに割り当てて使っています。

感想

今回はツールの紹介だけで終わりましたが、まだ完全には紹介しきれていないので、また時間がある時にまとめて紹介できれば良いかなと思います。

また書いていて思い出したり、追加するものがあれば追記します。

ここまで読んでいただきありがとうございます 🙏

参考URL