10
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

paiza cloudでポートフォリオを作ってみた感想

Last updated at Posted at 2019-01-03

新年あけましておめでとうございます。
年始休みでやることがないので書き初めに挑戦してみました。

ちなみに書き初めは1/2に行われることが多いみたいなので時すでに遅しです。

paiza cloudを使う

国産のクラウド開発環境で、docker上のUbuntu 18.04が動いているようです。
エディタやターミナル・ブラウザなどが統合されており、インターネットにつながる端末とブラウザさえあれば(あとまともなキーボード)これだけで開発環境が完成します。
image.png

今回はこちらの有料プランを使ってポートフォリオを作って外部からアクセスするまでを行いました。
有料プランでは、常時起動の外部に公開できるサーバーが利用できます。

新春ルール(?)

せっかくpaiza cloudを利用するので、以下のルールを決めて開発しました。

  • ターミナルに引きこもらない
  • paiza cloud以外の環境を一切使わない

普段は引きこもりオタクらしくターミナルに引きこもってvimで開発しているので、1つ目の条件を守れるかとても不安ですがなんとかやってみます。

環境設定

サーバの作成

今回は静的サイトのつもりなので、サーバー作成の画面でApacheだけを選択しましたが、この時点で選択したものが自動で設定されます。
また、特に理由はありませんが念のために公開鍵を登録してSSH出来るようにしておきます。
サーバー名に関しては全ユーザ間でユニークなものである必要があるようです。
image.png

$ whoami
ubuntu
$ groups
ubuntu

このユーザはパスワード要求無しでsudoが実行できます。

gitの設定

gitはデフォルトでインストールされています。
gitでバージョン管理したいので最低限の設定だけしておきます。

$ git --version
git version 2.17.1
$ git config --global user.name "Hoge Hogeo"
$ git config --global user.email "hoge@hoge.hoge"

また、今回は本番環境じゃないのでgitのhookを利用した簡易的なデプロイ環境を構築しました。
(本番環境でやると.gitにアクセスできちゃうのでマズイ気がします。)
/var/www以下にbareリポジトリを作成し、ubuntuグループに書き込み権限を与えます。

$ sudo mkdir /var/www/portfolio.git; cd /var/www/portfolio.git
$ sudo git init --share --bare
$ sudo chgrp -R ubuntu /var/www/portfolio.git
$ sudo chmod -R g+w /var/www/portfolio.git

とりあえず一度クローンしておきます。ApacheのDocumentRootの設定を書き換えるのが面倒だったのでそのまま使えるようにhtmlディレクトリにしました。

$ cd /var/www
$ sudo rm -r html
$ sudo git clone portfolio.git html

pushされた際に自動でpullが実行されるように、hooksにスクリプトを作成します。

$ cd /var/www/portfolio.git/hook
$ touch post-receive
$ chmod a+x post-receive
post-receive
#!/bin/sh

cd /var/www/html
sudo git --git-dir=.git pull

ここでちょっとハマった

paiza cloud側の設定でしょうか、ubuntuユーザを任意のグループに追加することができません
最初はstaffグループに権限を与えて、ubuntuユーザを参加させるつもりだったのですがbashを上げ直しても反映されませんでした。

# これでは反映されなかった
$ sudo gpasswd -a ubuntu staff
$ exec bash

しょうがないのでubuntuグループに権限を与えました。まあ問題ないし。

テスト環境

ローカルでの開発であればhtmlファイルをブラウザで開いてちょっとした確認、などと出来るのですが、paiza cloudではそうも行きません。
まともに動くかどうかわからないものをコミットするのは嫌なので、次の方法で動作確認を行っています。

$ ruby -run -e httpd . -p 適当なポート番号

これでカレントのリソースで簡易的なWebサーバが上がります。aliasとかに書いとくと便利です。
もちろん任意のポートでも外部からアクセスが可能です。

あとはかくだけ

ひたすらコーディングします。
以下はpaiza cloudを使ってみての感想。

paiza cloudで楽だったこと

環境構築がとにかく簡単

一応成果物を公開する時用にvultrでVPSを借りているのですが、なんかもうこれでいいかなあと思い始めています。そのくらい楽でした。
独自ドメインも設定できるし。
サクッと潰したりサクッと立てたりが簡単なのが精神衛生上非常に良いです。

Web開発だけでなく簡単なDiscord Botとかの常駐アプリもここで動かせるので、録画鯖とかのどうしてものときだけ自宅のサーバ使えばいいかなあ。

作業進捗の同期が不要

今回はずっと家にいたので進捗同期の必要はありませんでしたが、普段は学校で制作したり家で制作したりでその時々でマシンが違います。
こうなると進捗をなんとかして同期しないと行けないのですが、いろいろ手間があって面倒でした。

paiza cloudではログインすればどこでも前回のまま作業が保存されているのでとてもとても楽です。

慣れ親しんだLinux環境

私は普段からArch Linux環境を常用していたのですが、最近PCを買い替えてからドライバの都合でArch LinuxではなくWindows環境を使っています。
これがかなり不満で、WSLを使ってたみたりVMでArch Linuxを構築してみたりといろいろ試していました。
それでもどうにも納得できずという感じでもやもやしていましたがpaiza cloudでは素に近いLinux環境が使えるので結構しっくり来ています。

強いて言うならディストリが選択出来ると最高だけどそれは流石に求めすぎ…

paiza cloudでつらかったこと

ターミナルのフォントサイズが変更できない => 出来るようになった

2019-01-10 追記
この記事を開発者の方に見ていただいてからすぐに実装されました!
これでUIサイズは標準のまま見やすく使えるようになったのでめちゃくちゃ便利です。
(追記ここまで)

私はWQHDの環境をスケーリングなしで使っているのですが、流石にこれはしんどいです。
image.png

エディタはフォントサイズの変更が効きますがターミナルではできないようです。
ページそのものを拡大してしまえばなんとかなるのですが、するとUIまで拡大されてしまうのでうーん…
結局妥協して150%くらいに拡大して使っています。

vimバインドが使えない => 使えるようになった

2019-01-10 追記
ターミナルフォントと同様にこちらもすぐ実装されました!
これで無事基本的人権が保証され、ストレス無いコーディングが出来るようになってとても嬉しいです。
(追記ここまで)

用意されているエディタではvimのバインドが使えません。癖とは怖いもので、油断するとjjjjとか:wとかが散りばめられていきます。

最もつらいのがInsertモードを抜けるつもりでESCを押してしまった場合で、エディタからフォーカスが解き放たれるのでうっかりBackspaceでも押そうものならブラウザが前のページに戻ります。何度かやりました。
かといってターミナルに引きこもってたらせっかくのIDEが意味ないし…

エディタ部分はaceを使ってるっぽいので将来的にvimバインドに対応したりしないかなあと切実に思います。

慣れたキーボードショートカットが暴発する

例えば、paiza cloud上のブラウザを開いていて更新したいときに**Ctrl + Rを押すとpaiza cloudごとリロードされます**。
これはWebアプリとして動いている以上しょうがないのかなあなんて思うのですが、こんな感じで使えないショートカットがいくつもあり普段からキーボードのみで生活している人間にはちょっと苦しく感じました。

他には、開いているタブを切り替えるのにマウス操作が必要など。いい感じのショートカットがほしいです。

でもpaiza cloudはいいぞ

ちょっと不満な点もありましたが慣れればなんとかなりそうな気がします。
クライアントのマシンスペックを問わないところとか、面倒な環境構築がいらないところとか、すぐ捨てれるのでちょっとお試しで使ってみたい環境を作ってみれるとか、いろいろ可能性を感じます。

めちゃくちゃいい感じで気に入っているので、しばらくWebアプリ開発とかに使ってみようと思います。
せっかくだしvimバインドとか要望出してみようかなあ。

追記

この記事を開発者の方に見ていただけたようです。私が感じていた不満点がすぐにfixされ正直びっくりしています。
時々バグを見つけるとサポートに報告をしているのですが、その時も当日中にfixが入ったりしてすごいペースで改善されていきます。

こういうところを見ると、やっぱり安心できて使い続けたくなりますね。

10
8
4

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
10
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?