Tagbangers Blog

J K

[型パズル] Q. TypeScript の型定義でジェネリクスのパラメータが配列かどうかで型の形式を変えたい!

結論: T extends Array を用いる あけましておめでとうございます(半年遅れ) 最近業務で Headless CMS を触ったのですが、技術調査の際に候補に上がった Strapi がずっと気になって最近ので最近遊んでいるのですが、その際に API レスポンスの型を TypeScript で表現するときに利用した手法が面白かったので共有します REST API Strapi の公式ドキュメントを例にとると、扱う entry(ドメイン・データ)は下記の interface で表現できます interface Restaurant { title: string descr...

Paketo Buildpacks で作成する Spring Boot App on Docker で FFmpeg を扱えるようにする

Cloud Native Buildpacks は Docker 上でアプリケーションを稼働させるにあたり非常に強力なソリューションです Tagbangers では Spring Boot と Next.js で作成したアプリを AWS EKS / AWS ECR にデプロイして Docker Container 上で稼働させているプロダクトがいくつかあります それらは Buildpacks を利用してほぼゼロコンフィグでイメージを作成しているものが多いです 過去にも Buildpacks に関連した記事をいくつか随筆しているのでよろしければご覧ください Next.js による Docker ...

Spring Cloud Gateway の CORS 設定を Vercel の自動生成 URL に対応させる

下記の環境に対応させるために Spring Cloud Gateway の設定の調整をした時のメモです フロントエンドアプリケーションは Vercel にデプロイ API サーバの前段に CORS が有効な Gateway サーバがいる フロントエンドアプリケーションと Gateway サーバのドメインが異なる CORS の設定は application.yml で指定することが可能です Spring Cloud Gateway のドキュメントとしてはサンプルとして下記の書き方が紹介されています CORS Configuration - Spring Cloud Gateway spring:...

Contentful App Framework を用いて RichText を拡張する

Tagbangers では新しい取り組みとして Web アプリケーションの構築の際に Headless CMS を用いたサイトデータ構築を行っています デザインとデータを分けることで責務を分散させる他に開発者以外にもお客様が文言を直したり新しい項目を増やすことが可能になるので運用上のメリットを得られることができます Headless CMS のサービスの中で弊社では Contentful を利用しており、現在も目下使い方や運用を考えながらアプリケーションの開発に携わっています 今回は Contentful で利用できる Rich Text とその拡張方法を試してみました Contenful の...

Spring + Testcontainers によるテストと ContextCustomizerFactory による効率化

参考記事 Faster tests by reusing Testcontainers in Spring Boot Testcontainers の活用 Testcontainers は Java (JUnit) でテストを書く際に Docker コンテナを用いて実際の環境に近い Integration Tests を実現することのできる強力なソリューションです タグバンガーズでも以下の事例で実際に Testcontainers を利用してテストを作成しているプロジェクトがあります AWS S3 に対して操作を行うプロジェクトで LocalStack Module を用いて AWS SDK ...

ローカルマシンから環境を汚さず RDS に接続する

Conclusion SSM を用いて RDS へのポートフォワーディングを行い、Docker 経由でコマンドを叩く Motivation AWS RDS はマネージドなリレーショナルデータベースサービスです Amazon RDS(マネージドリレーショナルデータベース)| AWS 一般的にリソースはプライベートサブネット上に作成するためローカルマシンから直接クライアントコマンドを用いて接続することはできません そこで多くの場合は RDS へアクセスできる IAM ロールを持つ踏み台 EC2 サーバを立ててセッションマネージャ等で RDS に接続します ただし「データのダンプもしくはリストアを行...

環境別のリソースを Bitbucket Pipeline を用いてデプロイする方法

弊社の一部プロジェクトでは Bitbucket Cloud を利用しています Bitbucket Cloud には CI/CD ツールとして Bitbucket Pipeline が組み込まれています Bitbucket Pipeline は通常、下記のようなフローを行うプロジェクトを想定して案内されています プロジェクトのビルド & テスト テスト環境へのデプロイ 本番環境へのデプロイ 一方で今回ご紹介するのは下記のような環境別にリソースを同一のリポジトリで管理しているプロジェクト向けのパイプラインです Static Resource files (S3 にデプロイなど) Kubernete...

Upgrade Keycloak (WildFly) to Keycloak.X (Quarkus)

Tagbangers ではマイクロサービスとして認証サービスとアプリサービスを分離および認証を統合して再利用しているプロジェクトがあります 認証サービスは Keycloak を用いており EKS 上に Helm を利用して展開しています A curated set of Helm charts brought to you by codecentric アプリサービスは Spring Boot を用いて Keycloak と認証の連携を行なっています 連携に関する下記の記事もご参照ください Keycloak と Spring Boot アプリケーションで OpenID Connect の Au...

純粋関数ライブラリ Ramda.js を使う(関数紹介編)

最近のプロジェクトではフロントエンドは TypeScript を用いたプロジェクトがデファクトスタンダードとなっています いくつか定番のライブラリも入れていますが、その中で今回はユーティリティライブラリとして Ramda.js をご紹介します Ramda.js https://ramdajs.com ユーティリティライブラリの一つで類似するものとして、弊社では以前 Lodash.js を使用していました https://lodash.com Ramda.js の特徴としては、全ての関数が純粋関数型でカリー化が行われているという点です 純粋関数型 全ての関数は副作用を持たず、引数として渡した値自...

Next.js による Docker Image の作成周りの雑記

最近のプロジェクトではフロントエンド開発のフレームワークとして Next.js を採用しています フロントエンドの成果物は静的ビルドを行いサーバに配置 or バックエンドの成果物に含めることが基本ですが、Kubernetes 上に展開する場合はフロントエンド用に個別に Pod を用意してアプリケーションを立ち上げています Next.js プロジェクトの Docker Image の作成 Next.js は開発環境以外にも本番稼働向けの Node.js サーバをスクリプトを用意しています # プロジェクトの依存パッケージのインストール  yarn install # プロジェクトのビルド ...