本シリーズでは、ノーコードラボで過去にご紹介した「iPhone のメッセンジャーもどきを Bubble で作ってみる(初級者向け)」を、昨年11月にリリースされた新レスポンシブ機能に対応させた内容で、改めてご紹介していきたいと思います!
初級者向けという事で、細かい部分も丁寧に解説していきますので、是非ご参考いただければと思います。
このシリーズでは、以下のツイートで紹介している「iPhoneメッセンジャーのようなWebアプリ」を作成していきます。
bubble で iMessage(iPhone のメッセンジャー)っぽいものを作ってみました。
— ノーコード ラボ (@nocodelab) 2020年1月22日
onesignal と連携して web push を、https://t.co/mJ0skIZpiL と連携して Facetime もどきを実現しています。#NoCode #Bubble pic.twitter.com/kqLWPPKfRL
前提条件
Bubble の無料アカウントを登録済み。ログインしておいてください。
Bubble の基本操作はわかっている。
本ブログの「twitter のような簡単な SNS を Bubble で作ってみる(新レスポンシブ版)」を学習済み、もしくはそれ相当の知識がある。
Bubble を初めて触るという方は入門者向けの次のコンテンツを先にみることをオススメします。
blog.nocodelab.jp ※ 現在、新レスポンシブエンジンに対応していませんが今後対応予定です。
blog.nocodelab.jp ※ 現在、新レスポンシブエンジンに対応していませんが今後対応予定です。
目的
Bubble の操作方法を一通り覚えた人が実際にアプリを作成できるようになるための考え方や機能などを紹介する
新レスポンシブ版での実装方法の紹介
作成方針
簡単な Bubble の操作方法は省略する。
デザインについても簡単なところは省略。難しそうなところだけピックアップして解説する。
DB 設計、ワークフローについては細かく解説する。
セキュリティに関しては最低限。
ユーザー登録やログインに関してはザックリ説明。詳しく知りたい方はログイン処理のシリーズを見てください。
作成予定
1, 新規アプリの作成及び、ユーザー登録、ログイン画面を作成する
2.メッセージを送信する相手を選択する画面を作成する
3.メッセージを表示する画面を作成する
4.プロフィール画面を作成する
5.初めてのユーザーにメッセージを送信する画面を作成する
6.OneSignal を使って Web Push を実装する(iOS を除く)