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
AWS AppSync を利用したアプリ開発チーム視点の API 開発
Search
yuki.sugi
November 04, 2022
Programming
0
710
AWS AppSync を利用したアプリ開発チーム視点の API 開発
2022/ 10/ 27【 Android祭り 】Android開発のここが好き!Androidへの「愛」を語る会の発表資料です。
yuki.sugi
November 04, 2022
Tweet
Share
Other Decks in Programming
See All in Programming
AHC051解法紹介
eijirou
0
560
CEDEC 2025 『ゲームにおけるリアルタイム通信への QUIC導入事例の紹介』
segadevtech
3
880
The State of Fluid (2025)
s2b
0
170
tool ディレクティブを導入してみた感想
sgash708
1
100
コーディングは技術者(エンジニア)の嗜みでして / Learning the System Development Mindset from Rock Lady
mackey0225
2
490
What's new in Adaptive Android development
fornewid
0
140
kiroでゲームを作ってみた
iriikeita
0
170
Claude Code と OpenAI o3 で メタデータ情報を作る
laket
0
130
一人でAIプロダクトを作るための工夫 〜技術選定・開発プロセス編〜 / I want AI to work harder
rkaga
12
2.6k
Infer入門
riru
4
1.5k
QA x AIエコシステム段階構築作戦
osu
0
270
Scale out your Claude Code ~自社専用Agentで10xする開発プロセス~
yukukotani
9
2.2k
Featured
See All Featured
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Mobile First: as difficult as doing things right
swwweet
223
9.9k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.8k
Measuring & Analyzing Core Web Vitals
bluesmoon
8
560
Designing for humans not robots
tammielis
253
25k
Writing Fast Ruby
sferik
628
62k
Unsuck your backbone
ammeep
671
58k
Thoughts on Productivity
jonyablonski
69
4.8k
Balancing Empowerment & Direction
lara
2
570
Product Roadmaps are Hard
iamctodd
PRO
54
11k
The Language of Interfaces
destraynor
159
25k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Transcript
マナビ、アップデート 株式会社レアジョブテクノロジーズ RareJob Technologies, Inc. 1
登壇者自己紹介 株式会社レアジョブテクノロジーズ Androidエンジニア 杉山 裕紀 (Yuki Sugiyama) 新卒1年目からネイティブアプリ開発を始め、約 8年間アプリ開発に携わ る。業務ツール、ソシャゲ、プリインストール、クレジットカード、漫画系など 様々な案件を担当し、ユーザーの役に立つアプリを作りたいという想いか
ら2018年よりレアジョブにジョイン。 現在はネイティブアプリの開発・運用に関わる。 2 写真
レアジョブグループ ビジョン 3
レアジョブテクノロジーズ ミッション 4
サービス説明 5
AIスピーキングテスト「PROGOS」 6
実現したい世界のイメージ 7
AWS AppSync を利用したアプリ開発チーム視点の API 開発 8
本日の流れ 9 1. AppSync, DynamoDB とは 2. アプリに AppSync を組み込む方法
3. 弊社アプリで AppSync を使っているポイント 4. AppSync を利用することによるメリット・デメリット
AppSync, DynamoDB とは 10
AppSync とは 11 • ウェブおよびモバイルアプリケーションの構築を簡素化するサーバーレス GraphQL API サービス •
AWS AppSync GraphQL API ◦ API から安全にデータをクエリまたは更新するための単一エンドポイントを提供することで、アプリケーション開発を簡 素化 • 今回利用した理由 ◦ アプリチームで施策を生み出し、リリースまで行う際に、比較的容易に API 化できるサービスを探しており、求めてい た内容とマッチした為、選択しました。
DynamoDB とは 12 • ハイパフォーマンスなアプリケーションをあらゆる規模で実行するために設計された、フルマネージド でサーバーレスの key-value NoSQL データベース
• 今回利用した理由 ◦ 過去に利用経験があり、AppSync と同じ AWS サービスの一つでもある為、連携面も重視して 選択しました。
アプリに AppSync を組み込む方法 13
今回やることのイメージ図 14
準備 15 • 新規 Android Project • AWS アカウント •
DynamoDB - テーブル • AppSync - API
プラグインの追加と依存関係の宣言 16 • build.Gradle(:app)にプラグインを追加する。 ◦ apply plugin: 'com.amazonaws.appsync' • 同ファイルに、依存関係にあるライブラリを宣言する。
◦ implementation 'com.amazonaws:aws-android-sdk-core:*.*.*' ◦ implementation 'com.amazonaws:aws-android-sdk-appsync:*.*.*'
クラスパスとリポジトリ利用の設定 17 • build.gradle([プロジェクト名])内の dependencies ブロックに以下のクラスパス を追記する。 ◦ classpath 'com.amazonaws:aws-android-sdk-appsync-gradle-plugin:*.*.*'
• buildscript 内の repositories ブロックに以下の内容を追記する。 ◦ maven { url "https://plugins.gradle.org/m2/" }
AppSync API の作成, DynamoDB のテーブル作成 18 • AppSync サービスにて、API を作成する。
◦ API 作成の際に、カスタマイズパターン、サンプルプロジェクトパターンの選 択ができる為、任意のパターンを選択し API を作成 • DynamoDB サービスにて、テーブルを作成する。 ◦ 任意のテーブル名、パーティションキー、ソートキーを設定
データソースの設定 19 • 統合する API のデータソース画面の「データソースを作成」をクリック • データソース名入力、タイプ、リージョンを指定し、作成したテーブルを選択 • 作成ボタンをクリックし、データソースの作成完了
スキーマの設定 20 • 統合する API のスキーマ画面にて、クエリ、ミューテーションを記述 • 記述したクエリ、ミューテーションをアタッチし、リゾルバー を作成 •
データソースの設定、リクエストマッピングテンプレート 、レスポンスマッピングテ ンプレートを記述して「リゾルバ を保存」ボタンをクリック * スキーマで設定した内容の結果は、統合する API のクエリ画面で確認可能です。
アプリと統合する為、各種ファイルを配置 21 • 設定ファイルを配置 ◦ API トップ画面に存在する「設定をダウンロード」ボタンをクリック ◦ アプリプロジェクトの res
ディレクトリ内に raw ファイルを作成 ◦ raw ファイルにダウンロードした設定ファイルを配置 • スキーマファイルを配置 ◦ 統合する API のスキーマ画面を表示し「スキーマをエクスポート」をクリック ◦ schema.graphql を選択 ◦ アプリプロジェクトのルートディレクトリに schema.graphql を配置
コマンドを実行 22 • 以下のコマンドを実行し、アプリで使用できるコードファイルを生成 ◦ amplify add codegen --apiId [ID]
コードを書いて連携しているかチェック① 23 • 初期設定を行う ◦ AWSAppSyncClient.builder() で AppSyncClient の情報を作成 credentials
の設定を行いたい場合は、ここで CognitoCachingCredentialsProvider を設 定してみるのもありです。
コードを書いて連携しているかチェック② 24 • Query を試してみる ◦ 以下のサンプルコードのように書いてみる。 appSyncClient.query([指定するクエリ ]()) .responseFetcher(AppSyncResponseFetchers.CACHE_AND_NETWORK)
.enqueue(testQueryCallback) private val testQueryCallback = object : GraphQLCall.Callback<[指定するクエリ ].Data>() { override fun onResponse(response: Response<[指定するクエリ ].Data>) { // 指定したクエリのレスポンスを確認できます。 } override fun onFailure(e: ApolloException) { Log.e("ERROR", e.toString()) } }
コードを書いて連携しているかチェック③ 25 • Mutation を試してみる ◦ 以下のサンプルコードのように書いてみる。 appSyncClient.mutate([指定するミューテーション ].build()) .enqueue(testMutationCallback)
private val testMutationCallback = object : GraphQLCall.Callback<[指定するミューテーション ].Data>() { override fun onResponse(response: Response<[指定するミューテーション ].Data>) { // ミューテーションの結果を確認できます。 } override fun onFailure(e: ApolloException) { Log.e("ERROR", e.toString()) } }
Query, Mutation の動作結果を確認する 26 • Query の動作結果確認方法 ◦ リクエスト処理をした後に、指定したコールバックに値が返ってくる。 ◦
処理の流れ上、成功の場合: onResponse, 失敗の場合: onFailure に入ってくるので、こ こで結果が得られたら動作はしており成功となる。 • Mutation の動作結果確認方法 ◦ レスポンスの確認までは Query と同じ。 ◦ ただし、本当にデータベースへ保存されているかアプリ上からは確認できない為、データ ソースに設定したテーブルを確認する必要がございます。 ◦ 該当テーブル内に Mutation で送った登録したい値が保存されていれば動作成功
弊社アプリで AppSync を使っているポイント 27
弊社のアプリで利用しているポイント 28 ソロトレーニング機能 こちらの機能のカテゴリ情報、トピック情報、学習内容情 報などを DynamoDB のテーブルに入れており必要に 応じて情報を取り出しております。 また、学習トピックの理解度を API
のミューテーションを 使い保存しております。
AppSync を利用することによるメリット・デメリット 29
メリット 30 • プロジェクトのスケジュール管理を行いやすくなる • 柔軟性が上がる • ナレッジが溜まる
デメリット 31 • コストがかかる
積極採用中〜EdTech No.1へ〜 UI/UXデザイナー MLエンジニア スマホアプリ インフラ サーバサイド フロントエンド オープン PdM
システム ディレクター 32