ノーコード ラボ

NoCode 関連のツールの紹介、使い方などをやさしく説明しています。

2020-01-01から1年間の記事一覧

Bubble の Figma からのインポート機能の使い方

本記事は タツヤ@ノーコードデザイナー さんからご寄稿いただきました。 タツヤ@ノーコードデザイナー さん、ありがとうございました! はじめに Figmaとは Figmaでできること 実用例 Bubbleにインポートする 使い方 Figma側での準備 Bubble側での準備 イン…

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

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

Bubble から LINE メッセージを送信する方法

前提条件 LINE Bubble 設定方法 1. API Connector の設定 1.1 共通部分(認証)の設定 1.2 プッシュメッセージの設定 1.3 注意点 2. Bubble エディターの設定 まとめ こんにちは!ノーコード ラボの岡崎です。 今回は Bubble から LINE にメッセージを送信す…

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

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

Bubble で API Connector を使って Google Search Console に接続する方法

皆さん、こんにちは!今回は、Bubble の API Connectorを使って Google Search Console に接続しデータを取得するという方法についてご紹介したいと思います! また、データの取得には、OAuth2.0 や OpenID Connect といった知識も合わせて必要になってきま…

bosyuさんもどきをBubbleで作ってみる!(初級者向け)~12:レスポンシブデザイン

bosyuさんもどきをBubbleで作ってみる!(初級者向け)~12:レスポンシブデザイン レスポンシブデザインとは レスポンシブ設定 まとめ 終わりに bosyuさんもどきをBubbleで作ってみる!(初級者向け)~12:レスポンシブデザイン 皆さんこんにちは! Bu…

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

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

bosyuさんもどきをBubbleで作ってみる!(初級者向け)~11:プロフィール画面を作ろう

bosyuさんもどきをBubbleで作ってみる!(初級者向け)~11:プロフィール画面を作ろう プロフィール画面の機能について プロフィール画面遷移 プロフィール画面を作ろう 画面項目について メールアドレス認証未確認メッセージ エラーメッセージ ユーザ画…

iPhone のメッセンジャーもどきを Bubble で作ってみる(初級者向け)7:Agora を使って Facetime もどきを実装する

この記事は 【 iPhone のメッセンジャーもどきを Bubble で作ってみる(初級者向け) 】の第7回です。 皆さん、こんにちは!今回は、Agora というサービスを使って Bubble で Facetime もどきを実装していきます。 また、今回の実装では Zeroqode で公開さ…

Parabola と Bubble の Data API を使って Google Sheets から Bubble にデータをインポートする方法

Parabola とは? Bubble の Data API とは? Parabola のサインアップ方法 Google Sheets からデータを抜き出して Bubble にインポートする方法 Parabola で Google Sheets からデータを抜き出す データを加工する Bubble の Database を設定する Bubble の …

Bubble Zeroqode の「Reverse Repeating Group」プラグインを使ってみた

皆さん、こんにちは!今回は、Bubble の有料プラグインについて、ご紹介したいと思います。「有料プラグインは使ってみたいけど、もし思ってたことが出来なかったら嫌だな~」なんてこと、ありませんか? ノーコードラボでは、今までに使ったことがある有料…

bosyuさんもどきをBubbleで作ってみる!(初級者向け)~10:マイページを作ろう

bosyuさんもどきをBubbleで作ってみる!(初級者向け)~10:マイページを作ろう マイページ機能について マイページの画面遷移 マイページを作ろう 画面項目について メールアドレス認証未確認メッセージ 募集一覧 XX人が応募しています 下書き ゴミ箱ア…

次世代ノーコードツールと Bubble の新バージョンの噂について

1. Play 2. Bildr 3. Draftbit 4. Bubble の新バージョンの噂 終わりに こんにちは!ノーコード ラボの岡崎です。 今回の記事で 100記事目という節目になるので、ちょっとだけ先の話をしてみたいと思います。 2020年は、日本国内でも NoCode の認知が進んで…

Bubble の Schedule API Workflow を使った簡単バッチ処理をしよう!~2: List編

Bubble の Schedule API Workflow を使った簡単バッチ処理をしよう!~2: List編 サンプルアプリについて 実際に作成してみよう 画面作成 メールアドレス一覧 エラーメッセージ Data作成 & Backend API Workflowの作成 Workflowの設定 追加ボタン 追加ボタン…

Bubbleで作られた、実際に収益を上げているサイト5つをご紹介

本記事は Bubble camp 第2期の中で NoCode Ninja さんから投稿いただいた Ninja レポートを転載したものです。 NoCode Ninja さん、ありがとうございました! ===== 今回のNinjaがお届けするレポートは、「Bubbleで作られた、実際に収益を上げているサ…

Auth0 と連携して Bubble で LINE ログインを実装する方法

皆さん、こんにちは!今回は、日本国内で最も普及率が高い SNS である LINE アカウントを使用したソーシャルログインを Bubble で実現する方法について、ご紹介したいと思います。 今回 LINE アカウントを使用するために、Auth0 というサービスを利用します…

Bubble の Schedule API Workflow を使った簡単バッチ処理をしよう!

Bubble の Schedule API Workflow を使った簡単バッチ処理をしよう! サンプルURL 前準備 実際に作成してみよう 画面作成 Data作成 Backend API Workflowを作成しよう Schedule API Workflowを設定しみよう まとめ Bubble の Schedule API Workflow を使った…

「Bubble で自分で Webアプリを作れるようになりたい人 bosyu! 」第2期結果報告

こんにちは!ノーコード ラボの岡崎です。 ノーコード ラボが主宰している Bubble の自学自習プログラム「Bubble camp」の第2期が終了しましたので、結果を報告します。 Bubble camp とは? ノーコード ラボが始めた Bubble の自学自習プログラム bosyu.me …

bosyuさんもどきをBubbleで作ってみる!(初級者向け)~9:メッセージ画面を作ろう

bosyuさんもどきをBubbleで作ってみる!(初級者向け)~9:メッセージ画面を作ろう メッセージ画面機能について メッセージ画面の画面一覧 メッセージ画面を作ろう 画面項目について メッセージ情報 応募ユーザ情報 メッセージ一覧 メッセージ作成ユーザ …

Bubble から SMS を送信して電話番号認証をする方法

皆さん、こんにちは!今回は、前回の Twilio と連携して Bubble から SMS を送信する方法を使って、Bubble で電話番号認証による本人確認を行う方法について、ご紹介したいと思います。 ノーコードラボでは、既に「Bubbleでログイン処理をしてみよう!」で、…

Twilio と連携して Bubble から SMS を送信する方法

皆さん、こんにちは!今回は、Bubble から SMS(ショートメッセージサービス、ショートメール)を送信する方法として、Twilio というサービスを利用して実現する方法をご紹介したいと思います。 1. Twilio とは 2. Twilio の使い方 2-1. Twilio にサインアッ…

bosyuさんもどきをBubbleで作ってみる!(初級者向け)~8:応募一覧を作ろう

bosyuさんもどきをBubbleで作ってみる!(初級者向け)~8:応募一覧を作ろう 応募一覧の機能について 応募一覧の画面遷移 応募一覧画面を作ろう 画面項目について 応募一覧 募集の画像・タイトル 応募日 応募しているnosyuがありません ワークフローを設定…

bosyuさんもどきをBubbleで作ってみる!(初級者向け)~7:募集の詳細を作ろう2

bosyuさんもどきをBubbleで作ってみる!(初級者向け)~7:募集の詳細を作ろう2 募集詳細画面を作ろう 応募一覧の画面項目 応募人数 更新アイコン メニュー 募集作成日 Twitterに投稿 応募がありません 応募一覧 応募者の情報 Twitterアイコン 応募日 応…

iPhone のメッセンジャーもどきを Bubble で作ってみる(初級者向け)6:OneSignal を使って Web Push を実装する(iOS を除く)

この記事は 【 iPhone のメッセンジャーもどきを Bubble で作ってみる(初級者向け) 】の第6回です。 皆さん、こんにちは!今回は、タイトル通り OneSignal というサービスを Bubble で利用して、メッセージが届いたことを通知(Web Push)してくれる部分…

bosyuさんもどきをBubbleで作ってみる!(初級者向け)~6:募集の詳細を作ろう1

bosyuさんもどきをBubbleで作ってみる!(初級者向け)~6:募集の詳細を作ろう1 募集詳細の機能について 募集詳細の画面遷移 募集詳細画面を作ろう OGP設定 募集詳細の画面項目について 下書きのメッセージ 募集詳細 応募の画面情報を作ろう 現在日時~募…

iPhone のメッセンジャーもどきを Bubble で作ってみる(初級者向け)5:初めてのユーザーにメッセージを送信する画面を作成する

この記事は 【 iPhone のメッセンジャーもどきを Bubble で作ってみる(初級者向け) 】の第5回です。 今回作成するページ 今回は、初めてのユーザーにメッセージを送信する画面(createmessage)を作成していきます。 今回作成するページ 1. 初めてのユー…

「Bubble で自分で Webアプリを作れるようになりたい人 bosyu! 」第1期結果報告

bubble camp とは? ノーコード ラボが始めた bubble の自学自習プログラム bosyu.me こちらの bosyu がそうなのですが、名前が長いので内部的に「bubble camp」と呼んでいました。期間は 3/16 〜 4/15 または 3/17 〜 4/16。 3名の方と一緒に1ヶ月頑張っ…

BubbleでEnterキーでSubmitをしないようにするには??

InputとEnterキー 対応策1 対応策2 対応策3 まとめ 皆さんこんにちは! Bubbleでノーコードライフ楽しんでいますか? 今回は、Bubbleで、Input時のEnterキーをクリックした時の処理についてお話しようと思います。 InputとEnterキー HTMLの仕様として、In…

DB事例集3 学習サポートアプリ

皆さん、こんにちは!今回は、DB事例集の第3回として「学習サポートアプリ」を例に、DB設計についてのポイントをご紹介したいと思います。 Bubble でのデータベースについて学習中の方は、是非参考にしてみてくださいね。 学習サポートアプリ 概要 アプリ仕…

DB事例集2 4択クイズアプリ

皆さん、こんにちは!今回は、Bubble のDB事例集の第2回として「4択クイズアプリ」のデータベース設計についてご紹介したいと思います。本アプリのデータベースは非常にシンプルです。データベースが初めてという方は是非参考にしてみてくださいね。 4択クイ…