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

こんにちは！アルダグラムのKANNAの開発お手伝いをさせて頂いている @takjin です。ここ最近、サーバサイドで Kotlin に触れる時間が増えているのですが、そんな Kotlin から Kotlin/Wasm が昨年からアルファ版として提供されたので入門してみました。今回は、生成したKotlin/WasmをNext.js経由で動作させるところまで手を動かしてみます。Kotlin 2.0.0Next.js 14.2.x 公式で提供されているコードに触れてみるサンプルコードがGitHubで公開されていますので、手っ取り早く始めるならこちらから。https://gith...

アルダグラムでソフトウェアエンジニアとして活動している松田です。データは数値や文字のみの表現では、情報の把握が難しい場合があります。1画面に複数のデータを視覚化して表示することで、情報の把握が容易になることがあります。一般的には、それをダッシュボードと呼びます。本稿では、ダッシュボード開発のために調査したReactのグラフ描画ライブラリおよび関連技術をまとめています。データビジュアライゼーションの一助になれば、幸いです。 グラフ描画に関連する技術 SVGとCanvasブラウザでグラフ描画を行う主な手段としては、 SVG と Canvas があります。 簡易比較表...

こんにちは！アルダグラムでエンジニアをしている柴田です。 はじめに最近はCSSの進化が著しく、JavaScriptを使わずともCSSで高度なUIコンポーネントを実装できるようになってきました。特にカルーセルのようなUIもCSSだけで実現できることを知り、最新技術をキャッチアップしておきたいと感じました。そこで今回は、CSSのscroll-snapプロパティを活用して、３種類のカルーセルを実装する方法をご紹介します。 scroll-snapプロパティの紹介scroll-snapプロパティとは、スクロール時に要素を特定の位置でピタリと止めることができるCSSの機能です。これによ...

こんにちは！アルダグラムでエンジニアをしている森下霞ですancestry は、Rails アプリケーションで階層データを簡単に管理するためのジェムです。このジェムを使用することで、ツリー構造を持つデータを1つのデータベースカラムを使って表現できます。ancestry を使用し親子関係を持つデータを簡単に保存し、ルートノード、子ノード、ツリーなど、階層を取得することができるのに便利なメソッドが用意してあります。ただ、データ量が増えて処理が複雑になるとデメリットもあります。本稿では、その解決アイデアを述べたいと思います。 テストデータ生成まずは、例用テーブルを用意します。例で M...

アルダグラムで、モバイルアプリを開発している長尾です。ところで、スマホアプリで、写真選択画面ってあるじゃないですか。あれ。またの名をそれ。(多分違う)あれです。あれ。そうそれ。それです。実は、iOSにおいては、写真選択画面は、同じUIでも、使えるClassが複数存在しています。本稿は、使えるClassが複数あるだけならまだしも、、という与太話です。 写真選択画面を構成する3つのClass2024/10/17現在、iOSにおいて、写真選択画面を構成できるClassは、3つ存在しています。PhotosPicker公式ドキュメントPHPickerControlle...

こんにちは！アルダグラムでエンジニアをしている今町です。皆さん、コーディングをする際、どのようなエディタもしくは統合開発環境（IDE）を使っていますか？Vim、JetBrains が出している各種 IDE、それとも Visual Studio Code（VSCode）でしょうか？そんな私は、ずっと VSCode を愛用し続けています！VSCode を素晴らしいエディタたらしめているのは、なんといっても豊富な「拡張機能」の存在でしょう。VSCode の開発元である Microsoft 純正の拡張機能から、サードパーティ製の拡張機能まで、様々な便利ツールが拡張機能として提供されています。...

こんにちは！アルダグラムでエンジニアをしている渡邊です。先日 React Native と使用しているライブラリのバージョンアップを行いました。この対応に苦労したので対応した内容を知見として共有したいと思います。色々と私見を述べていますが、私自身が Android、iOS のネイティブアプリ開発経験があるという点も踏まえた意見であることにご留意ください。!この記事は React Native をディスるものでありません 弊社のアプリについて弊社のアプリ KANNA は React Native で作られています。（ただし一部の機能は Kotlin や Swift といった...

こんにちは！アルダグラムのKANNAの開発お手伝いをさせて頂いているoubakiouです。KANNAでは主にバックエンドにRails+graphql-rubyやKotlin+DGS、WebフロントエンドにTypeScriptとReactを採用していて、私が参加するチームでの仕事もそれらを触る事が多いのですが今回はそこでコードレビューをする際に気にしている「べからず」をティア別に見ていきましょう。 特に理由なくlintを無視してはいけないアルダグラムでは利用エディタの規定や制限はありませんが、Webフロントエンド開発で一番利用者が多いのはVSCodeでextensions.js...

こんにちは！アルダグラムのSREエンジニアの田中です。アルダグラムではインフラ環境をTerraformを使って管理しています。最近アルダグラムではメインのプロダクトであるKANNAプロジェクトのほかにKANNAレポートといった新しいプロダクトが生まれています。また、それに伴い複数の開発環境が必要となり、効率的なインフラ環境の構成管理も求められるようになってきました。開発環境やプロダクトが増えるごとにTerraformのコードが冗長になり始めたため、Terragruntを使用し、効率的に管理できるようにしました。今回は、Terragruntを用いてどのようなディレクトリ構成で構成...

こんにちは！アルダグラムでエンジニアをしているshige_sです2024年から取り組み始めている「Bugbash」についてのご紹介をさせていただければと思います。 BugbashとはBugbashとは、職種関係なくみんなでテスト対象をさわって「バグ出し」するイベントです。弊社では、各開発チームで企画されている開発施策に対して、Bugbashを行っています。 昨年までのQAフローBugbashを企画・運用する前までのQAフローテスト工程内容テスト計画・QA期間の見積もりやテスト対象の範囲の選定などテスト設計・テスト観点の洗い出し・テスト...

こんにちは！アルダグラムでエンジニアをしているokenakです。今回は、弊社サービスのKANNAにおける表示速度の低下という問題を解決するために、本番相当のデータ量を用いた負荷検証環境（loadtest環境）を構築した取り組みについてお話ししたいと思います。なお、loadtest環境の構築自体はTerraformを使用してAWSリソースの作成を行ったため、本記事では主に本番相当のデータを自動同期する仕組みについて解説していきます。 本番に近い環境での検証の必要性KANNAを利用している企業の中には、大量のデータを保持しているところがあります。そのような企業では、一部機能でデータ...

こんにちは！アルダグラムでエンジニアリングマネージャーとなったやすです。今年の1月から品質管理チームのマネージャー、4月からセールスエンジニアチームのマネージャーを担当することになりまして、3つのチームのマネージャー的ポジションで業務を行っています。開発チームのリーダーから、品質管理やセールスエンジニアチームも担当するようになり、新たなチャレンジが増えました。品質管理（QA）やセールスエンジニアといった職種には土地勘がないので、物事を進めるにもわからないことだらけです。しかし、事業は進んでいくので、わからないことが多い中でプロジェクトが円滑に進行するために、状況を整えることが求め...

アルダグラムでソフトウェアエンジニアとして活動している松田です。プロダクト開発において、大きさの異なるUI要素を2次元で配置するデザイン要件が発生しました。そのためのソリューションを検討する中で、Masonry Layoutに関する技術の変遷を知りました。今回は、その調査をもとに、今後の開発におけるMasonry Layoutの取り扱いについて考えてみました。 Masonry Layout とはMasonry Layoutは、異なるサイズの要素を隙間なく配置するレイアウト手法で、建築の組積造（Masonry）に由来しています。画像や記事のギャラリー表示に多く用いられ、代表...