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

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

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

今回は Bubble でページ間において、値をどのように受け渡すかを、以下の2種類の方法でご紹介したいと思います。 QueryString（クエリ文字列、URLパラメータ）で受け渡す Data to send を利用する 1. クエリ文字列（QueryString、URLパラメータ）で受け渡す …

1. Bubbleのプラグインを使ってみよう。 1-1．はじめに 2. プラグインを準備しよう。 2-1. プラグインをインストールしてみよう。 2-2. HTMLのIDを利用できるように設定しよう。 3. プラグインを使用してみよう。 3-1.画像をグループ化しよう。 3-2.プラグイ…

今回は「4択クイズアプリ」に引き続き、Bubbleを使った「フラッシュカード」の作り方について、カウントダウンタイマーを中心にご紹介したいと思います。 1. アプリ概要 1-1. 作成するアプリ 1-2. 前提条件 1-3. アプリの主な機能 2. 必要項目の洗い出し 2-1…

今回は、4択クイズアプリ の最終回です。設定するワークフローについて解説したいと思います。なお「Set state」となるワークフローの設定については、前回の記事をご参考ください。 関連記事 Bubble で作る「4択クイズアプリ」１：アプリ概要とデータベース…

今回は「4択クイズアプリ」を通して、Bubble の 「Custom state」について、ご紹介したいと思います。 2020/03/23 Bubble の inspector 機能を使用して「Custom state」の作成する方法について追加しました。また、Page Load 時に行っていた「Custom state」…

Airtableでシフト表を作成 1.新規作成 「＋Add a base」をクリックし、「Start from scratch」を選択します。 新規作成のbase名を「シフト表」とし、色を選択します。今回はカレンダーと連携をしますので、下記の画像のカレンダーアイコンを選択します。 2.…

今回は前回の記事で解説した「４択クイズアプリ」で使用するエレメントを、実際に「Design」タブに配置して設定していく方法を解説したいと思います。 blog.nocodelab.jp １. 枠組みの作成 ２. データベースと連携する「Repeating Group」の配置と設定 ３.「…