Amazon Web Services ブログ

Category: AWS Amplify

How to: Build an engaging feed app with React and Amazon IVS

ReactとAmazon IVSを使用して魅力的な動画フィードアプリを構築する方法

はじめに ライブ動画配信は人々を魅了するコンテンツとしての新しいスタンダードになりましたが、動画の専門知識を持たない開発者はいざ配信を開始する際にしばしば苦労していると聞きます。ライブ動画の取り込み、処理、パッケージング、配信、再生を、優れたユーザーエクスペリエンスで管理することは大変な作業です。 Amazon Interactive Video Service (Amazon IVS)は視聴者の場所に関わらず、低レイテンシーのライブ動画を配信する際の複雑な技術的課題に対応できるよう設計されています。Amazon IVSを使用すると人々を魅了するようなインタラクティブな動画エクスペリエンスを作り出すことに集中できます。

Read More

Amplify Flutter の一般提供が開始されました。美しいクロスプラットフォームアプリを構築しましょう

AWS Amplify は、セキュアでスケーラブルなモバイルアプリケーションとウェブアプリケーションを構築するためのツールとサービスのセットです。現在 iOS、Android、JavaScript (ウェブおよび React Native) をサポートしている Amplify は、アマゾン ウェブ サービス (AWS) を活用するアプリケーションを構築するための最も高速で簡単な方法です。 Flutter は、ネイティブにコンパイルされたモバイル、ウェブ、およびデスクトップアプリケーションを単一のコードベースから構築するための Google の UI ツールキットで、最も急速に成長しているモバイルフレームワークの 1 つです。 AWS Amplify と Flutter を一体化する Amplify Flutter は、Flutter エコシステムに投資したものの、今は AWS の力も利用したいといったお客様のために設計されました。 2020 年 8 月、AWS は Amplify Flutter のデベロッパープレビューをローンチし、そのフィードバックを募集したところ、とても嬉しい反応をいただきました。このサービスの数か月におよぶ微調整の後、今日ようやく Amplify Flutter の一般提供を発表したいと思います。 一般提供での新しい Amplify Flutter 機能 一般提供リリースは、追加された次の 3 つの新機能によって、強力な Flutter アプリを簡単に構築できるようにします。 まず、AWS では最近、AWS […]

Read More

Amplify JavaScript が新たに Vue 3 をサポート

この記事は、Amplify JavaScript releases support for Vue 3を翻訳したものです。 本日より、Amplify JavaScript は現在対応しているVue.jsバージョン2に加え、新たにVue.jsバージョン3へ対応します。オープンソースの Amplify Librariesは、あらゆるカテゴリのクラウドを使ったオペレーションに対し、ユースケース中心の、独自のスタイルを持った、宣言型で使いやすいインターフェイスを提供し、モバイル開発者やウェブ開発者がバックエンドと簡単にやり取りできるようにしています。これらのライブラリは AWS クラウド技術に支えられており、プラグイン可能なモデルのため、他のプロバイダを利用するよう拡張することもできます。ライブラリは、Amplify CLI を使用して作成された新規バックエンドおよび既存バックエンドリソースの両方で使用可能です。Amplify UI コンポーネントは、複数のフレームワーク向け UI コンポーネント内にクラウド接続部分のワークフローをカプセル化したオープンソースの UI ツールキットです。 このチュートリアルでは、以下を実行します。 このチュートリアルのベースとして新しい Vue 3 アプリを作成 Amplify の Interactions カテゴリの基本設定をセットアップ チャットボットコンポーネントを作成して Vue 3 アプリケーションに追加 前提条件 このチュートリアルを開始する前に、 Amplify ドキュメントの ウェブサイトにアクセスし、Prerequisites (前提条件) セクションに従ってください。前提条件を完了後、このチュートリアルを実行するための準備が整います。 AWS プロファイルを設定するときは、リージョンが Amazon Lex をサポートしていることを確認してください。サポートされているリージョンは、 こちらで確認できます。 新しい Vue アプリの作成 まず、 @vue/cliを使用して新しい Vue アプリケーションを作成し、起動します。このCLIツールを使うことで、現在のベストプラクティスを適用して自動で Vue アプリケーションを作成します。次に、Amplify を追加し、新しいプロジェクトを初期化します。以下の手順で、このプロセスを説明します。 新しい […]

Read More

【開催報告&全資料まとめ&QA公開】Amplify Meetup #02

新年明けましておめでとうございます!アマゾンウェブサービスジャパン株式会社 ソリューションアーキテクトの木村公哉(@kimyan_udon2)です。私は年始早々、厳かな気持ちでこのブログを書き始めたのですが、気づけば2月に突入しておりました。皆様いかがお過ごしでしょうか? 年をまたいで2020年11月27日に「Amplify Meetup #02」を開催しました。「Amplify Meetup」はAWS AmplifyのユーザーとAWS Amplifyに興味のあるエンジニアのみなさんでLTなどを通して盛り上がるコミュニティーイベントです。タイトルに「#02」とありますように、今回は第2回目の開催となります。第1回目の盛り上がりも開催報告ブログにまとまっております。継続して開催できたのは、ひとえにご参加いただいた皆様のおかげです。皆様ありがとうございます!

Read More

Amplify CLIを使い、労力ゼロでGraphQL/REST APIやウェブホスティング用にコンテナをデプロイする

この記事は、Zero-effort Container deployment for GraphQL and REST APIs and Web Hosting with Amplify CLIを翻訳したものです。 AWS Amplifyを使うことで、最速かつ簡単に、AWSでクラウド対応のモバイルアプリケーションやウェブアプリケーションを構築することができます。Amplifyは、フロントエンドのウェブ開発者やモバイル開発者が AWSの豊富なサービス群を活用して、革新的で多機能なアプリケーションを構築できるよう、ツール類や各種サービスを一通り備えています。 本日リリースしたAmplify CLIをお使いになることで、フロントエンドのウェブ開発やモバイル開発に携わるお客様は、コンテナを使ってAPI(GraphQL/REST)をデプロイしたり、ウェブアプリケーションをホスティングできるようになります。お客様ご自身のDockerfileまたは Docker Composeを持ち込むことで、Amplify CLIは、AWS Fargateを使用してコンテナを自動的にビルド、パッケージ、デプロイします。 メリット: 移植性の高いバックエンドの構築 – Amplify CLIは、シンプルなコンテナテンプレートを用意しているためすぐに始められます。または、お客様のチームがAPIやホスティング用のコンテナを既に使用している場合は、そのコンテナを利用することができます。 コンテナのデプロイパイプラインがすぐに使えるインフラ構成 – Amplify CLIは、VPC、サブネット、NACL、IAMポリシー、およびその他のセキュリティなどのインフラを管理するため、AWSに関する事前知識やインフラの実務経験は全く必要ありません。コンテナ間のネットワーキングは自動的に処理され、ホスティングされたサイトのSSL生成も自動的に処理されます。 ビルド&デプロイパイプラインを労力をかけることなく作成 – Amplify CLIはCodePipelineを作成し、イメージをビルド、デプロイします。パイプラインには、ビルドアーティファクトやイメージに対するライフサイクルポリシーなど、コスト最適化のベストプラクティスが備わっています。ビルドしてAWSにデプロイするためにDockerをお使いのシステムにインストールする必要すらありません。 構築するもの : 初めに、乱数を返すExpressJSサーバーを構築 次に、Python/Flask乱数生成サーバーでFizzBuzzアルゴリズムを実行する、ExpressJSを構築。 前提条件: 最新のAmplify CLIをインストール ターミナルを開き、 npm install -g @aws-amplify/cli を実行し、最新のAmplify CLIに更新。 Amplify CLIの設定 Amplify CLIをまだ設定していない場合は、ドキュメントページのこちらのガイド に従ってください。 […]

Read More
AWS Amplify Admin UIのご紹介

新機能 – AWS Amplify Admin UI: アプリケーションのバックエンド開発を支援し、クラウドの経験を必要としない管理ツール

この記事は、New AWS Amplify Admin UI Helps You Develop App Backends, No Cloud Experience Requiredを翻訳したものです。 2018年にAWS Amplifyをリリースしてから、ウェブのフロントエンドとモバイルアプリケーションの開発者の開発とクラウド環境へのデプロイを支援してきました。時代の最先端を行き、顧客にイノベーションを提供するためにもプロダクトは機能を素早く届ける必要があります。しかし、クラウド、AWSの基本的な操作に慣れていない場合は、開発者・非開発者に関わらず学習やトレーニングが必要となります。この学習コストは、設計や実装、意思判断などプロセス全体の速度の低下を招きます。 本日、AWS AmplifyはチームメンバーがAWSアカウントを必要とせずにAWSの利用を可能とする新機能Admin UIをリリースしました(AWSアカウントは、最初のデプロイでのみ必要となります)。 Admin UIは、データベーステーブルのモデリング、認可認証機能の追加、アプリケーションのコンテンツ・管理者・管理者グループの管理を行うシンプルで強力なツールを提供します。また、アプリケーションのユーザーや、ユーザーによって作成されたコンテンツの管理を行う機能も提供します。Admin UIは、バックエンドやインフラストラクチャではなくデータモデルに焦点を当てています。全てのバックエンドのリソースは、チームのリポジトリで管理可能なInfrastructure as Code(IaC)のテンプレートを生成します。また、このリソースはAWS Amplifyの継続的デプロイのワークフローと統合されており、異なる環境(environment)ごとに管理が可能となっています。 新機能: AWS Amplify Admin UIを使った例のご紹介 あなたは、地元にあるレストランのウェブサイトを開発しているフロントエンド開発者であると想像してみてください。レストランのオーナーは、日替わりメニューを掲載できるようなウェブサイトで、毎日ウェブサイト上のコンテンツを簡単に更新したいと考えています。 この要求を満たすシステムの実装方法は多くあります。例えば、サーバーを構築し、CMSをインストールし、レストランのオーナーが日替わりメニューの更新を行うための機能を実装することができます。しかし、この要求を満たすためだけにサーバーを構築するのは、過剰に設備投資を行うことになります。他の実装方法として、サーバーレスのサービスを使用して自分でCMSを構築することもできますが、開発が複雑になり、より多くの時間が開発をするのに必要となります。 AWS Amplifyの新機能Admin UIを活用することで、既存のAWSのマネージドサービスを活用しながらバックエンドを素早く構築することができます。また、アプリケーションのユーザーとコンテンツの管理を行う機能も提供します。 Admin UIを利用するために、最初にAWS Console内のAWS Amplifyの管理画面にてアプリケーションのバックエンド(backend)を作成してください。これにより、AWS Amplifyはstagingと呼ばれるバックエンドの環境(environment)を作成します。バックエンドの作成が完了したら、早速Admin UIを開いてみましょう。AWSの利用経験がなく、AWSアカウントを持っていない開発者を招待したい場合は、この段階でAdmin UIへのアクセス権限を付与することができます。今回の例では、あなた一人で全ての開発を行う想定とし、管理者の追加は行わないこととします。 Admin UIでは、アプリケーションの開発者がバックエンドを構成するために必要な開発ツールと、コンテンツの管理者がアプリケーションのコンテンツを管理するための機能が含まれています。 Admin UIのサイドバー(下記の画像参照)にて、アプリケーションの設定を行うための様々なオプションを確認することができます。 レストランのウェブサイト構築を行う最初のステップとして、日替わりメニューのためのデータモデルを作成してみましょう。次の3ステップを実行してみましょう Dataタブに移動 Menuという名前でデータモデルを作成 必要なデータ項目を追加して保存とデプロイ データモデルを保存とデプロイを行うと、メニュー項目を保存するAmazon DynamoDBのテーブルやGraphQLのAPIを提供するAWS AppSyncなどのリソースがAWS上に自動で作成されます。 デプロイの完了には数分程度かかります。 モデルがデプロイされたら、次にウェブサイトのフロントエンドを構築してみましょう。今回は、AWS […]

Read More

ヘルスケア・ライフサイエンスチーム プロトタイピング: AWS Amplifyを利用したモバイルアプリ開発

ヘルスケア・ライフサイエンス ソリューション部では、お客様の課題に対してAWSの技術支援やアーキテクティングを実施しておりますが、支援の一つとしてプロトタイピングを提供しています。今回は、塩野義製薬株式会社(データサイエンス室、デジタルインテリジェンス部)、シオノギデジタルサイエンス株式会社と行った、モバイルアプリ開発のプロトタイピングを報告致します。プロトタイピングでのクイックな開発を実現するにあたり、共同でリアルタイムにコーディング可能な統合開発環境(IDE)であるAWS Cloud9と、フロントエンドの実装から、認証、AI、データ登録・参照、Amazon S3に蓄積したログの分析といったバックエンド実装までをAWS Amplifyを利用することで2日間でアプリ開発を行いました。

Read More
Amplify Meetup #01 開催!

【全資料まとめ&開催報告】Amplify Meetup #01

みなさんこんにちは!アマゾンウェブサービスジャパン株式会社 ソリューションアーキテクトの木村公哉(@kimyan_udon2)です。梅雨が明けて、気づけばお盆も明けた今日この頃ですが、皆様いかがお過ごしでしょうか? 7月31日に「Amplify Meetup #01」を開催しました。「Amplify Meetup」はAWS AmplifyのユーザーとAWS Amplifyに興味のあるエンジニアのみなさんでLTなどを通して盛り上がるコミュニティーイベントです。今回初めて開催しましたので、開催報告と合わせて「Amplify Meetupとは?」という点についてもご紹介いたします。

Read More

[AWS Black Belt Online Seminar] AWS Amplify 資料及び QA 公開

先日 (2020/05/20) 開催しました AWS Black Belt Online Seminar「AWS Amplify」の資料を公開しました。当日、参加者の皆様から頂いた QA の一部についても共有しております。 20200520 AWS Black Belt Online Seminar AWS Amplify from Amazon Web Services Japan AWS クラウドサービス活用資料集(すべての過去資料が閲覧できます) Q1. AWS Amplify で使う「カテゴリ」はどのような単位で使うものですか?イメージがわかないので具体例を教えてください。 A. Amplify のカテゴリはユースケース単位でアプリケーションに機能を追加することができます。 Amplify カテゴリの例: REST API や GraphQL の API 基盤を構築する API カテゴリ 画像認識やテキスト翻訳などの機械学習の機能を提供する Predictions カテゴリ グインや各カテゴリに認証機能を提供する Authentication カテゴリ アプリケーションに Amplify の機能を追加するには、Amplify CLI からカテゴリを追加し、バックエンドを構築します。例えば、Amplify […]

Read More

【開催報告】ビルシリーズ@住友不動産六本木グランドタワー 第1回

みなさんこんにちは!アマゾンウェブサービスジャパン株式会社 ソリューションアーキテクトの木村公哉です。 11月21日に「ビルシリーズ@六本木一丁目住友不動産六本木グランドタワー 第1回」を開催いたしました。今回は「初めてのサーバレスWebアプリケーションハンズオン」を実施しました。こちら「ビルシリーズとは?」とお思いの方も多いかと思いますので、開催報告と合わせてご説明いたします。 「ビルシリーズ」とは? このイベントは、日頃AWSをご利用いただいているお客様に、AWSからの情報発信はもちろん、同じビルに拠点を構えるお客様同士の活発な意見交換と交流の場を定期的に作ることを目的としたものです(同じビルなので移動が楽!)。 今回、住友不動産六本木グランドタワーのFringe81様、BASE様、エブリー様、ディップ様で同じようなニーズがあり、このようなビル単位でのイベントを開催する運びとなりました。場所はFringe81様の素敵な大会場をお借りいたしました。Fringe81様ありがとうございました。 来月には住友不動産麻布十番ビルでも開催を予定しており、今後もこのようなビル単位で交流ができるようなイベントを開催していきたいと考えております。 当日の様子 当日は約40人のお客様にお越しいただき、イベントは終始盛り上がりを見せておりました。   まずはAWSJ 植本より、今回のビルシリーズの趣旨などを説明いたしました。   次に、AWSJ 木村より「サーバレスのご紹介 – ユースケースパターンを切り口に」というタイトルで、AWSのサーバレスプラットフォームについてご紹介いたしました。   続けてAWSJ 木村より「初めてのWebアプリケーションハンズオン」を実施いたしました。   ハンズオンの終了後、ご参加いただいた皆様と共に、簡単な懇親会を開催いたしました。   今回、AWSJより、アカウントマネージャー植本、藤田、細木、ソリューションアーキテクト上原、石見、小宮、木村がビルシリーズをサポートいたしました。こちらはソリューションアーキテクトの集合写真です。 貴社担当のアカウントマネージャから「ビルシリーズ」のお誘いがあるかもしれませんが、是非ご検討いただければと思います。それでは、次回のビルシリーズでお会いしましょう!   著者について 木村 公哉(Kimura, Koya) 香川県出身のソリューションアーキテクトです。好きなサービスはAWS AmplifyとAWS Lambda、Amazon Kinesisです。好きな食べ物はうどんです。   上原 誠(Uehara, Makoto) アマゾンウェブサービスジャパン株式会社のソリューションアーキテクトとして、主にメディア系のお客様に対する技術支援を担当。技術的な得意/興味領域としては、アナリティクス系テクノロジー、広告系ソリューションなど。

Read More