投稿日: Apr 21, 2022

本日、AWS は AWS Amplify Studio Figma-to-React コード機能の一般提供を発表し、フロントエンドデベロッパーにフルスタックのアプリケーションを構築するためのより高速なワークフローを提供します。これらの新機能は、既存の Amplify Studio のバックエンド作成・管理機能に加え、デベロッパーの UI 開発のスピードアップに役立ちます。一般的に、フロントエンドデベロッパーとデザイナーの間で多くのやり取りが行われ、納期に間に合わせるために妥協した結果、最適とは言えないエンドユーザーエクスペリエンスがもたらされることがあります。Amplify Studio を使用すると、Figma からインポートし、コードにエクスポート、カスタムロジックを使用してコードを拡張することと同じくらい簡単に、設計どおりに UI を開発できます。

Amplify Studio は、Figma のデザインを使用して、数クリックでバックエンドに配線できるピクセルパーフェクトな React コンポーネントを自動的に生成します。Figma-to-React 機能は re:Invent 2021 のプレビューでリリースされ、その後、双方向性、コード内の子 UI 要素を変更するための強化されたエクスペリエンス、および新しいテーマ機能などの新機能が追加されました。

Amplify Studio コンポーネントエディターでは、デベロッパーが、フォームからバックエンドへのデータの保存や URL への移動などのナビゲーションアクションなど、UI コンポーネントに双方向性を追加できるようになりました。生成されたコンポーネントは、React デベロッパーなら誰でも知っているもので、コンポーネントのプロパティ、要素のスタイル設定、およびイベントハンドラーを変更するメカニズムにより、手書きのコンポーネントと同じ柔軟性を提供します。これらのコンポーネントはすべて、アクセシビリティのベストプラクティスに従っており、Figma プラグインを使用してテーマを設定し、ブランドのルックアンドフィールに数分でマッチさせることもできます。

Amplify Studio の UI 開発機能は、17 の AWS リージョンで一般に利用可能です:米国東部 (オハイオ)、米国東部 (バージニア北部)、米国西部 (北カリフォルニア)、米国西部 (オレゴン)、アジアパシフィック (ムンバイ)、アジアパシフィック (ソウル)、アジアパシフィック (シンガポール)、アジアパシフィック (シドニー)、アジアパシフィック (東京)、カナダ (中部)、欧州 (フランクフルト)、欧州 (アイルランド)、欧州 (ロンドン)、欧州 (パリ)、欧州 (ストックホルム)、中東 (バーレーン) 、南米 (サンパウロ)

Amplify Studio の最新機能をスタートするために、AWS News ブログ をご確認ください。