ノーコード ラボ

NoCode 関連のツールの紹介、使い方などをやさしく説明しています。Chatbot の運用実験は終了しました。ご協力いただいたみなさん、ありがとうございました。

プラグイン

【プラグイン開発入門③】Actionの注意点~基本編~

こんにちは!今回は、プラグイン開発入門シリーズの第三弾!テーマはプラグインActionの実装です。Action実装の基本事項として把握しておくと便利なことをご紹介していきます。 BubbleプラグインのActionにはServer-side ActionとClient-side Actionの2種類…

【Bubbleプラグイン開発入門②初級編】Carbon Design Systemのパンくずリストプラグインを作ってみよう!

こんにちは!今回は、「Bubbleプラグイン開発入門」シリーズの第二弾として、実際にプラグインを作りながらプラグイン開発の流れをご紹介していきます。 今回の記事で開発するのは、簡単にパンくずリストを実装できるプラグイン。ポータルサイトなどの基本的…

Bubble で QRコードの読み込みと生成の両方ができる「Barcode & QR Code Reader」プラグイン

みなさん、こんにちは! 今回は、Bubble で QRコードの読み込みと生成の両方ができる Zeroqode の「Barcode & QR Code Reader」プラグインについてです。 以前にも、無料のプラグインを使った QRコード生成については取り上げていますが、今回は生成だけでは…

LINE ログイン v2.1 を完全網羅!メールアドレスも取得できる LINE LOGIN PRO プラグインを公開!

1. はじめに 2. LINE LOGIN PRO の概要 3. LINE Developers の設定について 3.1. プロバイダーとチャネル作成 3.2. メールアドレス取得権限の申請 3.3. コールバックの設定とチャンネル公開 4. LINE LOGIN PRO の設定と機能について 4.1. 設定値 4.2. サポー…

BubbleにCarbon Design Systemを導入する方法

みなさん、こんにちは! 今回は、IBMによって開発された Carbon Design System についてです。 現代のウェブアプリケーション開発において、デザインとユーザーエクスペリエンスの重要性はますます高まっています。ユーザーは美しさと使いやすさを求め、アプ…

【Bubbleプラグイン開発入門①】徹底解説!プラグインエディタの使い方

この記事では、Bubbleの「プラグインエディタ」の使い方をタブごとにご紹介します。 プラグインはBubbleアプリに搭載することでアプリの機能を拡張してくれるものです。Bubbleユーザーなら誰でも自分で作成して他のユーザーに提供することができます。プラグ…

Bubble でブラウザデータ保存 Local Storage を利用する方法

こんにちは! 今回は、Bubble で Local Storage を利用する方法についてご紹介します。 Local Storage は、HTML5 から登場した Web ブラウザにデータを保存するための仕組みです。 この仕組みを利用すると、Web アプリケーションからデータベースへのアクセ…

Stripe連携ツールPriceWellを使ってBubbleで決済機能を実装する方法

こんにちは!今回は、Stripe連携ツールPriceWellを使ってBubbleで決済機能を実装する方法をご紹介します。 PriceWellは、商品の料金表やStripe Checkoutを使用した決済機能をノーコードで実装できるサービスです。商品や購入情報はStripeで管理できます。 本…

Wasabi クラウドストレージと連携する

「Wasabi」という名前のクラウドストレージをご存知でしょうか? 日本人からすると、なぜ「Wasabi」?と思わずにいられないですが、食べ物の「わさび」とは全く関係はありません。 安価で無制限に高速なデータの書き込み・読み込みができると評判のクラウド…

Bubbleプラグイン:Pagenationをリリース

Bubbleプラグイン:Pagenationをリリース 1. どんなプラグイン? 2. できること 3. 使い方 3-1. Repeating Group を設定する 3-2. Pagenation を設定する 3-3. WorkFlowのイベントを追加する 4. 補足 5.最後に おまけ ノーコードラボのプラグイン Bubbleプラ…

BubbleでIPアドレスの制限を行う方法

こんにちは!今回ご紹介するのは、IPアドレスの通信制御をBubbleで実装する方法です。 日本国内や海外問わず様々な場所から通信ができるようになり、リモートで仕事ができるようになった一方で、Webサイトの脆弱性を突いた通信やウイルス等を多く耳にするよ…

サブスク情報の管理に便利なStripeカスタマーポータルをBubbleで実装する方法

こんにちは!今回は、オンライン決済サービス「Stripe」の「カスタマーポータル」という機能をBubbleで実装する方法をご紹介します。 カスタマーポータルとはStripeが提供する機能の一つで、顧客が自分でサブスクリプションや支払い方法、請求先などの変更を…

PDF作成プラグイン「PDF Conjurer」と「Google Doc to PDF | Unlimited」を実装する

こんにちは!今回は、BubbleでおすすめのPDF作成プラグイン「PDF Conjurer」と「Google Doc to PDF | Unlimited」の実装方法をご紹介します。 請求書、イベントの予約確認、ユーザーへの各種書類など、BubbleでPDFを作成したいシーンはたくさんありますよね…

LINE Message プラグインの機能追加

1. 画像の送信 引数 2. 動画の送信 引数 3. メッセージオブジェクトの送信 引数 メッセージオブジェクトの JSON LINE絵文字 LINEスタンプ その他 余談 こんにちは!ノーコードラボの岡崎です。 昨日(2022年2月5日)、久しぶりに LINE Message プラグインに…

Bubble で簡単にファイルの zip & ダウンロードができる Zip and download files プラグイン

Zip and download files プラグインとは Zip and download files プラグインの利用方法 プラグインのインストール 事前準備 1つのファイルをダウンロード 複数のファイルをダウンロード まとめ こんにちは! Bubble で簡単に複数ファイルを zip 化してダウ…

Zoomプラグインを使ってみよう!

Zoom Meetings プラグインページ 使い方 プラグインのインストール アプリの登録 作成するアプリの種類の中から「JWT」を選択します。 各項目を設定し、アプリを作成。 アプリを作成すると、API KeyとAPI Secretが取得できます。 プラグインページに、API ke…

Bubble の表作成にとても便利な Table / Grid プラグイン

Table / Grid プラグインとは 使用できる機能 使用方法 1. プラグインのインストール 2. Element の配置 3. 表示カラムの設定 ボタンを表示したい場合 リンクや画像を表示したい場合 テーブルオプション項目の設定 CSVダウンロード機能 テーブルの色設定 ま…

【BubbleでSaaS構築】Sub app機能とアプリ連携プラグインApp Connectorを使ってみる

こんにちは! ここ数年でよく耳にするようになった業務改善やDXですが、SaaSで取り組みたいと考えているバブラーの方は多いはず。実はBubbleにはSaaSにぴったりなSub app機能というものがあるのをご存知ですか? 今回は、BubbleでSaaSを構築するときに便利な…

Calendar tool プラグインでカレンダーをカスタマイズして表示する

こんにちは!Bubble標準のカレンダーであるCalendarエレメントを使っていて、もっと柔軟にカスタマイズしたいと思ったことはありませんか? 本日は、「Calendar tool」プラグインとRepeating Groupを使って、カスタマイズしたカレンダーを表示する方法をご紹…

Bubble で Vimeo のビデオを管理できるプラグイン「Vimeo Connector (access token)」を作成しました!

1. Vimeo とは? 2. Vimeo Connector (access token) プラグインのご紹介 3. プラグインを使うための準備 3.1. Vimeo 側の設定 3.1.1. Vimeo のアカウントを作り、Vimeo の新しいアプリを作成しよう 3.1.2. My Apps ページで動画の Upload の申請をしよう 3.…

Bubble で写真や動画を撮影できる Camera Capture and Video Recorder Plugin の使い方

1. プラグインなしでもワンアクションのカメラ起動は可能か? 2. カメラ起動のプラグインの比較 2.1. Mobile Camera Input 2.2. Simple Mobile Camera Input 2.3. Camera Capture and Video Recorder Plugin 3. Camera Capture and Video Recorder Pluginを…

Bubble で作った Web アプリを Nativator を使って簡単にネイティブ化する方法

1. Web アプリとネイティブアプリの違い 2. ネイティブ化してみよう 2.1. Bubbleで作ったアプリをネイティブ化できるプラグインの比較 2.1.1 BDK Native 2.1.2 codeless academy 2.1.3 Nativizer 2.1.4 Nativator(2021年4月21日追記) 2.2. Nativator.io と…

Bubbleでループ処理をする方法(List Shifter を使ってみよう)

1. 準備 1.1. List Shifter をインストールしよう 1.2. 使用するリストを作ろう 2. List Shifter を動かしてみよう 2.1. List Shifter でリストをReverse しよう 2.2. List Shifter でリストを回転(Rotate)しよう 2.3. List Shifted とShifted List の違い…

Bubble プラグイン:Twitterのツイートができる「Twitter Tweet」を作成しました

Bubble プラグイン:Twitterのツイートができる「Twitter Tweet」を作成しました Bubbleからツイートする方法 プラグイン公開URL デモサイト 使用方法 元号ジェネレータについて 準備をしよう TwitterのApp設定をしよう プラグインのインストールをしよう プ…

Bubbleで「LINEログイン」と「LINEメッセージ送信」ができるプラグインを作成しました

皆さんこんにちは!今回はノーコード ラボで開発した以下2つのプラグインについて紹介していきます。 LINEアカウントによるソーシャルログインを実現する「LINEログイン」のプラグイン BubbleからLINEへメッセージを送信できる「LINEメッセージ送信」のプラ…

Bubble のプラグインの人気週間ランキングトップ20(2020/08/26 - 9/1)

2020/08/26 - 2020/09/01 までの 1週間 インストール数ランキング 1位 Bubble Plugins (6,749 apps) 2位 Ionic Elements (3,879 apps) 3位 API Connector (3,067 apps) 4位 Google Material Icons (3,016 apps) 5位 Toolbox (2,756 apps) 6位 Random User Ge…

Bubble プラグイン画像もPNG化できる「Element to PNG」を作成しました

Bubble プラグイン画像もPNG化できる「Element to PNG」を作成しました 参考プラグイン:Element To Imageについて ノーコードラボの「Element to PNG」について プラグイン公開URL デモサイト 使用方法 元号ジェネレータについて 準備 プラグインを配置して…

BubbleでAlgoliaを使って検索してみよう!

BubbleでAlgoliaを使って検索してみよう! Algoliaとは? Algoliaの準備をしよう アカウントを作ろう インデックスを作ろう API Keyを確認しよう Algoliaプラグインをインストールしよう プラグインの設定をしよう サンプルを作ってみよう Dataについて 検索…

Bubble でカスタマイズしたカレンダーを作成!「Air Date/Time Picker」プラグイン!

こんにちは!Bubble camp アシスタントの あぽとです! 今回は、Bubbleでの日付・時刻入力に関するプラグインを紹介します。 お店の予約、期限の設定など、日時を入力する場面は多々考えられます。 この時、文字入力やプルダウン入力でもいいですが、 カレン…

Bubble での QRコード生成について

本記事は Bubble camp 第2期の中で NoCode Ninja さんから投稿いただいた Ninja レポートを転載したものです。 NoCode Ninja さん、ありがとうございました! ===== はじめに QRコードとは 表現できるデータ 実用例 Bubbleで実装する 使い方 imageエレ…