カテゴリーアーカイブ エディタ

著者:杉浦

ショートカット練習サイトShortcutFooの紹介

 ShortcutFooは様々なショートカットを練習するためのサイトです。ありがちなアプリのショートカットキーのみならず、正規表現、Ruby等の言語、ポート番号に割り当てられたプロトコルなど様々なモノの練習ができます。
Learn shortcuts and commands | ShortcutFoo

 基本的な使い方はDojosに行き好きな対象を選んでPractice、Testを繰り返すのみです。短時間で相当な回数反復できる様に作られているのでショートカットが分かってくると練習開始時より知識が増えたのを実感しやすいです。

 注意点としてテストに出なくともショートカットの説明文も併せて覚えるべき、という点があります。ShortcutFooでスコアを稼ぐには問題文とショートカットの対応を覚えるだけでどういう動作をするショートカットなのか覚える必要がありません。スコアを伸ばすことに集中しだすとショートカットの練習としてまるで役に立たなくなります。存在を知ったショートカットを適宜使用して動作も自身に定着させるべきでしょう。

  • この記事いいね! (1)
著者:杉浦

【PhpStorm】Redis連携用プラグインRedisの紹介

 PhpStormは主にWeb開発を主眼としたIDEです。データベース回りとの連携は便利なのですが、Redisとの連携は組み込みでありませんでした。プラグインの追加が必要になりますが、一択に絞れるような選択肢はありませんでした。いくつか試して最もおすすめなのはRedisです。
Redis – Plugins | JetBrains
 Redis(プラグイン)の特に良い点は二点、一つは画像の様なデータベースのGUIと同じように扱える程よく簡素なGUIです。


 熟達いらずに何となく分からない場所を触って確かめるだけで機能の多くを把握できます。
 もう一つは無料という点です。PhpStormのRedisプラグインの競合相手の大手には有料であるIedisがあります。
Iedis – Plugins | JetBrains
 こちらはRedisの外(Json、XMLなど)へ出力、Redisサーバ自体の設定などが詳細にできます。この辺り、プラグイン自体をソフトウェアに扱うならIedisに軍配が上がります。一方でRedisサーバとの読み書き機能自体はRedis(プラグイン)とそう変わりません。自分はデバッグ回りが主な使い道なのでRedisサーバとの読み書きこそが主になるので、無料である点の方が重要でした。

  • この記事いいね! (1)
著者:杉浦

【PhpStorm】PHP新規プロジェクトのパッケージ群が豪華

 プロジェクトはフレームワークを選定してインストに従って素地を配置。フレームワークに沿った上で自由にコーディングとするだけでできます。これでも勿論いいのですが、世の中にはフレームワークと個別の成果物の合間にあるようなプロトタイプのパッケージも多くあります。PhPStormは下図の赤丸の様にフレームワークのみならず、そういったプロトタイプもカバーしています。

 何をしているかというとcomposer create-project hoge/fugaで生成されるプロジェクトの一覧を用意し、適宜composer create-projectしています。
 PHPには自らを呼び出すためにHTTPサーバを用意することができます。Laravelをはじめとしていくつかのフレームワークはこの機能をリッチにラッピングしています。
PHP: ビルトインウェブサーバー – Manual
 この組み込みサーバと合わせることで、すぐにそれらしいものを扱えます。Laravelならばenv編集, npm install, artisan migrate, artisan seed, npm run devでフロントエンド、バックエンドが大体完成です。
 このある程度何かが作られたプロジェクトパッケージの中にはDB等のリソースさえ用意すれば、もうそれだけで製作者が望んだ完成品になるようなものもあります。使い方次第でアプリのダウンロードの様にも扱えます。

  • この記事いいね! (1)
takahashi 著者:takahashi

VSCodeでプレゼンテーションモードを実現するプラグイン”Presentation Mode”

勉強会などで実際にコーディング風景を画面に映しながら説明をする際、エディタのフォントサイズを上げたり、ズームしたりして文字の大きさを大きくしたうえで使うことがあるかと思います。

しかし、普段からよく使うエディタでこういった変更を行ってしまうと後で戻すときに”アレ…普段って何pxで設定してたっけ…”ってなってしまうことがあります。

VSCodeでは、一時的にプレゼン用に一発で大きく全画面表示することができ、プレゼン終了後に元の大きさに一発で戻すことができるプラグインがあります。

Presentation Mode – Visual Studio Market Place

このプラグインをVSCodeにインストールした状態で

Ctrl + shift + P

キーを押してコマンドパレットを表示し

presentation mode

と入力します。

すると

“Presentation mode”

という選択肢が出てくるので選択します。

左側が、通常の画面なのですが、これが一発で右側のように全画面表示になります。
また、プレゼンテーションモード中にEscキーを押すとすぐに解除され、一発で元の画面に戻ります。

Escキーですぐに戻ってしまうのが若干難点に感じますが、人前でライブコーディングする場合などにとても便利な機能です。

興味のある方は是非一度試してみてはいかがでしょうか。

  • この記事いいね! (0)
takahashi 著者:takahashi

VSCodeでパンくずリストを有効にする方法

有料のPHP用IDE”PHP Storm”には、カーソルの現在地がプログラムのどの位置に居るのか(どのクラスのどのメソッドの中にカーソルがあるか、など)を”パンくずリスト”の形で表示してくれる機能があります。

長いコードを見ているとしばしば今自分がどの位置にいるかわからなくなることがあるので、この機能はあるととてもありがたいです。

さて、この機能、有料のIDEにしかない便利機能かと思いきや、実はオープンソースのエディタ(という名のほぼIDE)のVSCodeでも使用することができます。

VSCodeでパンくずリストを表示するには、VSCodeの設定画面から有効にする必要があります。

まず、右下の歯車アイコンから”設定”をクリックします。

すると下のような設定画面がでてくるので、検索欄に breadcrumbs.enabled と入力します。

すると設定がフィルタされるので、その中から赤枠の

Breadcrumbs: Enabled

の項目のチェックボックスをオンにします。

これで設定は完了です。

あとはフォルダごと開いた状態でプログラムを確認すると…

VSCodeでもパンくずリストが表示できます…!

このパンくずリストがあるだけで、コーディング中に”遭難”する率がかなり減るので、VSCodeを使っている方は是非一度試してみてください。

  • この記事いいね! (0)
著者:杉浦

【PhpStorm】ショートカットキーのリストを表示するショートカットキー

 PhpStormのできることは膨大でそのできることに対応しているショートカットキーの数もまた多いです。その様に多いショートカットキーを覚えられる人は稀でしょう。これの対策なのかいくつかのショートカットキーをグループ化したショートカットキーのリストのポップアップを表示するショートカットキーが用意されています。このリストをクイックリストと言います。
クイック・リスト – 公式ヘルプ | PhpStorm
クイックリストの設定 – 公式ヘルプ | PhpStorm
 私がよく使うのは大体次の三つです。
 Alt+Enterによる今カーソルが当たっているコードを改善する提案の表示。厳密にはクイックリストと違いますが感覚的に似ているので挙げました。

 Ctrl+Shift+Alt+Tによるリファクタリング操作の表示。

 Ctrl+Nによる何かしらの目印の名前検索の表示。これはTabで選択を動かせます。

  • この記事いいね! (0)
著者:杉浦

【PhpStorm】deep-assoc-completionプラグインの妙な機能

 deep-assoc-completionはPHPの配列のキーを探索するプラグインです。これのおかげで連想配列を予測補完でき、配列を扱うのが楽になります。
deep-assoc-completion – Plugins | JetBrains

 あっさりしたいいプラグインなのですが配列に関係なさそうなPhp->JSの翻訳機能がついていました。次の様な翻訳が働きます。

 昔のエキサイト翻訳ばりの怪しさですが、JavaScriptのコードになっています。少なくともクラス、ファイルあたりの各依存関係を解決する必要があり、微妙な手直しも必要なのでフレームワークのコード全体をコピーすることはあまり得でないでしょう。一方でLaravelのhelper関数、バリデーション関数の様な小さな閉じたコード、緯度経度と平面直角座標を変換する長い四則演算のコード、といったものを変換するのには便利です。
 この機能は実験的機能であり実現するにしても随分先の話ですが、JavaScriptへの変換精度を上げる、webpackかnpm runか何かのビルド用スクリプトに組み込む、の二つが出来ればJavaScript、PHPの両方をサポートする一つのプログラムファイルを作るなんてこともできそうです。

 python to javascript transpilerやpython to php transpilerでググるとまあまあ件数が出てきました。pythonを第3言語ないし中間言語として扱えば現時点でもJavaScript、PHPの両方をサポートする一つのプログラムファイルを作ることは現時点でも現実的?

  • この記事いいね! (0)
著者:杉浦

【Laravel】【PhpStorm】Laravelプラグインの参照、移動機能

 Laravelはよく文字列で特定のパスの対象を指定します。それは配列であったり、ファイルであったり、メソッドで合ったり様々です。プラグインはこの指定の入力補完と移動を容易にします。これがあるとどこかしらを見ながら手打ちするといった手間を省けます。
Laravel – 公式ヘルプ | PhpStorm
Laravel – Plugins | JetBrains
Haehnchen/idea-php-laravel-plugin: Laravel Framework Plugin for PhpStorm / IntelliJ IDEA
 下画像のcompletion, gotoが予測と参照先への移動のついた機能です。

 コード補完は次の様に説明されています。

 静的解析の時点でコード補完が出来るぐらいに宣言を把握できる、ということは宣言の場所に移動することもまた可能です。Ctrl+Bはここでも便利です。

  • この記事いいね! (1)
著者:杉浦

【PhpStorm】PhpStormのショートカットキーを覚えるためのプラグインKey Promoter X

Key Promoter X – Plugins | JetBrains
 Key Promoter Xは何らかの操作を行った際、その操作に対応するショートカットキーがあるならば、そのショートカットキーを通知するプラグインです。これを用いることでPhpStormをより効率的に使えるようになります。
 具体的に何をするかというと次のgifです。

引用元:Key Promoter X – Plugins | JetBrains
 コマンドを打ち込むとやかましいくらい通知が出ます。ショートカットキーによる操作を心がけることで、このうっとおしい通知を減らします。この心がけが長く続くと、知っている操作をほとんどショートカットキーで行う様になります。
 このプラグインは知っている操作をよりうまく行うための矯正具です。真により上手くPhpStormを使えるようになるためには、このプラグイン以外に頼るのみでなく、知らない操作を吸収していくことが更に必要になります。

  • この記事いいね! (2)
著者:杉浦

【PhpStorm】Gitの範囲差分操作

 PhpStormはコーディング画面のままGitに関連した便利な操作ができます。画像の様な差分を表す部分をクリックすると変更前のコードが現れます。ここからショートカットで色々できます。

 よく使うのが差し戻しとコピーです。差し戻しは次のgifの様に戻るアイコンをクリック。この部分だけgitのhead部分のコードに戻せます。

 コピーはgifのようにメモアイコンをクリック。変更前後の動作の比較などに便利です。

 他にも差分へ移動、詳しい変更点の強調など細やかな操作が可能です。

  • この記事いいね! (0)