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
今から始める Amplify Studio #stapy
Search
Kihara, Takuya
September 22, 2022
Technology
0
660
今から始める Amplify Studio #stapy
みんなのPython勉強会#85 での発表内容です。
Amplify Studio + Figma でコンポーネントを作成し、 Python で作成したグラフを表示する、という流れを説明しています。
Kihara, Takuya
September 22, 2022
Tweet
Share
More Decks by Kihara, Takuya
See All by Kihara, Takuya
AWS Amplify Gen 2 GA記念 ~Gen1との違いを確認
tacck
0
31
Amplify Gen2 が GA したよ! #jawsug_sapporo #jawsug
tacck
0
140
Flutter で "Hello World!! #ゆるWeb札幌
tacck
0
100
AWS Lambda で LLRT を動かしてみた #北海道まったりLT大会
tacck
0
94
地方から始める登壇のステップアップ 〜Java Do から JJUG CCC への登壇参加記録 #javado
tacck
0
140
ゆるWebの新型コロナ Before/After とこれからのこと #seb_yearend
tacck
0
35
AWS Amplify と Amazon Bedrock を使ってオレオレ生成AIサイトを作る #ゆるWeb札幌
tacck
0
220
「普通」のエンジニアとしての生存戦略〜または、いかにして技術を楽しむか。 #情報メディア入門
tacck
0
90
噂の Amazon Bedrock を Java から使ってみる #javado
tacck
1
350
Other Decks in Technology
See All in Technology
ABEMAにおけるLLMを用いたコンテンツベース推薦システム導入と効果検証
cyberagentdevelopers
PRO
1
720
可視化プラットフォームGrafanaの基本と活用方法の全て
hamadakoji
0
230
Azure AI ことはじめ
tsubakimoto_s
0
130
ギークの理想が7つ集まるエムスリーで夢を叶えよう - エムスリー株式会社
m3_engineering
1
260
「単なる OAuth 2.0 を認証に使うと、車が通れるほどのどでかいセキュリティー・ホールができる」のか検証してみた
terara
0
380
年間一億円削減した時系列データベースのアーキテクチャ改善~不確実性の高いプロジェクトへの挑戦~
lycorptech_jp
PRO
3
2.9k
データ分析基盤を作ってみよう~設計編~
nrinetcom
PRO
1
110
プレイドにおけるDatadog APMの活用方法
plaidtech
PRO
2
120
Classmethod流のPlatform Engineering / classmethod-platform-engineering-devio2024
tomoki10
0
470
サービス開発を前に進めるために 新米リードエンジニアが 取り組んだこと / Steps Taken by a Novice Lead Engineer to Advance Service Development
nologyance
0
180
運用改善、不都合な真実 / 20240722-ssmjp-kaizen
opelab
17
8k
AIアシスタントの活用で品質の向上と開発ワークフローのスピードアップ
nagix
1
200
Featured
See All Featured
Stop Working from a Prison Cell
hatefulcrawdad
266
20k
A better future with KSS
kneath
231
17k
StorybookのUI Testing Handbookを読んだ
zakiyama
15
4.9k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
35
6.3k
Robots, Beer and Maslow
schacon
PRO
157
8.1k
The Invisible Side of Design
smashingmag
294
50k
Building Flexible Design Systems
yeseniaperezcruz
323
37k
Clear Off the Table
cherdarchuk
89
320k
What’s in a name? Adding method to the madness
productmarketing
PRO
21
2.9k
Happy Clients
brianwarren
94
6.5k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
12
3.8k
Leading Effective Engineering Teams 2024
addyosmani
3
300
Transcript
今から始める Amplify Studio みんなのPython 勉強会#85 2022/09/22 木原卓也 / @tacck 1
みんなのPython勉強会#85 / #stapy
私 • 名前 • 木原 卓也 / @tacck • 所属
• 生活共同組合コープさっぽろ • 主催コミュニティ • ゆるWeb勉強会@札幌 • スマートスピーカーで遊ぼう会@札幌 (休眠中) • 参加コミュニティ • Amplify Japan User Group 運営 • AWS Community Builders Program (Q2 2021, 2022) Category: Front-end Web and Mobile • 好きなフィギュアスケートの技 • スプレッド・イーグル 2 みんなのPython勉強会#85 / #stapy
このお話のゴール • Amplify Studio + Figma でパーツを作って、 Python で書いたグラフを表示してみよう。 3
みんなのPython勉強会#85 / #stapy
お品書き • AWS Amplify • AWS Amplify って何? • AWS
Amplify の大まかな分類 • Amplify Studio • Amplify Studio って何? • Amplify Studio でできること • Python で書いたグラフを表示してみよう 4 みんなのPython勉強会#85 / #stapy
AWS Amplify って何? Webフロントエンド/モバイルアプリ開発を中心に、 フルスタックのアプリ・システム構築を素早く簡単にできるようにする、 AWS のサービスとツールの総称。 特に、 Cognito /
AppSync / DynamoDB などの マネージドサービスの利用を簡単に行うことができ、 いわゆる「サーバレス」なフルスタックシステムを構築しやすい。 また、Webサイトのホスティング機能も用意されており、 個別の S3 / CloudFront 設定無しにサイト公開を行うことが可能。 5 みんなのPython勉強会#85 / #stapy Amplify Console Amplify Hosting Amplify Studio Amplify CLI Amplify Library Amplify UI UI Component
AWS Amplify の大まかな分類 6 みんなのPython勉強会#85 / #stapy AWS サービスとしての Amplify
OSS ツールとしての Amplify Cognito Dynamo DB AppSync React Vue Flutter ... ... Amplify Console Amplify Hosting Amplify Studio Amplify CLI Amplify Library Amplify UI UI Component
みんなのPython勉強会#85 / #stapy 7 AWS Amplify 各機能相関(概要)
Amplify Studio って何? ブラウザの操作で、フロントエンド UI とバックエンドの 構築を (ある程度) 可能にする機能。 (Preview:
2021-12-03 / GA: 2022-04-21) 現在可能なこと: • 認証 (Cognito) の有効化 • Storage (S3) の有効化、ファイル配置 • データモデル (AppSync+DynamoDB) の有効化、データ作成 • フロントエンド UI 作成 (Figmaからのインポート) • React のコードとして連携可能 8 みんなのPython勉強会#85 / #stapy
Amplify Studio でできること • アプリケーションの管理機能の一部を実現 • 簡易なユーザー管理画面(Amplify Studio自身) [Cognito] •
格納しているデータ操作 [DynamoDB] • 静的ファイルの操作 [S3] • 画面のパーツ(UI Components)をコード化 • Figma で作成した Component を取り込み • 取り込んだ Component とデータ(DynamoDB)をバインディング • React のプロジェクトにコードとして取り込み・即利用 9 みんなのPython勉強会#85 / #stapy
[参考]Amplify Studio でできること Amplify CLI Amplify Studio Amplify CLI +
CDK リソース作成 ◦ ◦ ◦ リソース設定変更 ◦ △ ◎ リソース削除 ◦ ◦ ◦ データ操作 × ◎ △ Figma連携 × ◎ × 10 みんなのPython勉強会#85 / #stapy
Python で書いたグラフを 表示してみよう 11 みんなのPython勉強会#85 / #stapy
Python で書いたグラフを 表示してみよう • Figma でグラフ表示のためのパーツを作成 • React へ取り込んでページ作成 •
Lambda の Python 実行環境でグラフ生成コード作成 • ページで確認 12 みんなのPython勉強会#85 / #stapy
まとめ • Amplify Studio + Figma で 使いたいパーツを手軽に作れる! 個人的感想: •
データ処理してグラフを作りたいときは、 Pythonを使うのも便利そう。 13 みんなのPython勉強会#85 / #stapy
宣伝1: JAWS DAYS 2022 プレイベント • 2022-09-25 14:00〜17:25 • 今回お話した内容を
改めてお話します。 14 みんなのPython勉強会#85 / #stapy https://jaws-ug.doorkeeper.jp/events/142615
宣伝2: AWS APAC Community Summit 2022 -re:Port Back- • 2022-10-17
18:50〜22:00 • タイで行われたイベント の報告会です。 15 みんなのPython勉強会#85 / #stapy https://jaws-ug.doorkeeper.jp/events/142954
終 16 みんなのPython勉強会#85 / #stapy