6
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

AWS認定バッジを並び替えるアプリをAmplify Gen2とReactで開発しました!

Posted at

はじめに

AWSの資格を取得すると認定バッチを取得できますが、
登壇時の自己紹介で、バッジを綺麗に並べたいと考えている方も多いのではないでしょうか?

こんな感じ↓
AWS_Badge.png

しかし、PowerPointなどで手作業で並べようとしても、微妙に端がずれてしまい、思ったように整列できないことが多いです。(余計な時間がかかる)
なので、私はこれまで以下のサイト様で公開されているアプリを利用していました。
AWS認定資格を取ったらAWS Badge Alignerでバッジを並べて楽しもう!
しかし、このアプリは数年間更新されておらず、2024年以降の資格には対応していませんでした。

そこで、同様のアプリを作成し、下記に公開しました!

AWS Badge Display

本記事では、こちらのアプリについて紹介します!

開発したアプリケーションのご紹介

このアプリは ReactAmplify Gen2 を用いて開発しました。

GitHubリポジトリ

技術選定の理由

  • 以前参加したハッカソンで ReactAmplify を使用した経験があったため。
  • 参考にしたサイト で、今後の展望として Amplify が挙げられていたため。

これらの理由から、この技術を採用して開発しました。

使い方

  1. credly から自身の保有する資格バッジをダウンロードします。
  2. 「ファイルを選択」ボタンをクリックし、ダウンロード済みの資格バッジを選択します。
    image.png
    image.png
  3. 選択ボックスから資格を選択し、好みの順番に並べます。
    image.png
    image.png
  4. 「バッジ画像を生成」ボタンをクリックすると、整列されたバッジ画像が生成されます!
    image.png

生成された画像をダウンロードし、ぜひ活用してみてください!

6
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?