はてなブックマーク

AWS AppSync は Serverless Framework とどのように連携するのか？ Serverless Framework は、AWS AppSync の使用を簡単に開始できる AWS AppSync コンポーネント及びプラグインを提供しています。これらのモジュールは、利用可能なすべてのデータソースと認証方法をサポートすると同時に、AWS AppSync を使用する際に優れたコンポーネントを提供します。 また、AWS AppSync で管理される多くの API はデータソースとして AWS Lambda に依存しているケースが多いため、Serverless Framework の提供する各種機能（設計、デプロイ、モニタリング、デバッグ）を使用することで、Lambda 関数作成の複雑な点を省略し、実装コストを削減することができます。 AWS AppSync を使用する利点 フ

スタートアップCTOが解説するECS Fargateのユースケース＆Lambdaの使い分け！😎AWSのサーバーレスコンピューティングを使いこなしましょう🐕 こんにちは！ AWSサーバーレスによる開発を検討されている方は、FargateとLambdaの使い分け方法について一度は悩まれたことがあるかと思います。それぞれ実現できることに大きな差はないですが、サーバーレス開発者から言えば、インフラにおける制約、コストメリットにおいて差があるため、慎重に使い分けを検討する必要があります。 フルマネージドなサーバーレス製品だけど用途が異なる、Fargate と Lambda のユースケースについて、本記事では解説します。ぜひ参考にしていただき、サーバーレスアーキテクチャを組む判断材料としてもらえたら嬉しいです！ 想定する読者 Fargate と Lambda のユースケースを理解したいヒトFarg

Vue3で保守性の高いテストコード作成方法を解説！Vue3エンジニアが実装とテストの疎結合実装方法を解説！ こんにちは！ 今回は Vue3 でのコンポーネントのテストコードの作成方法を紹介します！ テストコードを書くことでチーム開発はもちろん、個人開発においてもコードをリファクタリングしたり、バグを発見したりする際に重要な役割を果たします。 Vue3 から新たに登場した Compostion API を利用することで、より保守性の高いコンポーネントを定義することができます。 コンポーネントをテストする場合、一般的にはテストコードを実装からできる限り切り離すように作成します。 理想的なのはコンポーネント内のロジックなどを考慮せずに実施するブラックボックス的なテストを書くことです。 はじめに 本記事では Vue3 でのテストコードの作成方法について解説しております。 Vue2 では Vue.e

こんにちは！ AppSync ではいくつかの認証方式がありますが、中でも Cognito ユーザープールを利用されるケースは多いかと思います。 今回はスキーマに @auth を記述することで細かいアクセス制御を実装・検証します。ぜひ最後までお読みください！ 想定する読者 AppSync の認証をコントロールしたいヒトAppSync の認証方式に Cognito ユーザープールを採用しているヒトAppSync に興味があるエンジニア はじめに そもそも@authとは？ @auth とは、API の認可をトップレベルで行うことができるディレクティブです。これを利用することで、細かなアクセスを実現することができます。具体的にはルールを定義することで、API のアクションに対する制限が可能になります。 今回は Amplify CLI を利用して、 Todo テンプレートを作成したものをいじりながら

import { defineComponent, ref } from 'vue' export default defineComponent({ setup() { // data const name = ref('John'); // methods const doIt = () => console.log(`Hello ${name.value}`); // mounted onMounted(() => { doIt(); }); return { name }; } }); 実装上での大きな変更点はこちらでも挙げられている通り、以下になります。 data, computed, method 等の Vue 機能は全て setup 関数に定義ライフサイクルのフックは setup 関数に定義リアクティブ(変更検知)したい値は全て ref で指定必須暗黙的に動作していた部分を全

DynamoDB VS ElasticSearch！🤔データアクセス思考なDBMS使い分けの思考方法を解説します！😎 こんにちは！ 最近のAWSサーバーレス開発プロジェクトでは、DynamoDB・ElasticSearch の組み合わせがデファクトスタンダートになってきています。うまく設計できれば、RDBMS よりも遥かにハイパフォーマンスで可用性の高い DBMS を構築が可能です。 しかし現場から時折「 DynamoDB設計は理解できたけど、ElasticSearch との使い分けに悩む 」といった声が挙がってきます。実際、ElasticSearch の導入は実装・費用面でコスト高になりやすい傾向にあるので、DyanamoDB の設計後に行うプロジェクトが多いですよね。 本記事では、DynamoDB の設計・実装経験のある方向けに、ElasticSearch との使い分け思考方法を解

Vueが2021年時点で最も優れたフレームワークだと感じる理由をVue/Reactエンジニアがまとめます！技術選定を悩んでいるなら必見です こんにちは！ 社内で新しいサービスを開発する際や、既存サービスのフロントエンドの改修などで JS フレームワークの選定について調査・検討する場面があるかと思います。 数年前までは Vue / React / Angular の3つが代表的になってましたが、最近では参考文献・コミュニティの活発さなどから考えて Vue / Reactの2強になりつつあります。 中でもわたしたちは VueJS が2021年時点で最も優れたフレームワークだと考えており、今回は Vue のどのような点が優れているか解説したいと思います！ はじめに 本記事では VueJS を選ぶメリットなどについてまとめており、 ReactJS や Svelte などの他のフレームワークの特徴に

スタートアップCTOがVue3とVue2の違い・Vue3の注目機能を分かりやすくまとめ🙌！Vue3の導入を悩んでいるなら必見です👀 こんにちは！ わたしたちは数多くのプロジェクトに Vue3 を導入してきましたが、保守性・パフォーマンスともに本当に魅力的なフレームワークだなといつも感じています。特にNuxt3が登場してから、ますます幅広い利用が可能なフレームワークとなりました。 本記事では、今流行りの Vue3 の注目機能＆ Vue2.x との違いについて、実際の経験談を交え詳しく解説いたします。導入を悩んでいる方は、ぜひ本記事を参考にしてください。 想定する読者 Vue3 の導入を検討しているプロジェクトマネージャーVue3 の導入を検討しているテックリードエンジニアVue3 の新規プロジェクトに参画予定のエンジニア はじめに NuxtJS の Vue3 対応について Nuxt3にて

service: ApiGatewayWithAuthorization provider: name: aws runtime: nodejs12.x stage: ${opt:stage,"dev"} region: ap-northeast-1 profile: ragate iamRoleStatements: - Effect: 'Allow' Action: - 'lambda:*' - 'cognito:*' - 'apigateway:*' Resource: - '*' plugins: - serverless-webpack custom: webpack: includeModules: true packager: 'npm' functions: ${file(./resources/functions.yml)} resources: - ${file(./r

こんにちは！ 今回は、S3 バケットのアクセス制限について解説していきます！要件によってはユーザーによって公開する情報の範囲が異なるかと思います。そんなときにこちらを参考にしていただければ幸いです！ 想定する読者 S3 バケットのアクセス制限をしたいヒトAWS のアクセス制限について知りたいヒト はじめに S3 バケットのアクセス制限には IAM を利用いたします。 本記事では、バケット単位のみならずオブジェクト単位でのアクセス制限に関する情報なども提供いたしますので、細かいアクセス制限を行う際の参考にしてみてください！ S3 バケットに関するアクセス制限 S3 バケットにアクセスされる場合、ユーザーの IAM ロールに付与する IAM ポリシーをカスタマイズすることで、アクセス制限を実現できます。 以下、様々なパターンに応じて設定方法を説明します。 バケット単位による制限 バケット単位で

こんにちは！ AWS SQS って具体的に何ができるのか、よくわからない方が多いのでは？と思います。 本記事では、メッセージキューを使用したユースケースと、そのプログラミング方法を紹介します。 サービス開発の中で AWS SQS を一切使用しないという選択も可能ですが、ユースケースによっては実装コスト・リスクを大きく軽減できる可能性があります、是非覚えていってください。 想定する読者 AWS サーバーレスで開発を行っているヒトメッセージキューを扱ったことがないヒトAWS SQS の概要から実装方法を知りたいヒト はじめに AWS SQS でできること 非同期での処理実行 例えば、財務システムの開発で帳票を PDF 出力できる機能を考えてみましょう。 PDF 出力には、財務システムの持つ様々な計算ロジックを起動させる必要があり、PDF 出力完了までに10秒以上の時間を要する可能性があるとしま

生徒手帳はその学校の生徒であることを証明し、生徒手帳の情報（学年や専攻科目）で入室可能な部屋を指定しています。この概念は学校に限らず、社会の様々なシーンで使われていますね。 認証認可の概念を理解できたら、次はいよいよ Cognito による認証認可の実装方法を解説します。 Cognitoによる認証認可構築方法を解説 CognitoUserPoolとIdentityPoolによる認証認可の全体像 Congitoでは、認証を CognitoUserPool、認可を CognitoIdentityPool で行います。それぞれ、認証・認可が成功すると、文字列のトークンをレスポンスしてくれます。このトークンを各種 AWS サービスを呼び出す際のリクエストに付与することで、認証・認証な AWS サービス利用が実現します。 では、実際に手を動かして構築してみましょう。 CloudFormation (

東京リージョンの場合、1,000を超える同時実行が行われた場合、Lambda関数のAPIは追加の呼び出しをスロットリングします。 Lambda は 1 分間ごとにスケールします 最初のバーストトラフィック発生時に、関数の同時実行数は 1 分ごとにさらに 500 インスタンス増加します。すべてのリクエストを処理できる十分なインスタンス数が確保されるまで、または同時実行数の上限に達するまで続きます。 また、Lambda関数は処理完了後、一定時間を待って追加の呼び出しがなければリソースが解放され、追加の呼び出しがあればそれに応じて処理を行います。（一瞬ホットスタンバイするようなイメージ） Lambda のバーストトラフィックの試算 Lambda関数のバーストトラフィックを試算する際は、一回あたりの処理時間も加味した上で試算を行うことが必要です。例えば、一回あたりの処理が小粒であれば、 1 分当た

DynamoDBで完全な探索要件の構築を目指さないでください DynamoDBはKVSです。水平軸の検索要件はElasticSearchを使用しましょう。 最も重要なことは、一つのデータベースで全ての機能の実現を目指さないこと アプリケーションの DB 開発において、様々なワークロードに対応したデータベース構築を目指した場合、どうしても DynamoDB だけ、MySQL だけで対応できないことがしばしば有ります。 例えば、オンデマンド動画視聴サービスの視聴ログを Read 集計する要件には縦軸集計に強いグラフ型の RedShift などを採用し、顧客の投稿情報に対する複雑なテキスト検索には ElasticSearch を検討します。 私たちは、多くのアプリケーション開発で DynamoDB を採用してきたメリットを下記のように感じています。 設計次第でスループットを効率的に利用・低レイテ

こんにちは！ AppSync 開発の情報は、API Gateway と比較すると少ないと思います。GraphQL がまだまだ浸透していない日本の開発市場では、経験値のない開発チームが AppSync の開発方法を整理するのには苦労しますよね。 筆者も最初の AppSync 開発案件は非常に緊張しましたが、最近ではある程度開発手法が固まり、開発に安定感がついてきました。 本記事では、AppSync での API 開発の流れをソースコード交えて解説します！ 想定する読者 AppSync を導入検討しているエンジニア自己学習で AppSync 触ったけど実戦経験がなくて不安なヒトRestAPI 開発と具体的にどのような違いがあるのか把握したいヒト はじめに GraphQL の学習コストは高い？ わたし達は、Amplify フレームワークの機能で GraphQL のコードを自動生成しています。 A

こんにちは！ アプリケーション開発の中でも、認証と認可は複雑化しやすい部分ですよね。 弊社では、AWS での認可・認証は Congito を使用して構築するケースがほとんどです。（稀に OpenIDConnect と組み合わせて認証を実装するケースもあります） 本記事では、弊社で多くの採用事例をもつ Cognito の概念について解説します。 ユーザープールと ID プールとは？ Cognito には、ユーザープールと ID プールと呼ばれる２つの大きな機能/概念があります。Cognito を触る際は、まずこれらについて深く理解しなければいけません。 まずそれぞれの役割を簡単に書くと、下記の表のようになります。

こんちには！ 前回の Aws サミットでは大々的に AWS Amplify が挙げられていました。わたしたちも非常に多くの案件で採用事例のある画期的なフレームワークです。 本記事では AWS Amplify をご紹介します。 想定する読者 AWS でのサーバーレス開発に興味のあるヒトAWS Amplify の概要を知りたいヒトAWS Amplify で新規事業開発を考えているヒト Amplify とは何者？ 一言で言えば、「バックエンド構築からフロントエンド開発までカバーするオールインワンの開発フレームワーク」です。 まず、わたしたちが案件で実用してきた所感から、魅力的なところをご紹介します。 対話式のバックエンド構築を提供する CLI が便利複雑化しやすい認証の仕組みを超簡単に構築可能各種バックエンドのリソースアクセスをセキュアにする仕組みが存在ウェブ、iOS、Android ライブラリ

こんにちは！ ウェブアプリケーションの開発でデファクトスタンダードな VueJS / NuxtJS ですが、SSR 時のデプロイ方法についてはみなさん悩まれることが多いのではないでしょうか？ SPA であれば AWS Cloud Front と S3 のコンビで十分に運用可能ですが、要件に SSR が入ってくると Nodejs のランタイムが必要になりますね。 そんな時に大活躍するのが ECS, Fargate です！ 想定する読者 AWS サーバーレス環境で NuxtJS で SSR したいヒトNuxtJS のデプロイ方法について悩んでいるヒト はじめに Lambda での SSR 時の問題 実は、Lambda と API Gateway のコンビの方がもっと手軽にSSRを構築可能です。しかし、Lambda にはレスポンスボディサイズの制約、デプロイ可能な ZIP サイズの制約などがあり

こんにちは！ 最近は、AppSync／GraphQL での開発案件が非常に増えてきました。 GraphQL は、RestAPI のようなリソース志向の API設計に対し、データアクセス志向な API 設計を可能にします。つまり、フロントエンドの画面の振る舞いを起点にした API 設計/開発を行うことができます。 また、2018年にAws API GatewayがWebSocket APIに対応しました。 それまでは AppSync のメリットはサブスクリプション通信可能であることが挙げられていましたが、API Gateway が Web Socket に対応したことで、両者に明確に機能面で優位性は無いように思えます。 そうなると AppSync と API Gateway どちらを採用すれば良いのか迷いどころだと思いますが、わたしたちの AppSync 開発の知見をベースに本記事で解説しよ

Fargate VS Lambda 両者の違いをスタートアップCTOが本気で考えてみた！~2021年9月29日更新