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
170
ガチマナ会 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
55
高専で制御を、大学でセンシングを学び、次は脳みそ
satoshirobatofujimoto
0
210
画像生成AIを使って勝負しよう
satoshirobatofujimoto
1
79
画像生成AIを使って勝負しよう
satoshirobatofujimoto
0
160
画像からプロンプトを考えて最も似ている画像を生成した人が勝ちのゲーム@AIミーティング
satoshirobatofujimoto
0
110
VPS研究者が語る”VPS概論”
satoshirobatofujimoto
0
360
画像からプロンプトを考えて最も似ている画像を生成した人が勝ちのゲーム
satoshirobatofujimoto
0
150
OpenAI 新機能まとめ(Function callingとAdd your data編)
satoshirobatofujimoto
0
210
PLATEAUを用いた熊本市中心市街地におけるバリアフリー情報の可視化
satoshirobatofujimoto
0
1k
Other Decks in Technology
See All in Technology
AWS Lambdaと歩んだ“サーバーレス”と今後 #lambda_10years
yoshidashingo
1
170
Amazon Personalizeのレコメンドシステム構築、実際何するの?〜大体10分で具体的なイメージをつかむ〜
kniino
1
100
Terraform Stacks入門 #HashiTalks
msato
0
350
SSMRunbook作成の勘所_20241120
koichiotomo
2
130
AIチャットボット開発への生成AI活用
ryomrt
0
170
複雑なState管理からの脱却
sansantech
PRO
1
140
隣接領域をBeyondするFinatextのエンジニア組織設計 / beyond-engineering-areas
stajima
1
270
ExaDB-D dbaascli で出来ること
oracle4engineer
PRO
0
3.8k
サイバーセキュリティと認知バイアス:対策の隙を埋める心理学的アプローチ
shumei_ito
0
380
SREによる隣接領域への越境とその先の信頼性
shonansurvivors
2
520
オープンソースAIとは何か? --「オープンソースAIの定義 v1.0」詳細解説
shujisado
7
790
Adopting Jetpack Compose in Your Existing Project - GDG DevFest Bangkok 2024
akexorcist
0
110
Featured
See All Featured
GitHub's CSS Performance
jonrohan
1030
460k
The Pragmatic Product Professional
lauravandoore
31
6.3k
Visualization
eitanlees
145
15k
Designing on Purpose - Digital PM Summit 2013
jponch
115
7k
Ruby is Unlike a Banana
tanoku
97
11k
Facilitating Awesome Meetings
lara
50
6.1k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
93
16k
Done Done
chrislema
181
16k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
44
2.2k
Code Review Best Practice
trishagee
64
17k
Build your cross-platform service in a week with App Engine
jlugia
229
18k
Automating Front-end Workflow
addyosmani
1366
200k
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をつくーる