アフリカに広がるサービスをすばやくApp Runnerで本番構築

Transcript

1. 2023©Degas Ltd.
   May 2023 / App Runner Night !!
   During harvesting, by Degas farmers
   アフリカに広がるサービスを
   すばやくApp Runnerで本番構築
   

   View Slide

2. 登壇者
   1998 年に独立。紆余曲折を経て2018年に AWS に入
   社。退職後再び個人事業主として独立。
   クラウドインフラストラクチャの構築から
   バックエンド、フロントエンドやデザインまで
   いろいろ興味がある赤魔導士タイプ
   現在はフロントエンドエンジニアとしての
   活動がメイン
   Degas株式会社には 3月から参加
   フロントエンドやAPI設計を担当
   原 一浩 (Kazuhiro Hara)
   

   View Slide

3. 本日の構成
   

   View Slide

4. Degas について
   1
   本日の構成
   DegasではApp Runnerを利用して数週間と短期間で本番運用環境を構築しました。
   アフリカから特殊なアクセスを捌くグローバルサービスをどのように構築したのかについて
   App Runnerの所感と共に発表します
   特殊なアクセス環境とApp Runner 導入概要
   2
   3 フロントエンジニア観点でのApp Runner 対応
   4 まとめ
   

   View Slide

5. Strictly confidential
   2021 © Degas Ltd.
   Strictly confidential
   2021 © Degas Ltd.
   アフリカの6億人の零細農家の生産性を向上させ、
   所得の大幅な改善を目指す
   地球温暖化の影響を最も大きく受けるアフリカで、
   カーボンクレジットの創出を通じて
   ネットゼロ社会の実現に貢献
   

   View Slide

6. +100
   About Degas
   最先端のテクノロジーをアフリカ農家に
   Data collection：Degas App
   Visualization platform：Degas Metrics
   +6
   Data Analysis：Degas Credit Score
   Field scoring Recovery
   Satellite
   Observation
   AI credit-scoring model
   

   View Slide

7. ガーナってどこ?
   ・
   

   View Slide

8. 特殊なアクセス環境と導入概要
   

   View Slide

9. 特殊なアクセス環境に対応するために
   • インターネットが通じていないエリアが多い
   • Androidでデータを収集して、
   インターネット環境に応じて非同期にDB更新
   • 現在 App Runner が対応している
   リージョンのうち地理的に近い
   アイルランドを選択
   

   View Slide

10. Degas App の概略と App Runner 導入箇所
    • Webの管理画面とAPIサーバを
    App Runner で構築
    • 農業データは
    アプリで収集
    • Webは Next.js で
    構築
    AWS Cloud
    API Server
    SageMaker
    Android
    Web
    Manager
    Agent
    S3
    RDS
    Amazon CloudWatch
    CloudFront Web Admin
    Services
    Etc…
    

    View Slide

11. FE 観点での App Runner 対応
    

    View Slide

12. Next.js の利用スタイル
    • 今回は Next.js をBFF的なバックエンドと
    Web UIなフロントエンドという構成で利用している
    • バックエンドでしか使わない環境変数と
    フロントエンドでしか使わない環境変数がある
    • App Runner でつかう Docker イメージは
    GitHub Actions 経由で Amazon ECR に保存している
    

    View Slide

13. 環境変数の読み込みの分離
    • Next.js は、バックエンドとフロントエンドで
    環境変数を読み込む方法がかわる
    • バックエンドは App Runner にて Secret Manager 経由で
    環境変数を設定
    • フロントエンドは GitHub Actions でビルド時に
    secrets より NEXT_PUBLIC_XXX を設定
    

    View Slide

14. Next.js ですぐにApp Runner 使いたい方へ
    • Next.js は with-docker というサンプルで Dockerfile の
    ひな型を取得できる
    • $ npx create-next-app --example with-docker nextjs-docker
    • ある程度 Dockerfile が整ったらコンテナベースに移行できる
    

    View Slide

15. その他、気に入っているところ
    

    View Slide

16. 状況に応じてサービスの立ち上げを選びやすい
    • まずはソースコードから App Runner サービスを作成
    • 初期はソースコードからサービスを作り、
    後々コンテナイメージ化というプロセスも使える
    • リソースを削除することなく設定変更が可能なのは助かる
    

    View Slide

17. まとめ
    

    View Slide

18. まとめ (1)
    • App Runner はソースコードからもコンテナリポジトリから
    もサービスを立ち上げることができて便利
    • 各種AWSサービスと連携できる
    • でもアプリケーションの性質によっては工夫が必要
    

    View Slide

19. まとめ (2)
    • ビルドタイムの環境変数の
    Secret Manager サポートも
    Roadmap にはある
    • https://github.com/aws/
    apprunner-roadmap/issues/48
    • 一緒に働けるエンジニアを募集してます！
    

    View Slide

20. Strictly confidential
    2021 © Degas Ltd.
    Strictly confidential
    2021 © Degas Ltd.
    ご清聴ありがとうございました！
    App Runner で素早くサービスを立ち上げて、
    海の向こうへもサービスを届けよう！
    

    View Slide