Laravelを使ってみよう【#14】エディタを変えたい

エラーが出た時に検証しにくいのでエディタを変えたい

前回の記事でついにLaravelプロジェクトを表示することができて超上機嫌なのですが、その後ローカルでやっていたことを復習しながらいろいろやっていると、表示できないページが出てきた。

具体的に何かエラーが出るわけじゃないので原因を調べないといけないのですが、ページが表示できないということはおそらくMVCのいずれかもしくはすべてのファイルが、権限などの都合でコマンド打ったときに作成できていないのではないかと予想しています。

そうなるとまずは各ディレクトリを見てできていないといけないファイルができてるか確認したいのですが、SSHで各ディレクトリに移動して内容確認するのが非常に面倒くさい。

よくあるエディターみたいにディレクトリ一覧があってツリー表示みたいな感じで中身がパカパカ見られたら便利なのになぁ…と思って調べました。

Visual Studio Codeを使ってみる

Microsoftが開発しているVisual Studio CodeというエディターにSSHにリモートで繋ぐ機能があるということで入れてみます。けっこう前にAndoroidのアプリ作ってみたいなぁと思って一回入れたことありましたね。前職で忙しくて頓挫しちゃってそれっきりでしたが…。

だから追々Androidの開発もできるかもしれませんね。インストールはこちらのページからダウンロードしたzipを解凍してアプリケーションフォルダに入れるだけ（mac）。

起動したら英語だらけでどわー！ってなりましたがすぐに日本語パッケージをインストールして再起動してくれる親切設計。起動も早いです。

ドキュメントのページを見るとSSHの表記がありますね。いろいろ触ってみましょう。

初期設定いろいろありましたがすっ飛ばし、メニューの拡張機能のところで「remote」で検索してみます。

気になるのがありますね。普通のRemoteってのとEditing Configuration Filesってのがあるんですがどっちがいいんでしょうか。編集できるほうがいいから下か…？

調べると上ので良さそうなので上のをインストール。

メニューと左下にアイコンが増えてます。

ローカルのエディタソフトでSSH接続する場合はソフトのほうで秘密鍵というのを生成して、それをサーバー側に登録？することで許可ができるというものみたいです。左下の緑のアイコンをクリックすると、

ホストに接続するを選択し、/Users/xxxxxx[macのユーザー名]/.ssh/configをクリックします。windowsだっただCドライブのなんたらかんたらって出るみたいです。

このconfigファイルにgoogle cloudで作成したインスタンスの外部IPと、ターミナルなどで作成した秘密鍵のユーザー名、解放してるポート番号などを決まった書き方で書きます。

Host Report-Laravel-GC
    HostName xx.xxx.xxx.xx
    User xxxxxxxxxx
    PasswordAuthentication no
    IdentityFile ~/.ssh/report    
    IdentitiesOnly yes
    Port xxxx

いろいろ設定できるみたいですが、とりあえずこれだけ書いとけばssh接続が可能になるようです。

host 〜は接続の設定名、HostNameは外部IPアドレス、Userは秘密鍵を作成したときのユーザー名、PasswordAuthenticationは秘密鍵以外にパスワードを設定するかどうかを設定します。これはnoで大丈夫です。IdentityFileは秘密鍵を作成した場所を表記します。IdentitiesOnlyは指定した秘密鍵のみを使用するかどうかでyesで大丈夫です。その他の設定はこちらのページが分かりやすかったです。

秘密鍵なのですが、これはローカル側で作成し、サーバー側に登録することでローカルからアクセスした際に照合して一致した場合接続を許可するものだそうです。作り方なのですが、ターミナルを開き（windowsならコマンドプロンプト？）、

$cd ~/.ssh

を入力、ユーザーディレクトリの.sshというディレクトリに移動できます。ここでディレクトリがないと言われた場合作って自分で大丈夫みたいです。

その中で秘密鍵を生成するコマンドを実行します。

$ssh-keygen -t rsa

入力すると.sshのディレクトリ内に、id_rsaとid_rsa.pubというふたつのファイルが生成されます。

id_rsa.pubのほうのファイルの内容をgoogle cloudのインスタンス内にあるSSH認証鍵のところに追加します。

これが公開鍵と言われていて、この内容と、id_rsaの内容を符号のように照合して接続の許可をしています。

cat ~/.ssh/id_rsa.pub

このコマンドで内容の確認ができます。

登録後、インスタンスの詳細ページのSSH鍵の部分に貼り付けた内容が表示されていれば成功です。ここに表示されているユーザー名と作成した認証鍵名（ここではid_rsa）をconfigファイルに入力します。

※認証鍵のファイル名は別のものにすることも可能です。複数プロジェクトで複数のSSHに接続する必要がある場合などは別にしたほうがいいかもしれません。

$ ssh-keygen -t rsa -f id_rsa_hoge

-f以降でつけた名前をファイル名にできます。

これで接続できるはず…

見れました！ターミナルも使えるみたいですね。すばらしい…

さいごに

vscodeなんで今まで使ってなかったんだろうというくらい動作も早いしいいですね。

次回はlaravel学習の際に１から順番にやっていたことをgoogle cloud上でやっていこうと思います。

最初からつまずいてますが…。

お知らせ

株式会社プラン・ドゥではphpとデータベースを利用したアプリケーション開発を行なっております。
wordpressでのホームページ作成、phpのスクラッチ開発などが可能です。
業務効率化等でお困りのことがございましたら、システムのご提案からさせていただきますのでお気軽にご相談ください。

その他の取扱商品はこちらからご覧いただけます。
http://plando-inc.co.jp/product

お問い合わせはこちら

前の記事へ次の記事へ