kickflow Tech Blog

https://tech.kickflow.co.jp/

株式会社kickflowのプロダクト開発本部によるブログ

フィード

記事のアイキャッチ画像
ローカル環境で動くCypressテストの並列実行を自作して高速化した話
kickflow Tech Blog
こんにちは、kickflow QAチームの川村です。 今回は、E2Eテストの実行時間を短縮するために、Cypressのテスト並列実行基盤を自作した話をします。 E2Eテストはプロダクトの品質を担保する上で非常に重要ですが、テストケースが増えるにつれて実行時間が長くなり、開発サイクルを遅延させる一因になりがちです。 私たちのチームでもこの課題に直面し、自動テストの実行時間短縮に取り組みました。 この記事では、Cypress Cloud公式のParallelization機能を使わずに、Node.jsを用いて独自の並列実行システムを構築し、テスト実行時間を1並列の約40分から8並列の約10分へと7…
1日前
記事のアイキャッチ画像
AIを使ってYARDからrbs-inlineへ移行しました
はてなブックマークアイコン 1
kickflow Tech Blog
ロボット掃除機に効率よく掃除させるには、部屋を整理整頓するのが重要です。整理整頓もロボットがしてくれればいいのに(本文には関係ありません)。 kickflowで主にバックエンドを担当している小本です。今回は、既存のRailsプロジェクトについて、AIを活用してYARDコメントをrbs-inlineに自動変換した事例を紹介します。 RBS / rbs-inlineとは なぜRBS / rbs-inlineを導入したいのか? AI使ったYARDからrbs-inlineへの移行 変換作業の概要 GitHub ActionsによるRBSファイルの自動生成 まとめ 最後に
6日前
記事のアイキャッチ画像
AIを活用してコードレビューを効率化!kickflowでの4つの取り組み事例
kickflow Tech Blog
こんにちは。開発チームでエンジニアをしている森本です。 皆さんは日々の開発でコードレビューをしていますか? kickflowでは、開発フローにコードレビューのステップを組み込んでおり、ほとんどすべてのコードでレビューが実施されます。しかし、このコードレビューは多くの企業で共通の課題となっているように、非常に負荷の高い作業です。複数の観点から品質に対する責任を伴うため、有識者が中心となって行うことが多く、開発のボトルネックになりやすい傾向があります。一方で、コードレビューを怠るとプロダクトの品質を担保できず、不具合や仕様齟齬が発生するリスクが高まります。 本記事では、弊社でのコードレビューへの取…
13日前
記事のアイキャッチ画像
Pull Request単位のホワイトボックステスト観点をAIで自動生成する
kickflow Tech Blog
こんにちは、kickflow QAチームの川村です。 ホワイトボックステストにおける観点抽出に課題を持つQAチームは多いと思います。 コードの実装に踏み込んだ観点は仕様書から読み取れず、どうしても担当者のスキルや経験に依存しがちです。 kickflowのQAチームでは、この課題を解決し、テストの品質と効率を向上させるために、AIを活用したテスト観点抽出の自動化に取り組みました。 この記事では、Devin と Slack を活用し、Pull Request (PR) の内容からホワイトボックステストの観点を自動で抽出し、テスト管理ツールである Qase にテスト項目書を作成するまでの仕組みをご紹…
16日前
記事のアイキャッチ画像
Claude APIを使ったアプリケーションの多言語対応
kickflow Tech Blog
こんにちは、kickflowでCTOをしている小林です。 kickflowでは先日中国語(簡体字・繁体字)と韓国語への対応をベータ版としてリリースしました。 今回は、kickflowのプロダクトを多言語対応するにあたり、AIを活用した自動翻訳アプローチについてご紹介します。 具体的には、Anthropic社のClaude APIとGitHub Actionsを駆使して、RailsとNuxt.jsで構築されたアプリケーションの翻訳ファイルを継続的に自動生成する仕組みを構築した話をします。
1ヶ月前
記事のアイキャッチ画像
Nuxt UIについて調べてみた
kickflow Tech Blog
社内AIにお願いして描いてもらったNuxt UIのイメージ こんにちは。kickflowエンジニアの芳賀と申します。 kickflowのフロントエンドはNuxtを利用しており、 Nuxt、および周辺のエコシステムまでふんだんに利活用し開発しております。 また、oxc の登場や rolldown の開発など、これからにも期待できますよね。 Nuxtは一通り触ってきたかな、と思っていた私ですが、Nuxt UI の存在がすっぽり抜けておりました。 業務では別のUIライブラリを使用しているため、他のキャッチアップが疎かになっていたなと反省しております。 今回は、私のキャッチアップがてらNuxt UIに…
1ヶ月前
記事のアイキャッチ画像
Autifyで効率的なE2Eテストシナリオを作ってみた 〜チケット削除機能の例〜
kickflow Tech Blog
こんにちは!kickflowのプロダクト開発本部QAチームです。 私たちは、kickflowの品質向上のため、日々様々なテストに取り組んでいます。 その中でもE2E(End-to-End)テストは、ユーザーが実際に操作する流れを通して機能全体の動作を保証する上で非常に重要です。 しかし、E2Eテストは網羅性が高い反面、手動で行うと多くの時間と手間がかかるという課題もあります。 そこでkickflowでは、E2Eテスト自動化プラットフォームであるAutifyを活用し、テストの効率化を進めています。 今回は、Autifyを使って「チケット削除機能」のE2Eテストシナリオを作成した際の工夫やポイント…
2ヶ月前
記事のアイキャッチ画像
TSKaigi 2025 にブロンズスポンサーとして参加しました
kickflow Tech Blog
TSKaigi2025の会場、ベルサール神田 こんにちは。 kickflowでエンジニアをしている芳賀です。 先日開催されたTSKaigi 2025に、kickflowはブロンズスポンサーとして参加させていただきました! 本記事では、イベントの様子や聴講したセッションの概要、そして独自に行った「フロントエンドのAI開発」に関するアンケートの結果などをご紹介します。
2ヶ月前
記事のアイキャッチ画像
kickflowの公式MCPサーバーを公開しました
kickflow Tech Blog
こんにちは、CTO の小林です。 最近、AI エージェントの活用が企業の業務効率化において重要なトピックとなっています。特に Claude や GPT などの大規模言語モデル(LLM)を活用したエージェントは、様々な業務タスクを自動化する可能性を秘めています。 そこで今回は、kickflow の API を AI エージェントから簡単に利用できるようにするため、Model Context Protocol(MCP)に対応したサーバーを開発しました。この記事では、MCP の概要と、kickflow 公式 MCP サーバーの開発について紹介します。
2ヶ月前
記事のアイキャッチ画像
CTOがClineを1ヶ月触りまくって分かったこと
kickflow Tech Blog
こんにちは、kickflowでCTOを務めている小林です。 kickflowでは、プロダクト開発の効率化と品質向上を目指して、常に新しい技術やツールを積極的に検証・導入しています。その一環として、最近注目を集めているAIコーディングツールのClineを約1ヶ月間、実際の開発業務で集中的に利用してみました。 本記事では、Clineを様々なプロジェクトで試した結果、どのようなことが可能になり、逆にどのような課題が見えてきたのか、そしてAIコーディングツールを効果的に活用するためのTipsについて、kickflowの開発現場からのリアルな声をお届けします。 Clineとは 利用環境 Clineででき…
2ヶ月前
記事のアイキャッチ画像
RubyKaigi 2025 in 松山にシルバースポンサーとして参加しました
kickflow Tech Blog
こんにちは。kickflowプロダクト開発本部の小本です。 2025年4月15日から18日にかけて愛媛県松山市で開催された「RubyKaigi 2025」に、kickflowがシルバースポンサーとして参加した際のレポートをお届けします。 RubyKaigi 2025 概要 kickflowのスポンサーシップについて セッションで感じた技術トレンド 次期Rubyの大型機能は「Namespace」 型チェック 「Prism」の存在感 VSCodeのデファクトスタンダード化 AI関連の話題は限定的 個人的に気になったツール・技術 rbs-inline: RBSをインラインコメントで記述 rbs-tr…
3ヶ月前
記事のアイキャッチ画像
DevinでOpenAPIスキーマを自動生成したお話
kickflow Tech Blog
社内AIにお願いして描いてもらったAIとOpenAPIのイメージ こんにちは。kickflow エンジニアの芳賀と申します。 AIエンジニア界隈、すごく盛り上がっていますよね。 私としてもお仕事がなくなってしまうのではないかと戦々恐々としております(笑) そんな中、弊社にも Devin ちゃんがジョインしております。 本記事ではDevinを開発で活用した事例についてご紹介します。
3ヶ月前
記事のアイキャッチ画像
ActiveRecordによるクエリを監視しファイルに出力する
kickflow Tech Blog
トラブルが起きたとき、昔ながらの方法が役立つこともある Wayne Truong from Houston, TX, CC BY 2.0, via Wikimedia Commons こんにちは。株式会社kickflowプロダクト開発本部の小本です。 Bulletは何の問題点も検出しないが実際に動かすと何故か遅い Rails業界ではBulletなどのクエリの問題点を検出するツールが普及していますが、それらも万能ではありません。時には生のクエリログが解決の糸口になることがあります。 普通にRailsアプリケーションを作ると、development環境では以下のようなクエリログが出力されるようにな…
3ヶ月前
記事のアイキャッチ画像
ネストしたトランザクション
kickflow Tech Blog
こんにちは、プロダクト開発本部の渡辺です。 先日、山を走るレースをしてきました。冬の山はとにかく服装のレイヤリングが重要です。気をつけていたものの、ベースレイヤーに綿素材のインナーを着てしまい、身体が冷えてお腹を壊してしまいました。 何かを重ねる時、それぞれの特性や役割を意識する重要性を感じて、この記事を書いてみました。 概要 新しい機能を追加する際に、バックエンド側で非同期の処理を実装しました。 その処理の中で既存のサービスオブジェクトを呼び出す箇所があり、トランザクションがネストする状況が発生しました。 ActiveRecordのトランザクションがネストした時に、どういう扱いになるかが曖昧…
6ヶ月前
記事のアイキャッチ画像
kickflowのプロダクト開発の2024年を振り返る
kickflow Tech Blog
こんにちは、CTOの小林です。今年のM-1グランプリも最高でしたね! さて、2024年も残り僅かということで、今日は2024年のkickflowのプロダクト開発をプロダクト・組織・技術など各観点で振り返ろうと思います。個別のリリース内容や技術を深堀りするよりは、全体を広く浅く紹介する記事になります。もっと詳細が知りたいと思った方は、ぜひエンジニア採用のカジュアル面談にご応募いただければと思います(←いつもの宣伝です)。
7ヶ月前
記事のアイキャッチ画像
oxlint を触ってみた
kickflow Tech Blog
oxc のアイコン こんにちは。kickflow エンジニアの芳賀と申します。 Vue Fes Japan 2024 、多いに盛り上がりましたね。 私自身楽しみつつも大いに収穫があるものとなりました。 特に印象に残っていたのが oxc でした。 エコシステムの拡充が進みつつ、みんなが一度は思い描いてたであろう 「Rust でツールチェインを書く」ことを実現されています。 今回はその中でも oxlint について触ってみましたので、 oxc も含めてご紹介できればと思います。
8ヶ月前
記事のアイキャッチ画像
Kaigi on Rails 2024 に行ってきました
kickflow Tech Blog
Kaigi on Rails 2024 プロダクト開発本部の渡辺です。 先日の「Vue Fes Japan 2024」に続き、「Kaigi on Rails 2024」にも参加しました。 kickflowでは、エンジニアの自己学習を積極的に支援しており、さまざまなカンファレンスに参加する機会を提供しています。 会社の制度を最大限に活用させていただいております。
8ヶ月前
記事のアイキャッチ画像
Vue Fes Japan 2024 に行ってきました
kickflow Tech Blog
社内AIに描いてもらったVue Fes Japan 2024のイメージ図 初めまして、プロダクト開発本部の渡辺と申します。 kickflowに入社して数ヶ月が経ちました。 日々の業務で多くのことを学び、充実した毎日を送っています。 今回は「Vue Fes Japan 2024」というカンファレンスに参加したので、そのレポートをまとめようと思います。 kickflowもスポンサーとして協賛しており、当社ではフロントエンドにNuxt 3を使用しているため、今回のカンファレンスは多くの学びが得られると期待していました。
9ヶ月前
記事のアイキャッチ画像
Wasmを触ってみた
kickflow Tech Blog
A pop and cute eye-catch image for a WebAssembly (wasm) related blog (Bing の Image Creatorで生成) kickflowプロダクト開発本部の小本です。 kickflowでは週1でkickflowで使っている技術や今後kickflowで使いたい技術を紹介する勉強会を開いています。今回は、その勉強会のWasm回の資料を公開します。 なお、kickflowでは直近でWasmを導入する予定は無く、まずWasmの概要を把握し今後に備えるという段階なので、この資料も大掴みに説明するものとなっています。
10ヶ月前
記事のアイキャッチ画像
ESLint を flat config に移行したときのお話
kickflow Tech Blog
社内 AI にお願いして描いてもらった ESLint flat config のイメージ図 こんにちは。kickflow エンジニアの芳賀と申します。 今回は入社後初めて行った「ESLint の flat config 移行」についてお話します。 自身も久しぶりにガッツリ ESLint と向き合う機会だったので初心に帰り、調べ調べ行いました。
10ヶ月前
記事のアイキャッチ画像
RubyからJavaScriptコードを実行する方法
kickflow Tech Blog
戦前、日本の鉄道網は連絡船を通じて樺太までつながっていた(本文には関係ありません)パブリックドメインの画像。wikimedia commonsより kickflowプロダクト開発本部の小本です。 今回はRubyからJavaScriptコードを実行する方法を調べてみました。
1年前
記事のアイキャッチ画像
CloudConvertを使ってサーバーレスにファイル形式を変換する
kickflow Tech Blog
江戸東京博物館 所蔵・浮世絵『漬物早指南』かつて漬物は各家庭で作るものであったが、近世以降は専門店が出店し、漬物を買う文化が生まれた(本編には関係ありません)。 こんにちは。プロダクト開発本部の小本です。 kickflowでは2024年2月からPDF形式で帳票出力できるようになりました これまで帳票出力ではXLSX形式でのみ出力可能でした。PDF形式での帳票出力では、まずサーバー側でXLSX形式での帳票を作成し、自動的にPDFへ変換してから出力します。 ところで、みなさんはXLSXをPDFに変換する処理は好きですか?自分でWindowsサーバーを用意してMicrosoft Excelをインスト…
1年前
記事のアイキャッチ画像
社内ドキュメントに対応したSlack AIボット(GPT-4o搭載)を開発した話
kickflow Tech Blog
こんにちは、CTOの小林です。 ChatGPTをはじめとした生成AI、便利ですよね。素のChatGPTでも十分に便利なのですが、業務で使うには社内ドキュメントにも対応して欲しいと誰もが思うのではないでしょうか。すでにOpen AIのAPIを使って社内ドキュメントに対応したAIボットを開発している事例は多数ありますが、kickflowでも社内用AIボットを開発して社員に展開しました。今日はこのAIボットのアーキテクチャや実装についてご紹介します。
1年前
記事のアイキャッチ画像
JavaScriptで文字列の長さを正しくカウントする
kickflow Tech Blog
文字列の長さをカウントするのは難しい こんにちは、CTOの小林です。 JavaScriptで文字列の長さをカウントする際、特にサロゲートペアや合字を含む場合には注意が必要です。この記事では、String.length、[...str].length、およびIntl.Segmenterを使用して文字列の長さを正しくカウントする方法について説明します。
1年前
記事のアイキャッチ画像
Active Storageのダイレクトアップロードのパフォーマンスチューニング
kickflow Tech Blog
こんにちは。エンジニアの森本です。 kickflowでは、申請するチケットに対してファイルを添付することができます。これらをActive Storage のダイレクトアップロードを使って実現しています。 以前からファイルを大量に添付したチケットを申請すると、タイムアウトが発生してしまう問題がありました。APMサービスを見てみると、ファイルをダウンロードしている処理がありました。 今回は、ダイレクトアップロードを利用していてファイルを大量にアップロードしたときにタイムアウトが発生しないように行った工夫を共有したいと思います。
1年前
記事のアイキャッチ画像
kickflowでのRow Level Security導入: 成功事例と実装ガイド
kickflow Tech Blog
kickflowでのRow Level Security導入事例と実装ガイド。データセキュリティ強化の具体例を紹介。
1年前
記事のアイキャッチ画像
Elasticsearchのインデックス切り替えを無停止で行えるようにしました
kickflow Tech Blog
こんにちは。エンジニアの森本です。 テキストでの全文検索はどのような仕組みを利用されていますか? kickflowでは、全文検索エンジンとしてElasticsearchを使っています。これまでは、1つのインデックスで検索を行っていたため、マッピングの変更時にダウンタウンが発生してしまう問題がありました。そのため、マッピング変更時には計画メンテナンスを設けてインデックスの再作成を行っていました。しかし、データ量が増え続けていること、これからもインデックスのマッピング変更が発生することを考えてメンテナンス期間を設けずにインデックスの再作成が行える仕組みを導入しました。 どのような仕組みを導入したの…
1年前
記事のアイキャッチ画像
Nuxt 3への移行がもうすぐ終わりそうです
kickflow Tech Blog
こんにちは、CTOの小林です。年々歳をとるにつれて、1年がどんどん短く感じるようになってきました。12月なんて体感で3日くらいしかないような気がします。 「師走」ということで、Stable Diffusionで生成した「走る師匠」の画像 kickflowではこの1年は通常の機能開発と並行して、Nuxt 2から3へのバージョンアップを行っていました。本格的な移行作業は今年の10月ぐらい始めたのですが、移行のための調査や事前準備はNuxt 3がリリースされた2022年の11月から開始しているので、1年以上かかった長期プロジェクトとなります。今日はNuxt 3へのバージョンアップにkickflowが…
2年前
記事のアイキャッチ画像
Rails / PostgreSQL環境での連番の実装方法
kickflow Tech Blog
こんにちは。株式会社kickflow・プロダクト開発本部の小本です。 今回は連番の実装方法についてです。
2年前
記事のアイキャッチ画像
「JSON Schemaを知っている」人のための今どきJSON Schemaの紹介記事
kickflow Tech Blog
最近はティラノサウルス科恐竜には羽毛があったとするのが定説(本文には関係ありません) こんにちは。株式会社kickflow・プロダクト開発本部の小本です。 最近、「設定をJSONファイルとしてエクスポート・インポートする機能」を実装する際にJSON Schemaをウン年ぶりに使いました。その際、私のJSON Schema観がジュラ紀のまま止まっていたことに気づいたので、最新のJSON Schemaにどんな機能が追加されているか、触りだけ紹介します。
2年前