ノーコード ラボ

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

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

Bubble で作るシンプルなマッチングサイト(初級者向け)13:【クライアント・ワーカー共通】クライアント紹介、ワーカー紹介ページの作成

この記事は 【 Bubble で作るシンプルなマッチングサイト(初級者向け) 】の第13回(最終回)です。 本シリーズが初めての方は、以下の記事でコンテンツの説明をしていますので、ご確認いただければと思います。 blog.nocodelab.jp デザインの細かい部分に…

意外と簡単!?Bubble で作った Webアプリを PWA にする方法(2023年版)

1. PWA とは 2. A2HS とは 2.1 iOS の場合(Safari) 2.2 Android の場合(Chrome) 3. PWA の設定 3.1 apple-touch-icon 3.2 manifest.json の作成 3.3 Service Worker の作成 3.4 manifest.json と service-worker.js を呼び出すコードを作成 3.5 manifest…

Bubble で作るシンプルなマッチングサイト(初級者向け)12:【クライアント】契約ワーカーページの作成

この記事は 【 Bubble で作るシンプルなマッチングサイト(初級者向け) 】の第12回です。 本シリーズが初めての方は、以下の記事でコンテンツの説明をしていますので、ご確認いただければと思います。 blog.nocodelab.jp デザインの細かい部分については割…

Bubble で作るシンプルなマッチングサイト(初級者向け)11:【クライアント】仕事管理と募集管理ページの作成

この記事は 【 Bubble で作るシンプルなマッチングサイト(初級者向け) 】の第11回です。 本シリーズが初めての方は、以下の記事でコンテンツの説明をしていますので、ご確認いただければと思います。 blog.nocodelab.jp デザインの細かい部分については割…

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

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

Stripeの銀行振込機能をBubbleアプリに統合する方法

みなさん、こんにちは! 今回は Bubble で Stripe の銀行振込による支払いを導入する方法についてご紹介します。Stripe を使用した決済方法については、過去の記事でも Stripe Payment Links を使用する方法や PriceWell を使用した方法など、他にも色々取り…

Bubble で作るシンプルなマッチングサイト(初級者向け)10:【クライアント・ワーカー共通】マイページとお知らせページの作成

この記事は 【 Bubble で作るシンプルなマッチングサイト(初級者向け) 】の第10回です。 本シリーズが初めての方は、以下の記事でコンテンツの説明をしていますので、ご確認いただければと思います。 blog.nocodelab.jp デザインの細かい部分については…

Bubble で作るシンプルなマッチングサイト(初級者向け)9:【クライアント・ワーカー共通】コンタクトページの作成

この記事は 【 Bubble で作るシンプルなマッチングサイト(初級者向け) 】の第9回です。 本シリーズが初めての方は、以下の記事でコンテンツの説明をしていますので、ご確認いただければと思います。 blog.nocodelab.jp デザインの細かい部分については割…

Bubble で作るシンプルなマッチングサイト(初級者向け)8:【ワーカー】応募ページと応募管理ページの作成

この記事は 【 Bubble で作るシンプルなマッチングサイト(初級者向け) 】の第8回です。 本シリーズが初めての方は、以下の記事でコンテンツの説明をしていますので、ご確認いただければと思います。 blog.nocodelab.jp デザインの細かい部分については割…

Bubbleの新料金プランについて(2023/05/01~適用開始)

みなさん、こんにちは! 今回は、2023年5月1日から適用されているBubbleの新たな料金プランについてご紹介します!既存アプリの取り扱いについても ご紹介しますので、ぜひ最後までご一読ください。 1. Bubbleの新料金プラン(2023年5月1日から) 2. 新料金…

Bubble で作るシンプルなマッチングサイト(初級者向け)7:【ワーカー】仕事検索と仕事紹介ページの作成

この記事は 【 Bubble で作るシンプルなマッチングサイト(初級者向け) 】の第7回です。 本シリーズが初めての方は、以下の記事でコンテンツの説明をしていますので、ご確認いただければと思います。 blog.nocodelab.jp デザインの細かい部分については割…

Bubble で作るシンプルなマッチングサイト(初級者向け)6:Reusable element の作成②

この記事は 【 Bubble で作るシンプルなマッチングサイト(初級者向け) 】の第6回です。 本シリーズが初めての方は、以下の記事でコンテンツの説明をしていますので、ご確認いただければと思います。 blog.nocodelab.jp デザインの細かい部分については割…

Bubble で作るシンプルなマッチングサイト(初級者向け)5:【クライアント】仕事情報の新規登録と編集画面

この記事は 【 Bubble で作るシンプルなマッチングサイト(初級者向け) 】の第5回です。 本シリーズが初めての方は、以下の記事でコンテンツの説明をしていますので、ご確認いただければと思います。 blog.nocodelab.jp デザインの細かい部分については割…

Bubble で作るシンプルなマッチングサイト(初級者向け)4:Reusable element の作成①

この記事は 【 Bubble で作るシンプルなマッチングサイト(初級者向け) 】の第4回です。 本シリーズが初めての方は、以下の記事でコンテンツの説明をしていますので、ご確認いただければと思います。 blog.nocodelab.jp 前回の第3回では、トップページとサ…

Bubble で作るシンプルなマッチングサイト(初級者向け)3:サインアップ周りとプロフィール画面の作成

この記事は 【 Bubble で作るシンプルなマッチングサイト(初級者向け) 】の第3回です。 本シリーズが初めての方は、以下の記事でコンテンツの説明をしていますので、ご確認いただければと思います。 blog.nocodelab.jp 前回の第2回では、データベース周り…

Bubble で作るシンプルなマッチングサイト(初級者向け)2:Data types の作成と Privacy の設定

この記事は 【 Bubble で作るシンプルなマッチングサイト(初級者向け) 】の第2回です。 本シリーズが初めての方は、以下の記事でコンテンツの説明をしていますので、ご確認いただければと思います。 blog.nocodelab.jp 前回の第1回では、アプリのページ構…

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

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

ノーコードでウェブサイトを作成できる「Framer Sites」の使い方と便利な機能の紹介

こんにちは!今回のテーマは、ノーコード開発ツール「Framer」のウェブサイト作成・公開機能「Framer Sites」です。 Framerはもともとプロトタイプをノーコードで作成できるサービスでしたが、2022年6月からウェブサイトの作成・公開がノーコードでできる「F…

Bubble で作るシンプルなマッチングサイト(初級者向け)1:ncworks の全体像と仕様について

この記事は 【 Bubble で作るシンプルなマッチングサイト(初級者向け) 】の第1回です。 本シリーズが初めての方は、以下の記事でコンテンツの説明をしていますので、ご確認いただければと思います。 blog.nocodelab.jp 皆さん、こんにちは!シリーズ第1…

Bubble で作るシンプルなマッチングサイト(初級者向け)

みなさん、こんにちは!今日は新シリーズのご案内です!今回は、Bubble でシンプルなマッチングサイトを作成していきます。作成するのは、CrowdWorks のような仕事の募集や応募ができるサービスです。 また、本シリーズは初級者編ということで、Bubble を初…

Softrで構築したアプリをPWAとしてインストールできるようにする「Softr mobile」の利用方法

こんにちは!今回は、ノーコード開発ツール「Softr」について、構築したアプリをPWAとして端末にインストールできるようにする「Softr mobile」の利用方法をご紹介します。 Softrは、本ブログでもご紹介したことがある直感的にWebアプリを構築できるノーコー…

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

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

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

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

BubbleでGPT-3をfine-tuningしてキャラクター設定したAIチャットアプリを構築する

こんにちは!今回は、GPT-3をfine-tuningしてキャラクター設定したAIと会話できるアプリをBubbleで構築していきます! fine-tuningとはモデルを再学習させる手法で、本記事では「つくよみちゃん」というキャラクターの会話データセットを使ってGPT-3 Davinci…

FlutterFlowで作成!テンプレートでタスク登録アプリ ー 第5回 ユーザー編集を修正してみよう。

FlutterFlowで作成!テンプレートでタスク登録アプリ ー 第5回 ユーザー編集を修正してみよう。 1.ユーザ編集画面:Edit Profileについて 1.1.メールアドレスの更新について 1.2.ReadOnlyの設定 2.画像アップロードの準備 2.1.Firebase Storageの設定 2.2.Fu…

Bubble のセキュリティ監査ツール「Flusk Vault」とは

みなさん、こんにちは! 今回は、Bubble Forum でも話題に上がっていた セキュリティ監査ツール「Flusk Vault」についてです。 www.flusk.eu forum.bubble.io 当然のことながら、ノーコード開発においてもセキュリティ対策は重要課題のひとつです。ノーコー…

FlutterFlowで作成!テンプレートでタスク登録アプリ ー 第4回 画面遷移をしてみよう。

FlutterFlowで作成!テンプレートでタスク登録アプリ ー 第4回 画面遷移をしてみよう。 こんにちは! 今回はFlutterFlow初心者向けシリーズ「FlutterFlowで作成! テンプレートでタスク登録アプリ」の第4回「画面遷移をしてみよう。」です。 今回は、主に画…

AIと対話できるチャットアプリをBubbleとGPT-3.5で構築する

こんにちは!今回は、OpenAIのGPT-3.5 Davinciモデルを使ってAIと対話できるチャットアプリをBubbleで構築していきます。 2022年は、画像やイラストの生成、文章の生成・要約AIなど多様な一般向けAIサービスが話題となり、AIが身近なものになった年でしたね…

FlutterFlowで作成!テンプレートでタスク登録アプリ ー 第3回 アカウント作成をしてみよう(1)

FlutterFlowで作成!テンプレートでタスク登録アプリ ー 第3回 アカウント作成をしてみよう(1) 1.アカウント作成について 2.Authenticationの設定について 3.Usersコレクションについて 4.Register画面 4.1.TextFieldの設定 4.2.Actionsの設定ーCreate Ac…

BubbleでSendinblueと連携してメール認証・パスワードリセットを実装する

こんにちは!今回は、Sendinblueを使ってメール認証・パスワードリセットをBubbleで実装する方法をご紹介します。 Bubbleからのメール送信の際にメール配信サービスを経由させたい場合、SendGridが第一選択肢になることが多いですが、諸々の理由からSendGrid…