ノーコード ラボ

NoCode 関連のツールの紹介、使い方などをやさしく説明します。質問やご指摘大歓迎です。わからないことがあったら、コメントや Twitter などで聞いてください!

Bubble の人気プラグインランキング トップ20(2019年12月25日調べ)

f:id:yksmt:20200427140002p:plain

こんにちは!ノーコード ラボの岡崎です。

Bubble には、より早く簡単で安全にアプリを作れるようにするためにプラグインが多数用意されています。

Bubble 純正のプラグインの他、サードパーティも多くのプラグインを作っています。

そこで、今回は 2019年12月25日 時点でのインストール数ランキング トップ20 を調べてみました。

なお、トップ20 は全て無料のプラグインでした。


1位 Ionic Elements(47,655 apps)

f:id:toka-xel:20191225155319p:plain

Ionic Elements は、Ionic Icon、Ionic Toggle、Ionic Checkbox、Ionic Range の 4つのエレメントがセットになったプラグインです。

f:id:toka-xel:20191225163532g:plain

Ionic Icon には Android 用と iOS 用があり、上で例示しているのは左半分が Android 用、右半分が iOS 用です。 全部のアイコンに対しAndroid 用 と iOS 用があるわけではないのですが、 多くのアイコンで用意されているようです。

スマホでの利用を想定するなら入れておきたいプラグインです。

Bubble 純正のプラグインなので、安心してインストールできます。


2位 API Connector(42,286 apps)

f:id:toka-xel:20191225152505p:plain

外部で提供されている API に接続して Bubble で利用するための汎用的な API Connector です。 プラグインが用意されている時はそちらを利用する方が簡単なのですが、プラグインがない場合は、API Connector を使って任意の API に接続することができます。

使用方法は当ブログでも紹介しています。

blog.nocodelab.jp

Bubble 純正


3位 Google Material Icons(33,277 apps)

f:id:toka-xel:20191225150301p:plain

Google が提供しているマテリアルアイコンを簡単に使えるようにしてくれるプラグインです。

Icons - Material Design

良質で豊富なアイコンを使用できるので、多くのアプリでインストールされています。

デザインテーマを Material Design にした時は特に必須ですね。

Bubble 純正


4位 Toolbox(31,794 apps)

f:id:toka-xel:20191225164920p:plain forum.bubble.io

こちらは、List of Numbers、Expression、List Item Expression、Javascript to Bubble の 4つのエレメントがまとめられて提供されているプラグインです。 どれも使える機能なのですが、中でも一番凄い機能は、「Javascript to Bubble」だと思います。 文字通りですが、カスタムされた Javascript を作成して、Bubble のワークフローで利用することができます。クライアントサイド、サーバサイド、両方で利用可能です。

ノーコード開発では、どうしても痒いところに手が届かないと言われますが、この機能を使うことによって、手が届く範囲が大幅に広がります!

ただし、これを使うと、もうノーコードではないですね。

サードパーティの Misha V さん作成


5位 Slidable Menu(21,687 apps)

f:id:toka-xel:20191225165901p:plain

こちらは名前の通りですが、スライドするメニューを作成することができるプラグインです。

Bubble 純正

f:id:toka-xel:20191225171334g:plain


6位 Random User Generator(21,356 apps)

f:id:toka-xel:20191225173141p:plain randomuser.me

テスト用にランダムなユーザーデータ(氏名、性別、住所、郵便番号、電話番号、Emailアドレス、画像等)を作成できるプラグインです。大量のユーザーデータを用いてテストするときに有用なプラグインです。

サードパーティの Coaching No Code Apps さん作成


7位 Multiselect Dropdown(17,207 apps)

f:id:toka-xel:20191225173711p:plain

通常のドロップダウンは複数の選択肢から1つを選ぶのですが、このプラグインでは、複数の選択肢から複数を選択することができるようになります。

Bubble 純正

f:id:toka-xel:20191225210551g:plain


8位 Stripe(15,442 apps)

f:id:toka-xel:20191225173952p:plain

このプラグインは Bubble で Stripe という決済サービスを使うためのプラグインです。

Bubble に対応している決済サービスは Stripe と Braintree の2種類あります。 しかしながら、Braintree は日本ではサービスしていないので、Bubble で決済をしようとした場合、ノーコードでやるのであれば Stripe 一択となります。

Bubble 純正


9位 Draggable Elements(14,454 apps)

f:id:toka-xel:20191225153737p:plain

ドラッグ&ドロップで操作する時に必要となるプラグインです。 使い方は当ブログでも紹介しています。

blog.nocodelab.jp

blog.nocodelab.jp

ドラッグ&ドロップは主に PC で操作するようなアプリであれば必須ではないかと思います。逆にスマホメインだとドラッグ&ドロップは使わないことの方が多いです。

Bubble 純正


10位 Rich Text Input(13,560 apps)

f:id:toka-xel:20191225175805p:plain

リッチテキストエディターを使って、文字を入力するためのエレメントです。

Bubble 純正

f:id:toka-xel:20191225205543p:plain


11位 Full Calendar(12,916 apps)

f:id:toka-xel:20191225175915p:plain

アプリ内でカレンダーを使うことができるようになるプラグインです。

カレンダーの中にイベントを入れることもできます。

Bubble 純正

f:id:toka-xel:20191225214325p:plain


12位 Chart Element(12,699 apps)

f:id:toka-xel:20191225153456p:plain

シンプルなグラフを作成するためのプラグインです。

簡単なグラフならこれで OK。

Bubble 純正

f:id:toka-xel:20191225212914p:plain


13位 Facebook(12,242 apps)

f:id:toka-xel:20191225180010p:plain

Facebook のアカウントでユーザーがログインできるようにするためのプラグインです。

Bubble 純正


14位 Air Date/Time Dropper(10,559 apps)

f:id:toka-xel:20191225180221p:plain

forum.bubble.io

日時を選択できるお洒落なドロッパーです。

ただし、日本でよく使う yyyy/mm/dd などのフォーマットには対応していないので、残念ですが国内向けサービスには使いにくいです。

国内向けには代わりに Air Date/Time Picker を使った方が良さそうです。

f:id:toka-xel:20191225203833p:plain

forum.bubble.io

こちらは yyyy/mm/dd など、日付のフォーマットをカスタマイズできます。

f:id:toka-xel:20191225221800g:plain

どちらもサードパーティの Seanhoots さん作成


15位 Progress Bar(10,357 apps)

f:id:toka-xel:20191225153227p:plain

進捗度合いを示すプログレスバーを表示するためのプラグインです。

シンプルで使いやすいのでよく使っています。

Bubble 純正

f:id:toka-xel:20191225200819p:plain


16位 Air Color Picker(10,213 apps)

f:id:toka-xel:20191225180422p:plain

アプリ内で色を指定することができるようになります。

試しにページの Background-color を動的に変更するようにしてみました。

f:id:toka-xel:20191225200037g:plain

動的に色を扱えるようになるので、応用範囲も広いです。

サードパーティの Seanhoots さん作成


17位 Slick Slideshow(9,384 apps)

f:id:toka-xel:20191225180652p:plain

こちらはスライドショーを簡単に作ることのできるプラグインです。

f:id:toka-xel:20191225193332g:plain

こんな感じのスライドショーを簡単に作ることができます。

Bubble 純正


18位 Bootstrap Star Rating Input(9,328 apps)

f:id:toka-xel:20191225180802p:plain

こちらは評価をするときなどに星で入力できるようにするプラグインです。

f:id:toka-xel:20191225183430g:plain

わかりやすくて良いですね!

Bubble 純正


19位 Google Analytics(8,965 apps)

f:id:toka-xel:20191225145809p:plain

Google Analytics を簡単に使えるようにするプラグインです。

Google Analytics は、Google が提供しているアクセス解析ツールです。これを使うと訪問者数、どこから来たのか?とか、デバイスは何?とか簡単に確認できるようになります。

Bubble にこのプラグインを入れておくとGoogle Analytics が使えるようになるので、開発がひと段落して、みんなに触ってもらえるようになったらインストールしたいプラグインです。

Bubble 純正


20位 AddToAny Share Buttons(8,538 apps)

f:id:toka-xel:20191225181313p:plain

こちらは Twitter や Facebook などのシェアボタンをつけるプラグインです。

f:id:toka-xel:20191225182603p:plain

+の「もっと」というボタンをクリックすると、Line や はてな なども選べるようになります。

Bubble 純正


まとめ

人気ランキングを作ってみると、便利なもの、シンプルで使いやすいものが上位に入っているモノだなと実感しました。それとやはり Bubble 純正のプラグインは人気が高いです。

ただ、日本だと使いにくいものもあるので、そこは別のものを探すなりした方が良いですね。

あとは有料のプラグインについても後日調査してみたいと思います。

それでは!

おすすめ記事

以下の記事で、Bubble でのプラグインの導入方法を解説しています!

blog.nocodelab.jp

以下の記事では、Bubble での自作プラグインの作り方についてご紹介しています!

blog.nocodelab.jp