NoCode Ninja@Bubbleを中心にプロトタイプの制作過程をアウトプット

プログラミング不要の「NoCode」について発信します。作ってみたいサービスや企画などありましたらDMくださいー。

【NoCode】Bubbleでの日時の表示を設置してみよう

こんにちは。NoCode Ninjaです。 今回は、「時刻の表示」について紹介したいと思います。 弊サイト、NoCodeBankには「求人募集」のベージがあります。 こちらの実装にあたって考えたのは、投稿の際の日時の表示が必要だということでした。 そして、「何か良…

【Bubble】AddToAnyプラグイン+LINE公式でシェアボタンを設置しよう

こんにちは。NoCode Ninjaです。 今回は、実装するととても便利な「AddToAny」(シェアボタン)について紹介します。 AddToAnyは100種類以上ものシェアボタンを網羅した強力なPluginです。 上手に使うと非常に便利です。 少し+αも加えつつ、より便利な設…

【Bubble】「上に戻る」動きをするScroll Iconを設置してみよう(Only when~について)

こんにちは。NoCode Ninjaです。 今回は、「上に戻るボタン」の設置方法を紹介します。 弊サイトNoCodeBankにて新しく設置いたしました。 是非ご覧になってください。 nocodebank.bubbleapps.io 必ずどこかのサイトで目にしたことがあるかと思われる、ワンク…

【Bubble】Twitterログイン機能の設定をしてみよう 4、コールバックURLについて

こんにちは。NoCode Ninjaです。 今回も前回に引き続き、「Twitterログイン機能の設定をしてみよう」です。 前回まではこちら nocodejp.hatenablog.com nocodejp.hatenablog.com nocodejp.hatenablog.com 前回でTwitterログインに成功しましたので、最低限の…

【Bubble】Twitterログイン機能の設定をしてみよう 3、Twitterログインを実装しよう

こんにちは。NoCodeNinjaです。 今回も前回に引き続き、「Twitterログイン機能の設定をしてみよう」です。 前回まではこちら nocodejp.hatenablog.com nocodejp.hatenablog.com 今回はいよいよ「3、Twitterログインを実装しよう」です。 ここまで来ていたら…

【Bubble】Twitterログイン機能の設定をしてみよう 2、App登録をしてAPIを取得する

こんにちは。NoCode Ninjaです。 今回は前回に引き続き「Twitterログイン機能の設定をしてみよう」です。 前回はこちら nocodejp.hatenablog.com 今回は二回目「2、App登録をしてAPIを取得する」です。 前回は全て英語で記述などハードルが高く感じる方も多…

【Bubble】Twitterログイン機能の設定をしてみよう 1、Twitter Developerに登録する

こんにちは。NoCode Ninjaです。 今回は、Twitterログインについて紹介します。 今や多くのサイトが採用しているTwitterログインですが、 当サイトNoCodeBankでも採用しています。 Twitterログインはいわゆる他のソーシャルログインに比べると少し複雑で厄介…

【Bubble】Element templatesを改めて確認しよう 2、「Log in」「Reset Password」

こんにちは。NoCodeNinjaです。 今回は、前回の続きで「Log in」と「Reset Password」を紹介します。 前回はこちら nocodejp.hatenablog.com 今回はその続きで、Element templatesにある「Log in/Reset Password」です。 NoCodeBankでもアレンジして採用して…

【Bubble】Element templatesを改めて確認しよう 1、「Sign up」

こんにちは。NoCode Ninjaです。 今回は、BubbleのElement templatesであらかじめ備えられているSign up (アカウント登録&ログイン機能)について紹介します。 どのAppを作っても、デフォルトで用意されているElement templatesですので非常に便利に使えます…

【Bubble】Workflow「Element Actions」で動きをつけてみよう

こんにちは。NoCode Ninjaです。 今回は、Workflowでのエレメントの動作について紹介します。 Workflowからエレメントを動かすときは「Element Actions」から「show」を選んでいると思いますが、バリエーションが充実していますので色々試してみるのをオスス…

【Bubble】お問い合わせフォームを作ろう 2、通知をE-mailに送る方法

こんにちは。NoCodeNinjaです。 今回は、前回に引き続きBubbleを使って「お問い合わせフォームを作ろう」を紹介します。 前回はこちら https://nocodejp.hatenablog.com/entry/form 今回は、「inputの値をデータベース(以下DB)に格納する設定にし、通知をE…

【Bubble】お問い合わせフォームを作ろう 1、inputの値をE-mailとして受信する

こんにちは。NoCode Ninjaです。 今回は、Bubbleを使って「お問い合わせフォームを作ろう」を紹介します。 Webサイトには欠かせない「お問い合わせフォーム」。 もちろん、Bubbleを使ってできちゃいます。 送信側はinputフォームに入力して送信することで既…

【Bubble】 Bubbleでの超重要な機能「データベース」 4、Workflowを使って値を指定して削除しよう

こんにちは。NoCode Ninjaです。 今回も前回に引き続き「データベース(以下DB)」について紹介します。 前回はDB関連の実装で非常に良く使う「繰り返し処理」について学びました。 前回はこちら nocodejp.hatenablog.com 今回は、これらの値を削除する動作…

【Bubble】Bubbleでの超重要な機能「データベース」 3、Repeating groupを使って繰り返し処理をしよう

こんにちは。NoCode Ninjaです。 今回も前回までに引き続き、Bubbleでのデータベース(以下DB)関連の紹介をします。 シリーズ1,2はこちら nocodejp.hatenablog.com nocodejp.hatenablog.com 今回は、「データベースに値を入れて取り出す処理を繰り返す…

【Bubble】Bubbleでの超重要な機能「データベース」 2、Workflowを使ってデータを呼び出してみよう

こんにちは。NoCode Ninjaです。 今日は前回のWorkflowに続きBubbleでの超重要な機能「データベース」を紹介します。 前回はWorkflowを使ってデータを格納することについて紹介しました。 nocodejp.hatenablog.com 今回は前回の続き・・「データを呼び出す」…

【Bubble】Bubbleでの超重要な機能「データベース」 1、Workflowを使ってデータを格納しよう

こんにちは。NoCode Ninjaです。 今日は前回のWorkflowに続きBubbleでの超重要な機能「データベース」を紹介します。 前回はWorkflowについて紹介しました。 nocodejp.hatenablog.com そして今回、いよいよ来ました、データベース(Database、以下DB)です。…

【Bubble】Bubbleでの超重要な機能「Workflow」について

こんにちは。NoCode Ninjaです。 今回は、Bubbleで非常に大事な機能「Workflow」について紹介します。 Bubbleは基本的には感覚的に作れる為、最初の感じを覚えるとわりとサクサク作れるようになり「いけるじゃ~ん♪」と進められるのですが、Workflowの部分に…

【Bubble】Google reCAPTCHAプラグインを使ってreCAPTCHAを設置しよう

こんにちは。NoCode Ninjaです。 今日は、ログインにてお馴染みの機能「reCAPTCHA」について紹介します。 「私はロボットではありません」というチェックですね。 誰もが一度は見覚えがあったり、チェックしたことがあると思います。 色んなサイトで見られる…

【Bubble】Slick Slideshowプラグインを使ってスライドショーを設置してみよう

こんにちは。NoCode Ninjaです。 今回はBubbleの純正プラグイン「Slick Slideshow」を使った、とても便利で使いやすい「スライドショー」の設置を紹介したいと思います。 複数枚の写真をスライドショー形式で載せられるお馴染みのツールがBubbleに用意されて…

【Bubble】Googleアナリティクス設定方法

こんにちは。NoCode Ninjaです。 今回は、BubbleでのGoogleアナリティクスの設定方法についてご紹介します。 PV計測やその他便利な機能盛りだくさんです。 数字で改めて分析出来るので自然と愛着も湧いてきますし、もっと改善して伸ばしたいなー!と向上心も…

【Bubble】Twitterボタンの各種設置方法&Insert Dynamic Data機能を使った応用編

こんにちは。NoCode Ninjaです。 前回Twitterボタンや埋め込みについてを紹介しました。 前回はこちら nocodejp.hatenablog.com この記事の実践の形で当サイトNoCodeBankにてまだ使ったことのなかった各種ボタン(Follow,Hashtag,Message)を導入してみたの…

【Bubble】HTMLエレメントでTwitterの埋め込みやボタンを設置しよう

こんにちは。NoCode Ninjaです。 今回はHTMLエレメントでTwitterの埋め込みやボタンを設置する方法を紹介します。 Webページやアプリでよく見かけますね。 色々な種類がTwitter側であらかじめ用意されているので、それらをほぼ同じ段取りで設置する形です。 …

No Codeプロダクトを紹介する新サイト、立ち上げました!

こんにちは。NoCode Ninjaです。Twitterでもお伝えさせていただきましたが、今回NoCodeツール【Bubble】を使って作った「NoCodeBank」というサイトを立ち上げました。 https://nocodebank.bubbleapps.io 三方良し No Coderの方々が作ったプロダクトを紹介&…

【Bubble】英語を身につけるために有効な「睡眠学習」について

こんにちは。NoCode Ninjaです。 今回はいつもと少し趣向を変えて、英語を身につけるために有効かもしれない「睡眠学習」についてお話してみたいと思います。 Bubbleをはじめ現在あるNo Codeツールがほとんど全て英語のためこの題目は避けて通れませんし、興…

【NoCode】Bubbleを1か月真剣にやってみて今思うこと その3「Bubbleの良いところ、悪いところ」

こんにちは。NoCodeNinjaです。 前回に引き続き、Bubbleを始めて1か月経った今この時点で感じたことをお伝えします。 これから他のNo CodeツールだったりBubbleを始めようと思っている方の参考になれば幸いです。 前回はこちら↓ nocodejp.hatenablog.com 今…

【NoCode】Bubbleを1か月真剣にやってみて今思うこと その2「Bubbleの簡単なところ、難しいところ」

こんにちは。NoCodeNinjaです。 前回に引き続き、Bubbleを始めて1か月経った今この時点で感じたことをお伝えします。 これから他のNo CodeツールだったりBubbleを始めようと思っている方の参考になれば幸いです。 前回はこちら↓ nocodejp.hatenablog.com 今…

【NoCode】Bubbleを1か月真剣にやってみて今思うこと その1「はじめてのBubble」

こんにちは、NoCode Ninjaです。 Bubbleをはじめてちょうど1か月が経ちました。 真剣に覚えたくて真剣に取り組みましたが、1か月経った今この時点で感じたことをお伝えします。 これから他のNo CodeツールだったりBubbleを始めようと思っている方の参考にな…

【Bubble】Bubbleの有料プランをまとめてみた その2 Agency Subscription編

前回の続きです。 Bubbleの有料プラン3種類を紹介しました。 nocodejp.hatenablog.com 今回は、これらとはまた違う枠の有料プランがありますのでご紹介します。 Agency Subscriptionとは クライアントへの納品をビジネスとする組織へ向けたプランのこと bubb…

【Bubble】Bubbleの有料プランをまとめてみた その1

Bubbleの有料プランをまとめてみた こんにちは。NoCode Ninjaです。 今回はBubbleの有料プランについて紹介します。 種類が複数ある上に、それぞれどうなっているのかは しっかり調べないとわかりづらい印象でしたので記事にしました。 一つ一つ紹介していき…

【Bubbleで実装#1「掲示板」】Bubble初学者がぶつかる意外なハードル・・レスポンシブ(responsive)への意識について

年も明けました。 今年もよろしくお願いします。 No Codeの一年にしていきたいと思います♪ 大晦日も正月も、蕎麦食ったりおせち食ったりお餅食ったりしながら No CodeツールのBubbleで初学者がわしわしと作っています。 何事も最初は既存の作品のコピーから…