Noteこれは「Mix Space + Yohaku デプロイシリーズ」の第1弾で、バックエンド(Core)のインストールに焦点を当てています。フロントエンドテーマ Yohaku のデプロイについては、第2弾に進んでください。
Mix Space は、モダンなフロントエンド・バックエンド分離型の個人ブログシステムです。バックエンド Core は、RESTful API、スケジュールタスク、バックアップ、サーバーレス関数などのフルサービスを提供し、システム全体が静かに稼働する心臓部です。フロントエンドテーマはこれと分離されており、自由に組み合わせることができます。
この記事では、1Panel パネルを使って、Mix Space バックエンドを自分のサーバーで動かす方法を紹介します。あまり手間をかけずに、一歩ずつ進めていきましょう。
ステップ1 · 1Panel パネルをインストール
1Panel は、モダンでオープンソースの Linux サーバー運用管理パネルです。インターフェースがすっきりしていて、操作が直感的です。これがあれば、その後のコンテナ管理、ファイルアップロード、リバースプロキシの設定が非常に楽になります。
インストール前の確認事項
| チェック項目 | 要件 |
|---|---|
| オペレーティングシステム | 主要な Linux ディストリビューション(Debian / Ubuntu / CentOS など) |
| サーバーアーキテクチャ | x86_64、aarch64、armv7l などに対応 |
| 利用可能メモリ | 1 GB 以上を推奨 |
| ネットワーク環境 | インターネットに正常にアクセスできること |
| ブラウザ | Chrome、Firefox、Edge などのモダンブラウザ |
1行のコマンドでインストール完了
SSH でサーバーにログインし、以下を実行します:
コマンドラインの指示に従って操作し、インストールが完了するまでお待ちください。成功すると、コンソールに以下のようなアクセス情報が表示されます:
セキュリティエントランスを忘れてしまいましたか?SSH でサーバーに戻り、以下のコマンドを実行してください。entrance フィールドの値がエントランスパスです:
もし Docker のインストールに失敗した場合は、まずこのコマンドを単独で実行して修復してください:
ステップ2 · 1Panel を通じて Mix Space をインストール
2.1 アプリケーションパッケージをダウンロード
以下のリポジトリから mxspace.zip ファイルをダウンロードし、準備しておきます:
2.2 アプリケーションパッケージをアップロード
1Panel パネルにログインし、左側メニューから ホスト → ファイル に移動し、以下のパスに移動します:
アップロードをクリックし、先ほどダウンロードした mxspace.zip ファイルを選択します。
2.3 解凍、パスに注意!
アップロードが完了したら、mxspace.zip をクリックし、解凍を選択します。
2.4 ローカルアプリケーションを同期
1Panel の アプリストア に移動し、右上のローカルアプリケーションを同期ボタンをクリックします。しばらく待ってから検索ボックスに mxspace と入力すると、先ほど追加したアプリケーションが表示されます。
インストールをクリックし、設定ページに進みます。
2.5 インストール設定項目を記入
インストールページには、3つの読み取り専用の説明と5つの設定項目があります。上から順に記入してください:
Noteページ上部に3つの灰色の「📌」ヒントテキストがあります。それぞれ JWT シークレットの要件、ドメイン形式、暗号化機能に関する注意事項を説明しています。参考情報であり、変更する必要はありません。スキップしてください。
🔑 JWT シークレット(JWT Secret)
これはバックエンドサービスのコアとなるセキュリティ認証情報で、長さは16文字以上、32文字以下である必要があります。ランダムに生成された強力なパスワードを使用することをお勧めします。ターミナルで以下を実行できます:
生成された結果をここに入力し、適切に保存してください。これはブログシステムの鍵のようなもので、紛失するとリセットが必要になり、面倒なことになります。
🌐 許可されたドメイン(Allowed Origins)
バックエンド API へのアクセスを許可するフロントエンドドメインを入力します。複数のドメインは英語のカンマで区切ります。形式の例:
Yohaku フロントエンドをデプロイする際は、ここに Yohaku が配置されるドメインを入力します。まだ確定していない場合は、まず localhost:* を入力しておき、後でインストール済みアプリケーションの設定ページで変更できます。
🔒 暗号化を有効にするか(Enable Encryption)
ドロップダウンで選択します。デフォルトはオフ(推奨)です。
🗝️ 暗号化キー(Encryption Key)
前の項目で「有効」を選択した場合のみ記入が必要です。キーは64桁の小文字と数字でなければなりません。以下のコマンドで生成できます:
暗号化をオフにした場合は、この項目は空欄のままにしてください。
🔢 HTTP ポート
デフォルトは 2333 で、通常は変更する必要はありません。ポートの競合がある場合は、他の利用可能なポートに自由に変更してください。
Noteポートの外部アクセスを直接チェックするのではなく、次のステップのリバースプロキシを通じて外部にサービスを提供することをお勧めします。その方がより安全で、より標準的です。
2.6 インストール開始 🎉
設定に問題がないことを確認し、インストール開始をクリックします。
1Panel は自動的に innei/mx-server、mongo:7、redis:alpine の3つのイメージをプルし、オーケストレーションして起動します。初回インストールではイメージのプルが必要なので、数分間お待ちください。
ステータスが実行中(Running)と表示されれば、Mix Space バックエンドが静かに動き始めています 🌿
ステップ3 · リバースプロキシと HTTPS を設定
ポートを直接公開する方法は、安全でもなく、見た目も良くありません。Nginx リバースプロキシを通じてサービスをあなたのドメインにバインドし、HTTPS を設定することをお勧めします。そうして初めて、全体が完成したと言えます。
ここでは、完全な Nginx 設定を提供します。これは非常に興味深いことを行っています。フロントエンド(Yohaku、ポート 2323) と バックエンド(Mix Space Core、ポート 2333) のルーティングを同じ server ブロックに記述し、同じドメインで外部サービスを提供します。訪問者があなたのブログにアクセスすると、フロントエンドページとバックエンド API が裏でそれぞれの役割を果たし、外部にはきれいなドメインだけが見えます。
1Panel の ウェブサイト → OpenResty → 設定ファイル で、またはサーバー上の Nginx 設定を直接編集して、以下の内容を入力します:
設定を保存した後、nginx -t を実行して構文を確認し、nginx -s reload で再読み込みして有効にします。
::: banner {note} ルーティングロジック一覧:
| パスプレフィックス | プロキシターゲット | 説明 |
|---|---|---|
/api/v2 | バックエンド :2333 | Mix Space REST API |
/socket.io | バックエ |