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
120
ガチマナ会 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
31
高専で制御を、大学でセンシングを学び、次は脳みそ
satoshirobatofujimoto
0
160
画像生成AIを使って勝負しよう
satoshirobatofujimoto
1
66
画像生成AIを使って勝負しよう
satoshirobatofujimoto
0
100
画像からプロンプトを考えて最も似ている画像を生成した人が勝ちのゲーム@AIミーティング
satoshirobatofujimoto
0
71
VPS研究者が語る”VPS概論”
satoshirobatofujimoto
0
320
画像からプロンプトを考えて最も似ている画像を生成した人が勝ちのゲーム
satoshirobatofujimoto
0
120
OpenAI 新機能まとめ(Function callingとAdd your data編)
satoshirobatofujimoto
0
190
PLATEAUを用いた熊本市中心市街地におけるバリアフリー情報の可視化
satoshirobatofujimoto
0
970
Other Decks in Technology
See All in Technology
Azure Pipelinesを使用したCICDベースラインアーキテクチャ実践
yuriemori
0
190
20240717_イケコパ代表Copilot_in_Teams会社でこう使ってます
ponponmikankan
2
430
How to Think Like a Performance Engineer
csswizardry
4
590
LINE WORKSへ簡単通知!Incoming Webhookアプリの紹介
mmclsntr
0
110
さらに高品質・高速化を目指すAI時代のテスト設計支援と、めざす先 / AI Test Lab vol.1
shift_evolve
0
190
Azure OpenAI Service Dev Day / LLMでできる!使える!生成AIエージェント
masahiro_nishimi
3
740
プレイドにおけるDatadog APMの活用方法
plaidtech
PRO
2
120
Github Actions 로 Android 팀의 효율성 극대화
hadonghyun
0
160
大規模ドラレコデータ収集・機械学習基盤を支える AWS CDK 〜導入・運用事例紹介〜
pemugi
0
110
ゆめみのアクセシビリティの現在地と今後
ryokatsuse
3
290
DevIO2024_レガシー運用からの脱却 -クラウド活用の実践事例とベストプラクティス-
jun2882
0
210
エンジニア向け会社紹介資料
caddi_eng
14
220k
Featured
See All Featured
Code Review Best Practice
trishagee
58
16k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
17
1.5k
Gamification - CAS2011
davidbonilla
78
4.9k
Navigating Team Friction
lara
181
13k
Testing 201, or: Great Expectations
jmmastey
33
6.9k
Building Flexible Design Systems
yeseniaperezcruz
323
37k
Visualization
eitanlees
139
14k
In The Pink: A Labor of Love
frogandcode
139
22k
Thoughts on Productivity
jonyablonski
64
4.1k
The Pragmatic Product Professional
lauravandoore
29
6.1k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
226
52k
StorybookのUI Testing Handbookを読んだ
zakiyama
15
4.9k
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をつくーる