Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ガチマナ会 vol.1
Search
Satoshi Gachi Fujimoto
February 20, 2024
Technology
0
200
ガチマナ会 vol.1
ノーコードでSNSをつくーる
Satoshi Gachi Fujimoto
February 20, 2024
Tweet
Share
More Decks by Satoshi Gachi Fujimoto
See All by Satoshi Gachi Fujimoto
バスあと何分ミニサイネージ
satoshirobatofujimoto
0
83
高専で制御を、大学でセンシングを学び、次は脳みそ
satoshirobatofujimoto
0
250
画像生成AIを使って勝負しよう
satoshirobatofujimoto
1
98
画像生成AIを使って勝負しよう
satoshirobatofujimoto
0
200
画像からプロンプトを考えて最も似ている画像を生成した人が勝ちのゲーム@AIミーティング
satoshirobatofujimoto
0
150
VPS研究者が語る”VPS概論”
satoshirobatofujimoto
0
390
画像からプロンプトを考えて最も似ている画像を生成した人が勝ちのゲーム
satoshirobatofujimoto
0
190
OpenAI 新機能まとめ(Function callingとAdd your data編)
satoshirobatofujimoto
0
240
PLATEAUを用いた熊本市中心市街地におけるバリアフリー情報の可視化
satoshirobatofujimoto
0
1k
Other Decks in Technology
See All in Technology
2025/3/1 公共交通オープンデータデイ2025
morohoshi
0
110
サバイバルモード下でのエンジニアリングマネジメント
konifar
21
7.2k
OCI Success Journey OCIの何が評価されてる?疑問に答える事例セミナー(2025年2月実施)
oracle4engineer
PRO
2
220
困難を「一般解」で解く
fujiwara3
7
2.2k
Pwned Labsのすゝめ
ken5scal
2
570
Global Databaseで実現するマルチリージョン自動切替とBlue/Greenデプロイ
j2yano
0
160
OPENLOGI Company Profile for engineer
hr01
1
20k
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership, regardless of position
madoxten
3
2.5k
開発組織を進化させる!AWSで実践するチームトポロジー
iwamot
2
540
Snowflakeの開発・運用コストをApache Icebergで効率化しよう!~機能と活用例のご紹介~
sagara
1
530
User Story Mapping + Inclusive Team
kawaguti
PRO
2
320
スクラムというコンフォートゾーンから抜け出そう!プロジェクト全体に目を向けるインセプションデッキ / Inception Deck for seeing the whole project
takaking22
3
140
Featured
See All Featured
Designing on Purpose - Digital PM Summit 2013
jponch
117
7.1k
Building a Modern Day E-commerce SEO Strategy
aleyda
38
7.1k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
Building an army of robots
kneath
303
45k
Six Lessons from altMBA
skipperchong
27
3.6k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Adopting Sorbet at Scale
ufuk
75
9.2k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Become a Pro
speakerdeck
PRO
26
5.2k
Rebuilding a faster, lazier Slack
samanthasiow
80
8.9k
Optimizing for Happiness
mojombo
377
70k
The Art of Programming - Codeland 2020
erikaheidi
53
13k
Transcript
ガチマナ会 vol.1 ガチでマナぶ会 2024/02/20
ノーコードでSNSつくろう • https://funrepeat.com/bubble-tutorial/
Hello World!
• https://bubble.io/ アカウントを登録
アンケートに回答
Get startedをクリック
アプリ名を入力
デフォルトのフォントを選択
デフォルトのカラーを選択
Get started buildingをクリック
メニューバー
View -> Show gridにチェック
Visual elements -> Text D&D
テキストの編集
Previewをクリック
Visual Elements -> Button D&D
ボタンを押したらHello, World!を表示したい
This element is visible on page loadのチェックを外す
Click meボタンのAdd workflow
Buttonをクリックしたら、Hello, World!を表示したい
Show -> Element を Text Hello, World!にする
Hello, World! 完成
簡単なSNSアプリ
Input forms -> Multiline Input D&D
Visual Elements -> Button、レイアウトの調整 D&D
データベースを作成(Tweet)
Create a new field
Fieldの選択
Containers -> Repeating Group D&D
RepeatingGroup Tweet -> Appearanceの設定
Textを割り当てる D&D
Insert dynamic data -> Current cell’s Tweet’s tweet
「投稿する」ボタンでツイートしたい
「投稿する」ボタンでアクションを追加
Tweet内容を指定し、ツイートする
ツイートしたらリセット
完成
ヘッダーを作成
アプリのコピー(Ctrl+A -> Copy to another app)
Upgradeが必要
Freeは1アプリまで
ページについて
ヘッダーを作成
• zzz ヘッダーを作成
Responsive -> Reusable header Layoutの設定
ヘッダーのスタイルを作成
ヘッダーのスタイルを設定
ヘッダーのスタイルを設定
ヘッダーにアプリ名を設定
ヘッダーにアプリ名を設定
ヘッダーにアプリ名のスタイルを作成
ヘッダーにアプリ名のスタイルを設定
ヘッダーにタイムラインのリンクを追加 D&D
ヘッダーにタイムラインのリンクを追加
ヘッダーにタイムラインのリンクを追加
ヘッダーにタイムラインのリンクを追加
indexにヘッダーを追加
完成
疲れました
次回、GlideでSNSをつくーる