ノーコード ラボ

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

Google の傘下に!ノーコードでモバイルアプリを開発できる AppSheet

2020年1月14日に Google に買収された モバイルアプリケーション開発プラットフォームである AppSheet について、使い方や長所と短所を Glide と比較して説明しています。

bosyu さんのような OGP画像をかんたんに作れる Web アプリ の作り方

こんにちは!ノーコード ラボの岡崎です。 先日から bosyu さんっぽいものを bubble で作ってみて、その作り方を bubble の初級コースとして記事にできないかなと考えています。 その調査段階で「bosyu さんのような OGP画像をかんたんに作れる Web アプリ」…

Bubbleでログイン処理をしてみよう!~第4回ソーシャルログインをしよう

第4回ソーシャルログインをしよう Bubbleでノーコードライフ楽しんでいますか? ログイン処理シリーズのブログも第4回、ついに今回が最終回になりました。 第3回で予告しましたとおり、ソーシャルログインに触れていきます。 これまでのログイン処理シリ…

Bubble で SendGrid を使ってみる

SendGrid を bubble で使いたい 前回に引き続き、SendGrid 関連の記事となります。 当 nocodelab でお馴染みの bubble ですが、こちらの Plugin 機能を使って SendGrid 経由で bubble からメールを送信することができます。 今回は、そのやり方についてご説…

SendGridに触ってみよう

SendGrid とは SendGrid は、世界中でで利用されているメール配信サービスです。 アカウントを作成するだけですぐにメールを送信できます。 なによりクラウドサービスのため、面倒でコストのかかるメールサーバの構築は不要なのが嬉しいところ。 メール配信…

Bubble でハマってしまった場合にやるべき唯一のこと(Application rights の設定)

明けましておめでとうございます。 今年もどうぞよろしくお願いいたします。 年末年始、Twitter を見ていると、Bubble に挑戦している方を何人か見かけました。 独力で挑戦するのは NoCode と言えど、大変だと思います。 何時間もハマってしまった場合は、誰…

Bubbleでログイン処理をしてみよう!~第3回パスワードポリシーについて

第3回パスワードポリシーについて Bubbleでノーコードライフ楽しんでいますか? ログイン処理シリーズのブログも第3回になりました。 第1回はユーザ登録~ログインまで blog.nocodelab.jp 第2回はパスワードをリセットする、でした。 blog.nocodelab.jp …

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

こんにちは!ノーコード ラボの岡崎です。 Bubble には、より早く簡単で安全にアプリを作れるようにするためにプラグインが多数用意されています。 Bubble 純正のプラグインの他、サードパーティも多くのプラグインを作っています。 そこで、今回は 2019年12…

Bubbleでログイン処理をしてみよう!~第2回パスワードをリセットしよう

第2回パスワードをリセットしよう Bubbleでノーコードライフ楽しんでいますか? 先日Bubbleのユーザ登録についてブログを書かせてもらいました。 blog.nocodelab.jp 前回でユーザ登録~ログインまでを説明しましたが、 今回はログイン処理のパスワードを忘…

twitter のような簡単な SNS をBubble で作ってみる(入門者向け)5: レスポンシブデザイン対応

こんにちは! ノーコード ラボの岡崎です。 twitter のような簡単な SNS をBubble で作ってみる(入門者向け) ということで前回までで4回連載させていただき、完結と思っていたのですが、「スマホでみるとレイアウトが崩れる」というご質問をいただきまし…

Bubbleでログイン処理をしてみよう!~第1回ユーザ登録をしてみよう

第1回 ユーザ登録をしてみよう Bubbleでノーコードライフを楽しんでいますでしょうか? Bubbleでは、今までの記事でもあったように、様々な機能がノーコードで実現できますよね! なんとログイン処理も簡単に実装できてしまうんです! エラーチェックもして…

Bubble ヘッダーの固定とレスポンシブメニュー

今回は、質問いただきました「ヘッダーを固定する方法」と「レスポンシブメニュー(スマホの時はハンバーガーメニューにする方法)」について、ご紹介したいと思います。 以下にサンプルページも用意していますので、ご参考くださいね。 https://nocode-samp…

twitter のような簡単な SNS をBubble で作ってみる(入門者向け)4: ツイートとユーザーの紐付け、本番環境へのデプロイ

前回の記事を書いてから随分と開いてしまいました。 今回の記事でこの「twitter のような簡単な SNS をBubble で作ってみる(入門者向け)」シリーズは最終回となります。 今回は、ユーザーとツイートを紐付けて、誰がどんなツイートをしているのかを表示さ…

BubbleでAPIを使ってみよう!

BubbleでAPIを使ってみよう! 巷では様々なAPIが提供されていますが、Bubbleでも簡単にAPIを使うことができます。 今回はサンプルとして、よく入力画面である「郵便番号から住所を取得する」を行います。 画面を作成しよう 今回のサンプルは、入力された郵便…

Bubble で作成!「学習サポートアプリ」をリリースします。

今回は、Bubbleを使用して実際に作成したアプリについてご紹介したいと思います!本アプリは、英語を始め語学を学習中の方や、試験勉強のツールとして活用できるように作成している「学習サポートアプリ」ですが、是非 Bubbleを学習中の方もサンプルアプリと…

ノーコードでウェブアプリ、ネイティブモバイルアプリが作れる!Adalo の使い方

Adalo とは? www.adalo.com Adalo という no-code のツールをご存じでしょうか? このブログで過去に登場した Glide に少し似ていて、このプラットフォームを利用すれば、コードを記述せずに Webアプリやネイティブのモバイルアプリ(Android, iOS)を作る…

Bubbleでのバリデーションチェック方法

ノンコーディングでアプリが作成できるプラットフォームとして、このブログで何度も登場している bubble ですが、今回はバリデーションチェックのやり方についてご説明します。 アプリを作成する際、データの整合性を担保するためにはバリデーションチェック…

Bubble でドラッグ&ドロップの並び替えをする方法(発展編)

今回は、前回の記事でご紹介した、基本の並び替えを発展させて、もう少し複雑な並び替えについてご紹介したいと思います。 並び替えの仕様は以下の通りです。 従業員はチーム内でも、もしくはチームを移動しても並び替えを行うことができます。 また、チーム…

Bubble でドラッグ&ドロップの並び替えをする方法

今回は、Bubbleでドラッグ&ドロップのプラグイン「Draggable Elements」を使用して、並び替えを行う方法についてご紹介します。 では、早速はじめましょう!今回のゴールは以下のようにドラッグ&ドロップで並び替えをすることです。ドラッグすると青色のボ…

Bubbleで検索してみよう!

Bubbleで検索してみよう! Webアプリを作る時に、検索画面、というのはよくありますよね。 外部のDBを使用する場合もあるかと思いますが、ここでは、BubbleのDataを使って検索する方法をお伝えします。 検索画面を作ってみよう まずは簡単に検索画面を作りま…

Podia vs Teachable オンラインコースのプラットフォームで使うならどっち?

Podiaとは? オンラインコースのプラットフォームとしてはTeachableが老舗的存在ですが、Podiaという名前を聞いたことがあるでしょうか? Podiaは、Teachableの競合として近年良く名前が挙げられているサイトです。 https://www.podia.com/ 日本語での解説記…

Udemy のようなオンライン学習サイトを「Teachable」で作ろう!

最近は Youtube をはじめ、色々なところで動画で学習する機会が増えてきています。 Youtube は無料で見れますが、もう少し詳しい動画が見たいとなると、私の場合は Udemy を調べてみたりしています。 Udemy は学習に特化した有料の動画配信サイトです。日本…

Bubble開発の小技集!便利な機能3つ

今回は、これから Bubbleで開発したい!もしくは、Bubble開発を始めたばかり!という方に、Bubble の小技集として、知っておくと便利な機能3つをご紹介したいと思います。 その1:セーブポイントを利用しよう! その2:レイアウトには Arrange メニュー そ…

Bubbleで作成したアプリをネイティブ化する方法

今回は、Bubbleで作成したアプリを Jasonelle を使用してネイティブ化する手順について、ご紹介します。 Jasonelle では、JSONを利用してアプリ化を行います。JSONは、サーバにファイルとして直接配置するか、もしくは Bubbleの API Workflows を利用する2種…

ノーコードでタスク化!Integromatを使ってみる!

Integromatとは 『Integromat』というWebアプリをご存知でしょうか? www.integromat.com Web上には様々なWebアプリがありますが、それらを連携させたり、手動でしていたものを自動でできたら良いなと思うことはありませんか? 例えば、Google Calendarに登…

BubbleでTwitterと連携してみよう!

1.はじめに 先日Bubbleで元号ジェネレータの作成方法について説明しました。 (その時の記事はコチラ↓) blog.nocodelab.jp さらに、プラグインを利用して、画像ダウンロードのところまで次の記事で説明しました。(その時の記事はコチラ↓) blog.nocodelab.…

ノーコードでタスク自動化!Zapier(ザピエル)を使ってみる!

Zapierとは? Zapierってご存知でしょうか? zapier.com 普段行っているWebアプリケーションを使用する業務で、自動化できたら良いな、と思うことはありませんか? 例えば、TwitterやFacebookの情報をSlackに一元管理するとか。 それを自動化できるのがZapie…

Bubble で データの新規登録と更新を行う方法

今回は、Bubble の基本的なデータ操作である「新規登録」と「更新」する方法について、サンプルページの作成を通じて ご紹介したいと思います。 1. 作成するサンプルページ 1-1. 画面イメージ 1-2. 仕様 1-2-1. 更新 1-2-2. 新規登録 2. 手順 2-1. Dataタブ…

Bubble で フェードインしてくるメニューを作成する方法

今回は、Bubbleでフェードインしてくるような動きのあるメニューの作成方法についてご紹介したいと思います。 1. Designタブの設定 2. Workflowタブの設定 3. まとめ 1. Designタブの設定 まず メニューのアイコンから配置していきましょう。今回はプラグイ…

Bubble 値を受け渡す「Data to send」を使いこなそう!

前回の記事で、ページ間の値の受け渡し方法である「QueryString」と「Data to send」をご紹介しましたが、今回は後者の「Data to send」について、もう少し詳しくご紹介したいと思います。 blog.nocodelab.jp 「Data to send」まとめ 「Data to send」で出来…