カテゴリー: Web開発

  • ジメジメしてたまらないので Vultr で VPS を借りて Mattermost を入れてみた

    ジメジメしてたまらないので Vultr で VPS を借りて Mattermost を入れてみた

    読者のみなさま、こんにちは。管理人のたかきです。

    気づけば季節はもう初夏ですね。皆様お元気でお過ごしでしょうか? 私の住んでいる地域も梅雨入りしてジメジメした日々が続いています。あまりにもジメジメが続くとなんだか気が滅入りますね。こんな時どうしたらいいのでしょう… 私のひねり出した答えはこうです。VPSを借りるのです!!

    Vultr で VPS を借りた

    突然何言ってんだこいつ、と思われた方が多いかもしれません。VPS を借りることがどうしてジメジメ問題の解決につながるのかについては後ほど説明するとして、とにかく私は VPS を借りたのです。そう、このクラウド全盛期にも関わらず…

    VPS という言葉にあまり馴染みのない読者のために一応説明しておくと、VPS とは Virtual Private Server (仮想専用サーバー) の略です。KVM などの仮想化技術を利用して、サーバー事業者の持つサーバーの資源を仮想的に分割し、その一部をユーザーに貸し出してくれるサービスです。

    ちょっと違うかもしれませんが、イメージとしてはキャンプ場みたいな感じです。お金を払ってキャンプ区画を借りて、そこで自由にキャンプを設営する(サーバーを構築する)ようなイメージです。

    …などと書いておいて、あまり良いたとえではないような気もしてきました (笑) まあ、とにかく事前に決められた計算資源を定額で借りることができる良い感じのヤツなのです(強引)。

    VPS のいいところを挙げると、レンタルサーバーよりも自由(OSから自分で好きなものを入れることができるし、固定IPアドレスを割り当ててもらえる)で、クラウドよりも割安(EC2などが競合ですね)です。一方でセキュリティパッチの適用を自分でやらないといけなかったり、急激にアクセスが増加した際に柔軟にスケールすることができないという欠点もあります

    最近は AWS や GCP に代表されるパブリッククラウドが爆発的に浸透したので、イマドキVPSを借りる人はそれほど多くないのかもしれないのですが、今の私のように趣味で自由に好き勝手できるサーバーを安く借りたいという人にはぴったりのサービスです。

    そんなこんなで私が借りた VPS は Vultr という事業者が提供する Cloud Compute というサービスです。Cloud とついているのは EC2 などを意識して、時間単位で課金される点などを強調しているのだと思います。たぶん。

    実は私は2016年頃からさくらインターネット、ConoHa、Vultr それぞれで VPS を借りたり解約したりを繰り返しておりまして、数年前に Vultr を利用した際には VPS と記載されていたものと記憶していましたので、久々にページを見てみたら謎の文言に変わっていて困惑しました (笑)

    今回 Vultr にした理由は端的にいって「安い」からです。最も安いプラン(512MBメモリ、IPv6アドレスのみ)は月々2.5ドルからと激安です。牛丼を食べるよりも安くサーバーを借りられます。私は少し余裕を持たせるためにメモリ1024MBのプランを契約しましたが、それでも月々5ドルとかなりお手頃。ありがたい。

    …と書きましたが、他社サービスやクラウドと料金を厳密に比較したわけではないため、鵜呑みにしないでくださいね。実際に契約される際は丁寧に比較してくれている記事などをご参照ください。

    VPSのセットアップ

    VPS を借りたら、たいていの場合は契約画面で選択した OS (今回私は Ubuntu Server 20.04 LTS にしました) がインストールされた直後の状態で SSH アクセスできるようになっています。ただ、その状態から実際に使用するまでいくつかのセットアップをしなくてはならないので、それをバリバリやっておきましょう。

    実は私が自宅サーバーをやっていた8年程前から今まで、Linux サーバーを構築する際に必ず参考にさせていただくすばらしいサイトがあります。それがこちらの Server World という神サイトです。
    ちゃんとブックマークしましたか?

    というわけで、このコマンドを打って設定ファイルをこのように書き換えて… というのはこちらのサイトの情報を参照いただくとして (ただ説明から逃げただけw) 、私が実際におこなったセットアップを箇条書きにして残しておきますね。

    1. ソフトウェアのアップデート
      昔使っていた apt-get が気づけば apt に変わっていました。使い勝手は変わりませんでした
    2. 一般ユーザーを作成して sudo できるように
      root ユーザーで全部やるのは怖いです。admin 等のユーザー名はよくリスト型攻撃に使われているので、一般ユーザーの名前も一般的なものは避けた方が良いと思います!
    3. SSH を鍵認証にしてポート番号変更
      鍵認証のほうが安全ですし、パスワードを打たなくて良いから楽(クライアントによります)です。
      ポート番号は標準の22番だとよく攻撃されるので、開いていそうな50000〜60000番台の番号に変更しましょう。
    4. root ユーザーで SSH できないようにする
      怖いからです
    5. MySQL インストール
      後述する Mattermost のデータベースとして必要です。PostgreSQL でも良いらしい
    6. Nginx インストール
      後述する Mattermost のアプリケーションサーバーの前段の Web サーバーとして必要です。80/443ポートをアプリケーションのポートにフォワードしたり、SSL/TLSの処理をやってくれます。ありがとう。
    7. Let’s Encrypt でワイルドカード証明書を取得
      イマドキHTTPだと人権がないので、certbot を使って証明書を取得しました。ワイルドカード証明書 (ANY.example.com) の取得はDNSレコードに認証キーを書き込む仕組みでした。Webroot にファイルを置くよりもこっちの方が好きです。
      設定にあたってはこちらのサイトが大変参考になりました!

    こんな感じで、やっと下ごしらえが完了という感じです。最近はコードを GitHub にプッシュするだけでサーバーのセットアップを全部やってくれるありがたいサービスも登場していますが、僕はこういう低レイヤーの作業をポチポチやるのも結構好きです。

    Mattermost のインストール

    さて、そもそも私は何のためにサーバーを借りたのでしょうか。それは Mattermost というソフトを入れてみたかったためです

    Mattermost は OSS の Slack クローンとされていて、超有名 SaaS である Slack をオンプレでも使えるようにしようという発想で作られています。Twitter に対する Mastodon みたいなノリです。

    Ubuntu Server へのインストールは公式ドキュメントがありますので、そちらに従って進めることができました。Mattermost サーバーは Go で書かれているようですが、コンパイル済みの実行ファイルが提供されているので、手動でコンパイルする必要はありません。

    実行ファイルを配置して、設定ファイルを適当に変更して、systemd に登録したら、Nginx のバーチャルホストを追加します。SSLの設定を忘れずに。全部終わったら、ブラウザからインストールしたドメインにアクセスです! すると…

    Mattermost の初期設定画面

    やったーーー!設定画面が現れました。はじめて WordPress のインストーラーを目にしたときのような感動を覚えました (笑)

    ひとり Mattermost のススメ

    そこそこ大変だけど楽しい道のりを経て Mattermost というチャットツールを手に入れたわけですが、重大な問題が存在します。チャットする相手がいないことです (爆)

    もちろん、誰かにメールアドレスを教えてもらって Mattermost に招待すればその人とチャットすることはできるわけですが、相手からしたらわざわざ私のサーバー上で動く謎システムを使ってあげる合理的な理由がありません (笑)
    それに、世の中には LINE や Discord などといった便利で無料のツールがたくさんあるのです…

    なので私は、Mattermost を一人で使うことにしました ()

    安心してください、やばいやつじゃないですよ? いや、やばいやつにしか見えないかもしれないですが…w

    種明かしをすると、私は自分の Mattermost を TODO リストや bot とやりとりする場として使おうと考えていたのです。
    そして実際に、とても便利に使えています。どのように便利に使っているのかについては、次の記事で書こうと思います。

    というわけで、お腹が空いたので今日の記事はここまで。次回は Mattermost で bot と遊ぶ方法について書きます。私の調子が良ければ半年以内()に公開されるはずです。

    それではまた、次の記事でお目にかかりましょう。お読みいただきありがとうございました!

  • imgixでお手軽に画像配信を最適化

    imgixでお手軽に画像配信を最適化

    読者のみなさま、ご無沙汰しております。管理人のたかきです。

    最近、新しいウェブアプリケーションを開発しており、今のところ約半年を費やしてアカウント管理機能を作っております。

    その中で、の画像のような感じでユーザーのプロフィール画像(アイコン)を設定する機能を作っていたのですが、画像のアップロードを受けとり、ユーザーの指定に従って正方形に切り取ってGoogle Cloud Storageへアップロードするまでの処理はできたのですが、問題は画像の配信です。

    Exifのオリエンテーション補正や、Reactのクロップツールの導入、Node.jsでの画像クロップなど、なかなか大変でした…

    マスター画像は400x400pxでGCS上に保存してあり、独自ドメインでCloudFlareのCDNを経由するよう設定していたため、生のURLをクライアントからリクエストされた場合でもキャッシュヒットをすることは可能なのですが、いかんせん参照する際に400pxの画像をいちいちリクエストするのは無駄がありすぎます…

    たとえばちょっとした右上のアカウントアイコンは50pxもあれば十分ですから、400pxの画像をリクエストするのは時間もかかりますし、ユーザーのデバイスの通信量も消費してしまいます。

    そこで、画像配信に特化したCDNを導入してみましたので、今回はそのご紹介です。

    (さらに…)