にゃんぱすーをシェアできる全く新しい画期的なWEBサービス(OSS版)なのん
閉鎖されてしまったnyanpass.comをセルフホストできるようにするえきさいちんぐな試み
ソースコード自体はうちが一から再現のために組み上げたものなのでクリーンなのん! これより下はえーあいによるプロジェクト概要のまとめなのん。
※追記 本番でぷろいしたのん!ソースコードをあっぷする時間がないのでしばらく待ってほしいのん https://nyanpass.click
Static Demo
GitHub Pages上で動作するデモ版を公開しています。
このデモはサーバーサイドのカウンターを使用していないため、クリック数はブラウザの LocalStorage にのみ保存されます。
そのため、
- 他のユーザーとはクリック数を共有しません
- 別のブラウザでは別のカウントになります
- LocalStorageを削除するとカウントもリセットされます
- サーバーを必要とせず、GitHub Pagesなどの静的ホスティングで動作します
これは仕様であり、Static Demo版の特徴です。
「にゃんぱすーボタン」は、ボタンを押すことで「にゃんぱすー」の回数を増やし、その行為をSNSなどでシェアできるシンプルなWEBサービスです。
単純なカウンターとしての機能だけではなく、
押す
↓
回数が増える
↓
SNSへシェアする
↓
誰かが見つける
↓
また押す
という、自然に広がっていく仕組みそのものを楽しむことを目的としています。
本プロジェクトでは、フロントエンドの見た目や操作感を可能な限り維持しながら、バックエンド部分を用途に応じて複数の構成へ発展させることを計画しています。
本プロジェクトでは、用途に応じて以下の3段階の構成を想定しています。
| Edition | Backend | 主な用途 | 状態 |
|---|---|---|---|
| Static Demo | なし / JavaScript | GitHub Pages・デモ | 公開中 |
| Self-hosted Edition | Go | LAN・ZeroTier・小規模なセルフホスト | 開発予定 |
| Internet Edition | Go | インターネット公開・大規模アクセス | 開発予定 |
GitHub Pagesなどの静的ホスティングで動作する、サーバーレス版です。
- PHP不要
- Go不要
- データベース不要
- サーバー不要
- GitHub Pagesでそのまま公開可能
- ダウンロードしてローカルでも動作可能
- クリック数はLocalStorageへ保存
- フロントエンドだけで完結
「とりあえずにゃんぱすーボタンを動かしてみたい」という用途を想定しています。
また、本プロジェクトを実際に触ってもらうための公式デモ環境としても利用しています。
Static Demoのカウンターはサーバー側に保存されません。
したがって、全ユーザー共通のカウンターではありません。
これはGitHub Pagesなどの静的ホスティングで動作させるための意図的な仕様です。
LAN内やZeroTierなどの閉域ネットワークで、仲間内からアクセスする用途を想定したセルフホスト版です。
当初はPHPによるプロトタイプを作成しましたが、今後の本格的な開発ではGoをバックエンドとして採用する方針です。
- 自宅サーバー
- LAN内
- ZeroTierネットワーク
- 仲間内での共有
- 小規模なイベント
- 個人によるセルフホスト
Goでバックエンドを実装することで、サーバー上で実行するだけでなく、環境によっては実行ファイルをそのまま配布できる構成を目指します。
将来的には、
nyanpass-server.exe
のような実行ファイルを起動するだけで、簡単にセルフホストできる形を目指します。
本プロジェクトの最終的な本命となる構成です。
Goによるバックエンドを本格的に実装し、インターネット上へ公開可能な高負荷対応のサーバーを目指します。
100,000,000 Nyanpass / day
を処理できる規模のバックエンドを目標とします。
これは現時点で達成・実測した性能値ではなく、今後の開発における設計上の目標値です。
大量のクリックが発生した場合でも安定して処理できるよう、
- 高い同時接続性能
- 効率的なリクエスト処理
- カウンター更新処理
- データ永続化
- 負荷分散
- 障害時の復旧
- キャッシュ
- 監視
- レート制限
- 不正な大量リクエストへの対策
などを含めたバックエンド設計を検討します。
当初のプロトタイプではPHPを使用しました。
PHPは比較的簡単に環境を構築でき、LAN内やZeroTierなどで使用するプロトタイプとしては十分に便利でした。
しかし、本プロジェクトでは最終的に、
簡単に配布できること
高い負荷に対応できること
バックエンドを単体で動作させられること
を重視します。
そのため、本格的なセルフホスト版およびインターネット公開版ではGoを採用する方針です。
Goではバックエンドを単一の実行ファイルとして配布しやすいため、
ダウンロード
↓
実行
↓
サーバー起動
↓
ブラウザからアクセス
というシンプルなセルフホスト体験を目指せます。
また、大量のHTTPリクエストを処理するバックエンドとしても適した構成を取りやすいため、最終的な大規模版にも同じGoバックエンドを発展させていく予定です。
本プロジェクトでは、フロントエンドを必要以上に作り直さない方針です。
基本的なUIは、かつて存在した「にゃんぱすーボタン」のデザインを可能な限り忠実に再現します。
Static Demo、Self-hosted Edition、Internet Editionでバックエンドが変わっても、
ユーザー
↓
ほぼ同じWEB UI
↓
バックエンドだけ変更
という構成を目指します。
つまり、
見た目は同じ、裏側だけどんどん強くする
という設計です。
最終的には、例えば以下のような構成を想定しています。
nyanpass-OSSProject/
│
├── README.md
├── LICENSE
│
├── frontend/
│ ├── index.html
│ ├── assets/
│ └── ...
│
├── server/
│ └── ...
│
├── static-demo/
│ └── ...
│
└── docs/
└── ...
実際のディレクトリ構成は開発の進行に合わせて変更される可能性があります。
- HTML
- CSS
- JavaScript
- LocalStorage
- GitHub Pages
- Go
- HTTP server
- データ永続化機構
- その他必要なコンポーネント
詳細な技術仕様については開発の進行に合わせて追加します。
- 静的HTML化
- PHP依存の除去
- LocalStorageによるカウント保存
- GitHub Pagesへの公開
- 独自ドメインでの公開
- デモ版であることの表示
- GitHub READMEへのABOUTリンク
- PHPによるプロトタイプ作成
- Goバックエンドへの移行
- 実行ファイルとして配布
- LAN内での動作確認
- ZeroTierでの動作確認
- 簡単な設定だけでセルフホストできる仕組み
- Goバックエンドの本格設計
- データ永続化
- 高負荷対策
- セキュリティ対策
- 監視・ログ
- スケーリング
- 負荷試験
- 大規模アクセスへの対応
- 1日1億にゃんぱすーを目標とした性能検証
本プロジェクトは、最終的に特定の管理者だけが運営するサービスではなく、
誰でも自分でサーバーを立てられるにゃんぱすーボタン
を目指しています。
そのため、バックエンドをOSSとして公開し、
自分でホスティングする
↓
友人に公開する
↓
LANで遊ぶ
↓
ZeroTierで遊ぶ
↓
インターネットへ公開する
と、用途に応じて自由に利用できる構成を目指します。
また、第三者が独自に公開サーバーを運営することも想定しています。
GitHub Pages版はあくまでデモ環境です。
サーバー側にクリック数を保存していないため、実際のサービスとして利用するためのものではありません。
デモ版ではLocalStorageを使用しているため、ブラウザや環境が変わるとカウントも変わります。
本格的な共有カウンターとして利用したい場合は、Self-hosted EditionまたはInternet Editionの利用を想定しています。
本プロジェクトのライセンスについては、リポジトリ内の LICENSE を参照してください。
「にゃんぱすー」と言いたい。
それだけのために、どこまで本気でバックエンドを作れるのか。
Static Demoから始まり、
PHPプロトタイプ → Goセルフホスト版 → 大規模インターネット版
へと発展させ、最終的には
1日1億にゃんぱすー
を処理できるバックエンドを目指します。
必要なのは高度なサービスでも、複雑な機能でもありません。
ただ、ボタンを押すだけです。
にゃんぱすー。