- Bubble weekly newsletter
- Posts
- 📰 週刊Bubble | ここ3週間で大規模障害が11日発生した?ことについて
📰 週刊Bubble | ここ3週間で大規模障害が11日発生した?ことについて
Bubbleのステータスページ、開発者の平均時給について、ダークモードへの切り替えTipsなど今週も盛りだくさんの内容をお届け!

Bubble Weekly Newsletterへようこそ!
先週1週間のBubbleのホットニュースやForumトピックをピックアップし日本語でお届けします。このニュースレターを読むとBubbleの動向をつかめる内容になっています!
Bubble好きがおくるBubbleがもっと楽しくなるニュースレター!
今回はお知らせも入れました。最後まで読んでいただけると嬉しいです^^
今週もスタートです!!
この記事は5分程で読める内容になっています。

心配した方がいい? - ここ3週間で大規模障害が11日発生したことについて
開発者の方はご存知だと思いますが、Bubbleの Status page で過去90日間に起こった「大規模な障害」や「部分的な停止」を知ることができます。現在の稼働状況も確認可能です。
Bubble Status pageは こちら
Forumで投稿されたのは、直近3週間のうち11日も大規模な障害が起こり心配の声でした。
11月4日においては障害が7時間続いたことになっています。

投稿者の Adamさんは、これは開発者だけの問題ではなくクライアントや投資家からの信頼が危うくなると懸念しています。
こんなにもステータスが赤色(大規模障害)になると確かに心配にもなります。
このトピックに、自分のアプリは正常に動いているや、アプリがダウンしているなど様々なコメントが寄せられました。
その後Bubbleの創業者 Joshからもコメントがありました。
ある投稿者からの指摘通り、現在は厳格なポリシーを採用しているため、いくつかのアプリ(全体ではない)に影響される事象が発生した際にもすぐにステータスページを更新している、とのこと。
障害アラートの感度が高まったために、障害の数が増加し、稼働時間が減少している。つまり、「停止」の多くは、少数のアカウントに短時間だけ影響を与える小規模な問題であり、実際には長期間にわたる本格的な停止ではなかった
Joshは以下述べています。
以前より厳格なポリシーを採用している
常にエンジニアへの通知を優先し、大多数に影響しない場合も通知している
少数アプリに影響しているのにステータスが更新されないという状況を避けている
そのためステータス通知で障害や停止通知が多く見えるようになっている
一部分で発生している障害を分けて表示できるよう現在取り組んでいる
つまり現在は大多数のユーザーには影響しない細かなものも通知するようにしており障害が多く表示されるようになっていることがわかりました。大規模障害については今後も事後検証を公開するとのことです。
😃 Joshからの回答は透明性があり安心できるものでした。ユーザー数が増え規模が大きくなった後もこうして創業者がForumに回答する姿勢。こういう部分も私がBubble推しな理由の一つです。
今回のスレッドも含め、ユーザーサからは辛辣なコメントも多いですが、しっかり受け止め回答してくれています。
BubbleのStatus pageから障害が起こった際の通知を受け取ることができます。めちゃくちゃBubble開発にコミットしている方は登録しておくと良いでしょう。Slack等への通知もおすすめです!


Bubble開発者の平均時給は?
11/22にBubbleフォーラムのカテゴリー「Jobs / Freelance」に投稿された内容です。
モロッコ在住のBubble初心者で、フランス企業からトレーニングを受ける予定の方からの質問です。長年ソフトウェア開発の経験もあるようです。
バブル開発者の平均給与または時給はいくらですか?
このシンプルな問いに現役Bubbleエンジニアからの回答がありました。
<回答>
“フランスでは、ジュニアのノーコード開発者の場合、1 日あたり約 350 ~ 400 ユーロ(日本円で約55,900 ~ 63,000円/日給)ですが、時間の経過とともに 600 ユーロになることが予想されます” by Frank
Frankさんのコメントに対し
“Bubble BootCamp を終えたばかりのジュニア開発者にとっては、少し価格が高い気がします。初心者レベルでは1時間に25~30 ユーロ(日本円で約3,900 ~ 4,700円/時給)が妥当だと思います。Bubbleのジュニア開発者は解決するよりもはるかに多くの問題を引き起こす可能性があります。” by georgecollier
対するFrankさんの返信は
“あなたが言う通り、それが初回のプロジェクトであるならそうかもしれませんが、私の意見ではノーコード開発者のフリーランサーは 300 ユーロ/日 、約 37,5 ユーロ ~ 40 ユーロ/時間(日本円で約5,900 〜 6,300円/時給)未満の仕事を決して提供すべきではありません。それ以下では働く価値がありません!” by Frank
その後georgecollierさんの返答は以下続きます
“念頭に置いておくべきことは、彼らがジュニアのBubble開発者をリモートで雇う場合、あなたは最低でも時給25ユーロから30ユーロ(日本円で約3,900 ~ 4,700円/時給)を期待するフランス人と競争しているわけではありません。あなたが競争しているのは、購買力が低い他の国々で、人々が喜んで時給10ユーロ(日本円で時給約1,600円)、あるいはそれ以下で働くような国々です。” by georgecollier
🧐 上記やりとりから皆さんはどう思いましたか? 円安の影響もありユーロ換算が高く見えることは確かです。日本のマーケットではジュニア開発者は2,500 ~ 3,500円/時間 で依頼されるケースが多く見受けられます。
世界のNoCodeフリーランスが集まるマーケットプレイスでは、一番下は30ドル~一番上のシニア開発者は250ドル(日本円で約4,400 ~ 36,700円/時給)で取引されています。
日本は日本語の壁があり時給相場が固定されますが、言語の壁が取り払われた時、シニア開発者ほど海外に出た方が単価上限は高くなります。最近インド人のBubble開発者層の発展が目覚ましく、英語が話せる彼らはとても強者だと思っています。

💡 ダークモード/ライトモード などのスタイル切り替え方法
Forumの「Question」に投稿された質問です。
ダークモード/ライトモードの動的な切り替えに関して、質問者のVadimさんはOption Setを使い20色以上を登録。それをCurrent User’s valueを使い設定しています。しかし問題は背景、枠線、ドロップシャドウなど色変更したい全てのエレメントのプロパティエディタに一つ一つ手動で設定しなければならずとても手間がかかること。他に解決策が無いかを尋ねています。
これにはThimoが回答しています。
Thimoが過去にX(Twitter)に投稿したCSSを使い解決する方法がとてもクレバー!
“BubbleのStyle variablesを使用している場合、これはCSSで上書きすることが可能です”
Did you know that you can overwrite @bubble style variables? I was able to create a dark mode in 15 minutes because of it!
You can re-assign the color values for existing style variables using CSS and everything will auto-update! No need to add a conditional to every element 😎 twitter.com/i/web/status/1…
— Thimo (@thmawa)
4:44 PM • Jul 27, 2023
詳しく以下に解説します。
例えばダークモードの背景色を設定したい場合
(わかりやすい色で設定します)
①まずデフォルトの背景色を Styles > Style variablesに設定しておきます。#A8DADC(うす青色)に設定しました。↓

ライトモードのデフォルトではページの背景色にこのうす青色を設定↓

②Previewページの「検証」から Styles > style attributeに行き、該当場所の変数(Style Variables)をみつけます。↓
今回の背景色のこの2行です。色に関しては2行がセットです。
*ちょっとややこしいですが、#A8DADC(HEX)で色を登録をしましたが、検証では168, 218, 220(RGB)表記になっています。表記形式は異なりますが同じ色です。
--color_background_default: rgba(168,218,220,1);
--color_background_default_rgb: 168,218,220;

③CSSの設定を行います。
Userのdarkmodeがyesの時のStyleを上書きします↓
!important も付けて記載します。

④darkmodeがyesの人でログインもしくはRun asします。
すると②で上書きした背景色rgb(29,53,87)で表示されるようになりました!
この色↓

背景色がダークモードになりました!!
この方法を使い背景色以外も設定できますね👏
Styles > Style variablesは32色登録できます。自身で登録したvariablesは「ページ検証」の方はランダムなvariables名で登録されます。似通った名前で勝手に登録されるので、頑張って見つけてください。
こんな感で登録されます…↓

⚠️ 削除したFieldsはOptimize applicationしても値が取れてしまうという衝撃!
by ノーコード ラボ
日本でBubbleといえば、おなじみノーコード ラボさんの記事より。今回はかなり衝撃的な事実が発覚です。
それは
削除されたはずのフィールドですが、Privacyルールを設定していない状態でフィールド削除を実行している場合、そして、そのフィールドに対して既に何かしらの値が登録されている場合は、内部的には取得されてしまうということに注意してください
それならFieldを削除したらその後すぐにOptimize applicationすれば良い、と思った方もいるはず。
ところが、どうやらこのOptimize applicationしても「削除フィールドに登録された値まではクリアされません」とのこと。
ノーコード ラボさんも書いていますが、機密性が高いデータを登録している場合は以下が必須になります。
Privacyルールを設定後に削除やOptimize applicationする
登録の値を削除してから削除やOptimize applicationする
ノーコード ラボさんの記事はこちら
😂 私はOptimize applicationを頻繁に行うタイプですが、値が取得できるとはかなりショック。今後はOptimizeする前に、今まで登録された値のに機密データは無いか?の確認がマストになりますね。

SNSやブログ、その他Bubbleのニュース!
ツールチップのUIは無料プラグインを使おう!
ツールチップは、マウスオーバーした際に表示される補足説明です。Bubble標準でも機能が備っており、テキストやボタン、アイコンなどに設定することができます。
方法はプロパティエディタの「Tooltip」に表示させたいテキストを入力するだけ。

しかしBubble標準のTooltipは表示位置やデザインが固定されており、ホバーして後の表示までの時間も遅く(1~2秒ほどかかります)使い勝手が良くありません。
Bubble標準のTooltipを使ったデザインと動き↓

そこで先日公開されたTooltipのプラグインが秀逸すぎました😂
ちゃんと吹き出しになっており、色(テーマ)も選べます!
Bubblerのみなさん!もうTooltipを自作せずにすみます。
Better Native Tooltipをインストールするだけ。

インストールすと吹き出し付きのTooltipに自動で更新されています。あとは配置位置や色を好みに合わせて指定すればOK。
【配置とアニメーション指定】
ブラケットかっこ[ ]内に位置を指定、アニメーションを無しにする際はno-animationを追加


【色テーマ指定】
テーマは以下4つから指定ができます。テーマの指定場所はプラグインページのThemeへ。
・light
・light-border
・material
・translucent

light-borderにしてみました。
ページの背景が暗いダークモードの場合は「light-border」の指定が良い感じ↓

😃 Tooltipを表示させる位置やアニメーション指定ができ、テーマもこの種類で十分。シンプルで最強なTooktipプラグインが登場しました。まだの方は是非試してみてください。
プラグイン:Better Native Tooltip
ℹ️ お知らせ
🐭 ニュースレターのパートナー募集
パートナー募集を「積極的」に開始します!
Bubbleで作ったアプリを宣伝したい、プラグインを公開したので知らせたい、Bubble関連のサービスを告知したい、などなど
Bubbleに特化したこの週間Newsleetterでお知らせできます✅
😃 みなさんからのレビューやコメント大歓迎です
今回ためになったことや興味深かったこと
次回はこんな内容を知りたい
Bubbleで困っていること
こちらからご意見をお待ちしております。レビューは全て目を通しています。Twitterなどからの拡散も大変嬉しいです。励みになります^^
🐭 ニュースレターのパートナーも募集しています。詳細はお問い合わせください。
それでは良い週末を!また来週お会いしましょう!