MagicalParticles

「マジカルミライ 2023」楽曲コンテンストの受賞作品を楽しむことができるリリックアプリです。

以下の楽曲に対応しています。

• ネオンライトの海を往く / Ponchi♪ feat. 初音ミク

ネオンライトの海をイメージしたパーティクルによる演出をぜひお楽しみください。
（カーソルの移動やクリックにも反応します！）

• サンプルコードのデモページ: https://mm-app-2023.pages.dev/

開発

Node.js をインストールしている環境で以下のコマンドを実行すると、開発用サーバが起動します。

npm install
npm run dev

ローカルではTextAlive用のトークンを環境変数から取得しています。

    app: {
        token: import.meta.env.VITE_TEXT_ALIVE_TOKEN
    },

事前に .env.local を作成し、以下内容を追記してください。

VITE_TEXT_ALIVE_TOKEN={トークン}

ビルド

以下のコマンドで dist 以下にビルド済みファイルが生成されます。

npm run build

使用技術

本アプリは以下を利用しています。

• Vite
• React
• TypeScript
• react-particles
• TextAlive App API

TextAlive App API

本アプリはTextAlive App APIを使用したリリックアプリです。

TextAlive App API について詳しくはWebサイト TextAlive for Developers をご覧ください。

---

https://github.com/TextAliveJp/textalive-app-basic