BlockEden.xyz ダッシュボード v3 のご紹介:モダンで高速、そして直感的な体験
一文での要約: ダッシュボードを Next.js App Router、shadcn-ui コンポーネント、Tailwind CSS を使用して完全に再設計し、ブロックチェーン API アクセスの管理をより高速で、応答性が高く、視覚的に魅力的な体験にしました。
本日、BlockEden.xyz ダッシュボード v3 のリリースを発表できることを大変嬉しく思います。これは、プラットフォーム開始以来最大規模のユーザーインターフェースアップグレードです。単なるビジュアルリフレッシュではなく、ブロックチェーン API サービスとのやり取りをこれまで以上にスムーズ、迅速、直感的にするための完全なアーキテクチャの刷新です。
Dashboard v3 の新機能
1. パフォーマンス向上のための最新テクノロジースタック
Dashboard v3 は Next.js App Router 上に構築され、従来の Pages Router アーキテクチャから置き換えられました。この根本的な変更により、以下のような大幅なパフォーマンス改善が実現します。
- サーバーコンポーネント: クライアント側 JavaScript を削減し、ページ読み込みが高速化
- 改善されたルーティング: ネストされたレイアウトにより、直感的なナビゲーションが可能に
- SEO 強化: メタデータ処理の向上により、検索エンジンでの可視性が改善
また、Ant Design と Styletron から shadcn-ui コンポーネント(Tailwind CSS 駆動)へ移行したことで、次の効果が得られました。
- バンドルサイズ削減: すべてのページで読み込み時間が短縮
- 一貫したデザイン言語: ビジュアル体験が統一
- アクセシビリティ向上: キーボード操作とスクリーンリーダーのサポートが改善
2. アクセスキー管理の合理化
アクセスキー管理体験を完全に再設計しました。
- 直感的なキー作成: ワンクリックで新しい API キーを生成
- 可視性の向上: キータイプや権限を簡単に識別
- セキュリティ強化: テナント単位での環境分離を徹底
- ワンクリックコピー: キーをクリップボードにシームレスにコピー可能
[画 像プレースホルダー: 新しいアクセスキー管理インターフェースのスクリーンショット]
3. アカウント・請求セクションの再設計
アカウントとサブスクリプションの管理がよりシンプルになりました。
- サブスクリプション管理の簡素化: プランのアップグレード、ダウングレード、キャンセルが容易
- 請求情報の明確化: 料金と使用統計が透明に表示
- 支払いプロセスの合理化: 改善された Stripe 連携により、安全かつ効率的な支払い処理
- ウォレット連携の強化: 暗号ウォレットとの接続がスムーズに
4. 厳格なテナント分離
複数プロジェクトを管理するエンタープライズユーザー向けに、厳格なテナント分離を実装しました。
- クライアント固有の設定: 各クライアント ID が独立した環境を持つ
- セキュリティ向上: テナント間の境界を確実に enforce
- トラッキング改善: プロジェクトごとの利用パターンが可視化
背景にある技術的改善
見た目の変化はすぐに分かりますが、内部でも大幅な改善が行われています。
1. アーキテクチャの転換
Pages Router から App Router への移行は、アプリケーション構造の根本的な変化を意味します。
- コンポーネントベースのアーキテクチャ: よりモジュール化され、保守性が向上
- データ取得の改善: サーバーサイドレンダリングとデータロードが効率化
- 状態管理の向上: 関心の分離が明確になり、状態遷移が予測可能に
2. 認証フローの強化
認証システムを簡素化しました。
- ログインプロセスの簡略化: 認証が高速かつ信頼性向上
- セッション管理の改善: 認証トークンの取り扱いが最適化
- セキュリティ強化: 一般的な脆弱性に対する保護が堅牢化