こんにちは、アルダグラムでSREを担当している okenak です。今回は、2024年末に実施した KANNA の AWS インフラ基盤の全面リプレースについてご紹介します。このプロジェクトは、昨年下期に実施した大規模な基盤移行であり、構成の見直しから段階的な切り替え、本番移行に至るまで、多くの検討と労力が求められました。本記事では、移行に至った背景、当時直面していた課題、具体的な取り組み内容、そして移行を通じて得られた学びについてまとめています。どこか一部でもご参考になれば幸いです。▶️ KANNAのサービス紹介ページはこちらhttps://lp.kanna4u.com/...

こんにちは！アルダグラムでエンジニアをしているshige_sです今回、Magicpodに新しくリリースされた「繰り返し処理」機能についてご紹介します。また、弊社でのE2E自動テストの取り組みについても触れながら、この機能の活用方法をお伝えします。 繰り返し処理とは「繰り返し処理」は、特定の条件が満たされるまで処理を繰り返すことができる新機能です。例えば、以下のようなケースで活用できます。カレンダーUIで特定の年月が表示されるまで「月送りボタン」を押下する弊社では、カレンダーUIを操作するシナリオが多く存在していました。これまでは、毎月「特定の日付」をクリックする際に、ロケ...

こんにちは！アルダグラムでエンジニアをしている今町です。弊社では、2022 年 2 月から、zenn の Publication 機能を利用して、テックブログを運営しています。エンジニアメンバーの協力もあり、祝日や長期休暇を除くとほぼ毎週欠かさずにブログ記事を投稿できています！これはとんでもないことだと思います（自画自賛になってしまいますが）社内にテックブログ運営チームがあり、記事を書いてくれるエンジニアメンバーのアサインやスケジュール調整を行っています（アルダグラムにおけるテックブログ運営の詳細は、こちらの記事も参照ください）そんな中で、運営チームから「日々、テックブログを...

こんにちは！アルダグラムでエンジニアをしている今町です。皆さん、React アプリケーションでアニメーションを実装してみようと思ったことはありますか？私自身、「いや…、アニメーションとか敷居が高そう…」と思って尻込みしていました。そんな中で、シンプルで直感的にアニメーションを実現できるライブラリを見つけたので紹介します。 react-spring とは？react-spring は、React アプリケーションで自然で滑らかなアニメーションを実現するためのアニメーションライブラリです。主な特徴は以下です。物理ベースのアニメーションバネ（スプリング）の動きを模倣することで、...

こんにちは！アルダグラムでエンジニアをしている渡邊です。Compose Multiplatform での開発において、2025年2月時点では Android Studio において Composable 関数のプレビュー表示が commonMain[1] では行えないという問題があります。しかし、IntelliJ IDEA EAP 251 では commonMain でも Composable 関数のプレビュー表示が行えるようになったようです。今回は、Compose Multiplatform における現在のプレビューの状況と commonMain で表示する方法について紹介します...

こんにちは！アルダグラム でエンジニアをしている渡辺です。今回は、iOS アプリ開発で写真や動画を扱う際によく使う PHPickerViewController を使って、ユーザーが選択した順番通りに PHAsset を取得する方法について紹介します。私自身、開発中に少しつまずいたポイントもあるので、同じ問題に直面した方の参考になれば嬉しいです！ 📸 KANNA アプリのアップロード機能私たちが開発しているアプリ KANNA では、複数の写真や動画を選択し、選択した順番通りにアップロード する機能があります。この機能を実装する際、写真選択後の順序保持が思ったよりも厄介だったので、...

こんにちは！KANNA の開発のお手伝いをしております、フリーランスエンジニアの len_prog です。最近、Stable Audio という機械学習を用いた音楽生成モデルに興味を持ちました。簡単なプロンプトを入力するだけで音楽を作成できるとのことで、ローカル環境で試してみることにしたのですが、セットアップには想像以上のハードルがありました。今回は、その環境構築と試行錯誤の記録をまとめてみます。 実行環境とセットアップ 環境MacBook Air M3 (2024)Python 3.9PyTorch (MPS)GradiotorchaudioHuggin...

こんにちは！アルダグラムでエンジニアをしている秋田です。弊社では以前、 フロントエンドのライブラリ134個を一気にアップデートしてリリース しました。今回はその中で起きたVRT(Visual Regression Testing)の課題と対応について紹介したいと思います。 前提弊社サービス KANNA のフロントエンド開発にはVRTを導入しています。使用技術としては Storybook + storycap + reg-suit で、GitHubへのpushをトリガーにして GitHub Actions のワークフローとして自動実行します。実行結果は Amazon S3 に保存...

みなさんこんにちは！株式会社アルダグラムでエンジニアをしている大木です。今回は、Storybook を学び直していこうかなと思います。現在弊社ではStorybookを利用しており、レビューやデザイナーとの連携で活用しています。特に何かに困っているわけでもないのですが、もっとうまく使いこなせないのかなぁと考えていたところでした。今までは6系を使っていたのですが、とあるチームが8系へのアップデートの作業をしてくださいました(ありがたい限りです)。 そういったキャッチアップのためにも学び直しをしていこうかと思います。 インストールインストールに関しては以下のページが参考になるかと思い...

エンジニアとしての歴も少し積み重なってきたせいか、レビューをしているといくつか過去の経験が浮かんでくることが最近ちらほらありました。覚えてるうちにそれらを言語化してみようかなと思います。 テストのないコードはapproveしない「変更とテストは必ずセットにすること」。昔、大先輩からいただいた言葉です。一方で「テスト書いてください」って言いづらいですよね。わかります。うざいやつだって思われたくないし、目上の人が相手なら尚更。僕の場合は、この先輩が本当にすごい人だったというのが大きいかもしれません。ちゃんとやってる人ってやっぱちゃんとしたすごいコードを書くんですよね。最近の言い...

こんにちは！アルダグラムの @sukechannnn です。JUnit 5 でテストを実行するとテストの実行ログは出るのですが、最終的な実行結果のサマリーは 5 tests completed, 1 failed しか表示されません。IDE上ではあまり困らないのですが、CI で全てのテストを実行して一部が失敗した時に「どこでテストが失敗してるんだ？」と FAILED で検索するのが地味に面倒で、RSpec のように失敗したテストが最後にまとめて表示されたら嬉しいなと思いました。JUnit Platform の TestExecutionListener を利用することで、失敗したテ...

こんにちは！アルダグラムでレポートチームのエンジニアをしている志茂です。レポートチームでは、お客様が利用されているExcelファイルをKANNA上にアップロードし、Webから編集できるような機能を開発しております。 今回の記事のスコープスクラムの話をする際に、取り組んでるかそうでないかの話をよく聞くのですが、実際に導入した上で、今のチームには効果的だったが、前のチームにはあまり効果出来でなかったような、具体的なケースを前提とした話はあまり聞かないような気がするので、自分が過去に所属した開発チーム(現職も含め)の体制を振り返って、帰納的にこんなケースだとスクラム効くんじゃないか...

こんにちは、アルダグラムの田中です。今回はフロントエンドで利用している npm package を合計134個、最新バージョンへ更新し、最終的に不具合を発生させず一括リリースできた話について紹介します。一例として以下のライブラリのバージョンアップを行いました。beforeafterNext.js12.2.015.0.3React17.0.218.3.0Node.js16.14.222.11.0@apollo/client3.3.63.11.10Storybook6.5.108.4.7ESlint8.22.09...

こんにちは！アルダグラムでエンジニアをしている渡邊です。弊社では KANNA というサービスを提供しており、モバイルアプリは React Native で作られています。そのモバイルアプリにおいて、現在 Kotlin Multiplatform と Compose Multiplatform を使って React Native をやめるように移行対応を進めています。この記事では移行に至った経緯と、現在の状況について紹介します。 KANNA のモバイルアプリの歴史弊社の KANNA のモバイルアプリは2019年頃に開発がスタートしました。私は当初はまだ参画していなかったのですが...

こんにちは！アルダグラムでレポートチームのエンジニアをしている志茂です。レポートチームでは、お客様が利用されているExcelファイルをKANNA上にアップロードし、Webから編集できるような機能を開発しております。Excelファイルを読み込み編集できるようにするためには、色々な考慮事項があるのですが、今回はその中でもExcelアップロード時にバリデーションが必要な、Excelシートの循環参照をトポロジカルソートを用いて判定する方法について、以下のように3回に分けてお話ししたいと思います。Excelシートの循環参照をトポロジカルソートで判別するためには (1/3)DFS（深さ優先...

こんにちは！アルダグラムでエンジニアをしている渡邊です。弊社の KANNA のモバイルアプリでは、以前から画像に対して線やテキストを書き込み、書き込んだ内容を新しい画像として出力することができるという、画像編集機能があります。画像編集時には画像を回転することができなかったのですが、先日、画像も回転させられるようにする機能拡張を行いました。以下はそのサンプル動画です。以前までは画像編集時には TouchImageView というライブラリを使って画像を表示していたのですが、このライブラリには画像を回転させる機能がありませんでした。そのため回転機能がある画像表示ライブラリを探して...

こんにちは。アルダグラムでエンジニアしている前山です。日々の開発フローの中で、コードレビューは品質と知見共有の両面で欠かせないステップです。それは単なるチェック作業ではなく、より良いプロダクトを生み出すための重要なコミュニケーションの場でもあると思います。開発に関するチームの振り返りでも、たまにコードレビューに関して話題に上がるので、今までトピックに上がった内容や自分が意識しているコミュニケーションやプロセスについて、レビュアーとレビュイー両方の視点からお話しできればと思います。 レビュアー視点まずはレビュアー視点で意識していることを紹介します。 ポジティブなコメントを心が...

こんにちは！アルダグラムでレポートチームのエンジニアをしている志茂です。レポートチームでは、お客様が利用されているExcelファイルをKANNA上にアップロードし、webから編集できるような機能をKotlinとSpring Bootで開発しております。Excelファイルを読み込み編集できるようにするためには、色々な考慮事項があるのですが、今回はその中でもExcel関数の読み込みで利用している、ANTLRという構文解析を行うためのツールをGoogle Colaboratory上で動作させ、解析した結果を構文木の画像として生成する方法をご紹介します。 構文解析ツールを使わないと大変...

こんにちは！アルダグラムでエンジニアをしているカゲヤマです。アルダグラム では、アルダグラムが使っている技術スタック（2021年 → 2023年）の記事の通り、Datadog を以前から利用しています。私は、最近まで新機能の開発をしていたのですが、パフォーマンス計測およびその改善の目処を立てるにあたって Datadog にとても助けられたので、どのように使用していたか書こうと思います。 DatadogとはDatadog は、SaaS 型の運用監視ツールであり、監視ツールの他、APMツール、ログ分析、ネットワーク管理、データベース管理などを、オールインワンに扱えます。その中でも...

こんにちは！アルダグラムでエンジニアをしている内倉です。今年も気がつけば11月、もう1年が終わろうとしていますね。2024年も様々なニュースがありましたが、その中でも個人的に特に印象深かったのが、ウミウシに擬態するゴカイ「ケショウシリス」の発見です。ゴカイはミミズの仲間、ウミウシは貝の仲間と、全然親戚感ないのに、研究者ですら最初はウミウシだと思っていたというのですから、見事というほかありません。今回は、そんなケショウシリスの擬態の本気度を測ってみたいと思います。 前提私自身は、生物学的な知識も、機械学習的な知識も全然なく、可能な限り手軽に実行したいので、以下のような組み合わ...