← すべてのプロダクト
Celebrate.js

Celebrate.js

UIの「できた」を、記憶に残る瞬間に。

Celebrate.js は、Reactアプリの操作に視覚的なフィードバックを加えるためのオープンソースライブラリです。紙吹雪、花火、スタンプ、きらめき、光るボーダーなど25種類のエフェクトを、用途に合わせてすぐ使えます。

25種類のエフェクト

紙吹雪・花火・スタンプ・桜・雷・きらめきなど、達成・報酬・リアクションに合わせて選べます。

React向けのシンプルなAPI

Providerとフックを追加して、イベント時にエフェクト名を指定するだけ。UIに自然な反応を加えられます。

試して選べるカタログ

公式ドキュメントのインタラクティブカタログで、すべてのエフェクトをブラウザ上で確認できます。

npmで公開・MITライセンス

@celebrate-js/celebrate としてnpmで公開。個人開発からプロダクトまで導入できます。

  1. 1 npm install @celebrate-js/celebrate を実行する
  2. 2 アプリのルートを CelebrateProvider で包む
  3. 3 useCelebrate() で取得した関数を、完了や達成のタイミングで呼び出す
  4. 4 公式カタログで演出を試し、プロダクトに合うものを選ぶ