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
240
ガチマナ会 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
120
高専で制御を、大学でセンシングを学び、次は脳みそ
satoshirobatofujimoto
0
290
画像生成AIを使って勝負しよう
satoshirobatofujimoto
1
140
画像生成AIを使って勝負しよう
satoshirobatofujimoto
0
270
画像からプロンプトを考えて最も似ている画像を生成した人が勝ちのゲーム@AIミーティング
satoshirobatofujimoto
0
180
VPS研究者が語る”VPS概論”
satoshirobatofujimoto
0
440
画像からプロンプトを考えて最も似ている画像を生成した人が勝ちのゲーム
satoshirobatofujimoto
0
230
OpenAI 新機能まとめ(Function callingとAdd your data編)
satoshirobatofujimoto
0
290
PLATEAUを用いた熊本市中心市街地におけるバリアフリー情報の可視化
satoshirobatofujimoto
0
1.1k
Other Decks in Technology
See All in Technology
プレイドのユニークな技術とインターンのリアル
plaidtech
PRO
1
300
あなたの知らない Linuxカーネル脆弱性の世界
recruitengineers
PRO
3
150
Kubernetes self-healing of your workload
hwchiu
0
440
NLPコロキウム20251022_超効率化への挑戦: LLM 1bit量子化のロードマップ
yumaichikawa
2
370
ViteとTypeScriptのProject Referencesで 大規模モノレポのUIカタログのリリースサイクルを高速化する
shuta13
3
180
現場データから見える、開発生産性の変化コード生成AI導入・運用のリアル〜 / Changes in Development Productivity and Operational Challenges Following the Introduction of Code Generation AI
nttcom
1
460
SCONE - 動画配信の帯域を最適化する新プロトコル
kazuho
1
320
Biz職でもDifyでできる! 「触らないAIワークフロー」を実現する方法
igarashikana
7
3.1k
Data Hubグループ 紹介資料
sansan33
PRO
0
2.2k
コンパウンド組織のCRE #cre_meetup
layerx
PRO
1
250
知覚とデザイン
rinchoku
1
480
スタートアップの現場で実践しているテストマネジメント #jasst_kyushu
makky_tyuyan
0
110
Featured
See All Featured
Java REST API Framework Comparison - PWX 2021
mraible
34
8.9k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
48
9.7k
Site-Speed That Sticks
csswizardry
13
920
Practical Orchestrator
shlominoach
190
11k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.5k
Optimizing for Happiness
mojombo
379
70k
VelocityConf: Rendering Performance Case Studies
addyosmani
333
24k
Balancing Empowerment & Direction
lara
5
700
Embracing the Ebb and Flow
colly
88
4.9k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.5k
Making the Leap to Tech Lead
cromwellryan
135
9.6k
A better future with KSS
kneath
239
18k
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をつくーる