レコチョクのエンジニアブログ
https://techblog.recochoku.jp
最新のIT技術を駆使して音楽関連サービスを展開しています。日々の活動内容から得た知識をお届けする開発ブログです。 We're using the latest IT and we are developing music service.The developers blog which we'll report the knowledge we got from the daily activity contents.
フィード

GitHub Copilotの自動コードレビュー機能を設定してみよう
レコチョクのエンジニアブログ
<p><img width="200" height="200" src="https://techblog.recochoku.jp/wp-content/uploads/2025/08/github_copilot-200x200.png" class="attachment-thumbnail size-thumbnail wp-post-image" alt="" /></p><h1>はじめに</h1>こんにちは、NX開発推進部プロダクト開発第1グループの本多啓路です。Androidエンジニアとして日々開発を行っております。最近、GitHub Copilotの自動コードレビュー機能を自分が関わっているプロジェクトに対して設定しました。今回はこの自動コードレビュー機能の設定方法について紹介します。<h2>GitHub Copilotとは</h2>GitHub Copilotは、GitHub社が提供するAIコーディングアシスタントです。<br />エディター上でコメントやコードを入力するとAIが続きのコードを推測し提案してくれるため、開発効率が大きく向上します。かく言う私もGitHub Copilotには、日々の開発でお世話になっています。<h2>GitHub Copilotの自動コードレビュー機能</h2>GitHub Copilotはコード補完だけでなく、Pull Requestのコードレビュー機能も存在します。PR作成時にAIがコードの変更点を分析し、レビューコメントを生成してくれるため、レビューの質や効率を向上させたい開発チームにとって、非常に便利な仕組みになっています。コードレビューを行ってもらう手順自体は簡単で、レビュワーにGitHub Copilotを指定するだけです。<img src="/wp-content/uploads/2025/08/copilot_reviewer.png" width="50%" style="border: solid 1px #888">こちらはリポジトリ内で設定をすることによって、レビュワーにGitHub Copilotを指定する手間を省くことが可能です。自分が行った設定方法を紹介します。<h3>コードレビュー機能を自動化する手順</h3><h4>1. リポジトリのSettingsへ移動します</h4><h4>2
1ヶ月前

Helix Editorで作業速度を上げよう
レコチョクのエンジニアブログ
<p><img width="200" height="200" src="https://techblog.recochoku.jp/wp-content/uploads/2025/08/communityIcon_zp9m64dj1r3a1-200x200.png" class="attachment-thumbnail size-thumbnail wp-post-image" alt="" /></p><h1>はじめに</h1>こんにちは。レコチョクでバックエンドエンジニアをしている小河です。Vimのようなエディタに馴染みがないというような方に向けてVimライクなエディタである<a href="https://helix-editor.com/">Helix Editor</a>(以降Helix)を紹介します。具体的に以下の方向けの記事です。<ul><li>リモートホストを使う時に止むを得ずVimを使う程度だが、こういうエディタを使えた方がなんだかんだ良いんだろうなと思う方</li><li>ショートカットを覚えてコーディングの速度を上げたいが、どうにも面倒でショートカットが覚えられない方</li><li>Vimを覚えようとしたが、コマンドを覚えるのが難しくて挫折した方</li></ul>本記事はHelixのバージョン<a href="https://github.com/helix-editor/helix/releases/tag/25.07.1">25.07.1</a>に準拠しています。<h1>要約</h1><ul><li>Vimライクなエディタを使うことにより操作速度を向上できるし、その習慣を強制的に身につけさせられる</li><li>HelixはVimと比べて...<ul><li>操作体系に合理性があり操作ガイドもあるため、コマンドを覚えやすい</li><li>LSPが標準搭載されており、楽に開発をスタートさせられる</li><li>拡張機能システムが未実装であることもあり、足りない機能もいくつか存在する</li></ul></li></ul><h1>Helixとは</h1><a href="https://kakoune.org/">Kakoune</a>や<a href="https://neovim.io/">Neovim</a>に影響を受けた
1ヶ月前

負荷試験フレームワークTaurusを実務で使って分かった利点とか
レコチョクのエンジニアブログ
<p><img width="200" height="200" src="https://techblog.recochoku.jp/wp-content/uploads/2025/08/Taurus-200x200.jpg" class="attachment-thumbnail size-thumbnail wp-post-image" alt="" /></p><h1>はじめに</h1>システム開発第3Gの小河です。BlazeMeter社が提供する<a href="https://gettaurus.org/">Taurus</a>は、オープンソースの負荷試験フレームワークです。実務上で何度かTaurusを利用してきました。それをもとにTaurusの利点、欠点などを紹介し、最終的にどういう場合にTaurusを使うべきかを記載します。<h1>Taurusとは</h1>Taurusは、JMeter、Locust、Gatling といった既存の負荷試験ツールをバックエンドとして利用できるフレームワークです。既存の負荷試験ツールの一枚前にファサードとしてTaurusが置かれているというイメージです。<h1>Taurusの利点</h1><h2>YAML形式でシナリオを記述できる</h2><ul><li>複雑なGUIと格闘したり、知らないプログラミング言語でシナリオを書く必要がない</li><li>YAML形式なのでバージョン管理が容易</li></ul>このようなYAMLファイルを書くことになります(実務で利用したものをベースに一部改変したものです)。特に知らなくても比較的わかりやすいのではないかと思います。[crayon-68dfe5427dee8160001210/]<h2>環境構築の容易さ</h2>Taurusを直接ホストOSにインストールして利用できますが、Dockerコンテナ上で実行させることもできます。Dockerコンテナ上で実行するため(例えば)Javaや各テストツールをインストールすることなく、以下のコマンドだけで負荷試験を実行できます。[crayon-68dfe5427def1342846126/]<h2>自由に負荷試験ツールを選択できる</h2><ul><li>バックエンドとして利用するツールの(JMeter/Locust/Gatling など)に
1ヶ月前

スマホで布団の中から開発
レコチョクのエンジニアブログ
<p><img width="200" height="200" src="https://techblog.recochoku.jp/wp-content/uploads/2025/08/sleep_futon_smartphone_man-200x200.png" class="attachment-thumbnail size-thumbnail wp-post-image" alt="" /></p>最近感動したものが2つあります。一つは話題のClaude Codeで、これによって自分で手を動かすことが大きく減りました。もう一つが、Android 15にLinuxターミナルアプリが標準搭載されたことです。debianベースのLinuxが違和感なく普通に動作します。そこで、「これ組み合わせたらスマホだけで開発作業完結できるのでは?」と思ったので試してみました。(※以下、個人端末×個人開発で試した内容となります)<h1>Android 15のLinuxターミナルの導入</h1>「開発者向けオプション」「デバッグ」「Linux開発環境」と進み有効化するとターミナルアプリが利用できるようになります。(※開発者向けオプションが有効になっていない方は、まず<a href="https://developer.android.com/studio/debug/dev-options?hl=ja">こちら</a>を参考に有効にしてください。)(※現状はPixelのみのようで、今後Pixel以外にも展開予定だそうです)<h1>プロジェクトの環境構築</h1>ターミナルが起動したら、あとは普通のLinux環境となりますので、gitやらをインストールして自身のプロジェクトの環境構築を行います。アプリケーションを起動すると該当のポートの許可が求められ、許可するとブラウザからアクセスできるようになります。<h1>VSCodeのインストール</h1>GUIのコードエディタが欲しいので、ブラウザで動作するVSCodeを導入します。[crayon-68dfe5427e9b3448965027/]<a href="http://localhost:8080">http://localhost:8080</a> でVSCodeが動作します。アクセス時に求められるパスワードは[crayon-68
1ヶ月前

WebアプリをAWS Lambdaにデプロイしよう!
レコチョクのエンジニアブログ
<p><img width="200" height="200" src="https://techblog.recochoku.jp/wp-content/uploads/2025/08/lambda-200x200.png" class="attachment-thumbnail size-thumbnail wp-post-image" alt="" /></p><h1>はじめに</h1>システム開発推進部 システム開発第4グループの川又です。最近はめっきり暑くなり、夏本番といった感じですね。今回はAWS Lambdaに関する内容です。Lambdaを使ったサーバーレスアーキテクチャは、コストやスケーラビリティの面で非常に魅力的です。しかし、Lambdaを利用する場合には特有の実装や知識が必要になり、学習コストがかかったり移植性が低くなってしまうことがあります。慣れ親しんだフレームワークを使って実装しつつ、Lambdaのメリットを享受できたら嬉しいですよね。そこで今回はAWS Lambda上でWebアプリをほぼそのまま動かすことができるLambda Web Adapter(LWA)を試してみようと思います。また、コールドスタートを高速化する方法も試してみます。<h1>目次</h1><ol><li>Lambda Web Adapter(LWA) とは</li><li>実際に動かしてみる<ol><li>Expressアプリの作成</li><li>Dockerfileの準備</li><li>AWSリソースの作成</li><li>ビルド&プッシュ&デプロイ</li><li>動作確認</li></ol></li><li>コールドスタート対策をしてみる<ol><li>esbuildでバンドルする</li><li>インポートするパッケージを増やす</li><li>初期化処理の最適化</li></ol></li></ol><h1>Lambda Web Adapter(LWA)とは</h1><a href="https://github.com/awslabs/aws-lambda-web-adapter">Lambda Web Adapter(LWA)</a>は、AWS Lambda上でWebアプリを簡単に実行できるようにするためのツールです。LWAを使用すると
2ヶ月前

M5StickC PlusのIMUを取得してみる
レコチョクのエンジニアブログ
<p><img width="200" height="200" src="https://techblog.recochoku.jp/wp-content/uploads/2025/08/m5_logo-200x200.png" class="attachment-thumbnail size-thumbnail wp-post-image" alt="" /></p><h1>M5StickC PlusのIMUを取得してみる</h1><h2>概要</h2>M5Stickに触れる機会があり、それを用いて何かしらのものを作れないかという話になったので、M5Stickの6軸IMUを取得してみることにした。この処理が実装できると、M5Stickを搭載したモノを移動させたりすることでその動きをプログラム側に反映させることができるため、M5Stickを埋め込んだ銃の様なものを作成し、プログラム側で的を用意し射的を再現できるのではないかと考えている。本記事では、IMUのデータを安定して取得するために行なった実装とそれに伴い発生した課題への対処に関して記載する。<h2>環境</h2><ul><li>M5StickC Plus</li><li>Arduino IDE</li><li>MacBook Pro M1</li></ul>※今回の記事ではArduino IDEの導入やM5Stickの設定は省略している。<h2>実装</h2><h3>M5Stick</h3>M5Stickに搭載されているIMUから情報を取得し、その情報をシリアル通信で送信する処理を実装する。M5Stick上には現在取得している座標の情報がディスプレイ上で表示される様にする。また、ボタン押下時にはIMUの取得情報をリセットする。<h4>ライブラリ準備</h4>M5UnifiedをArduino IDEのライブラリマネージャーから検索してインストールする。<h4>コード1</h4><h5>setupと変数定義</h5>[crayon-68dfe54280f31389754122/]<h5>loop</h5>[crayon-68dfe54280f38187033835/]<h5>データを送信する部分</h5>外部システムとの連携用にJSON形式でデータを送信できる様にしておく。[crayon-68dfe54280f
2ヶ月前

安全にバイブコーディングできていますか? ─ Gitleaks と AWS CDK MCP Servers で始めるセキュアなAI開発
レコチョクのエンジニアブログ
<p><img width="200" height="200" src="https://techblog.recochoku.jp/wp-content/uploads/2025/08/secure-200x200.png" class="attachment-thumbnail size-thumbnail wp-post-image" alt="" /></p><h2>本記事の対象読者</h2><ul><li>Cursor などの AI ツールを活用した開発を行っているエンジニア</li><li>AWS CDK を使って IaC 開発しているエンジニア</li></ul><h2>はじめに</h2>レコチョクのシステム開発第1グループに所属している山根と申します。普段は OpenAI・Anthropic (Claude)・Google (Gemini) のモデル等に対応したチャット基盤を運営・開発しております。弊社では、AIツールの積極利用および検証に努めております。<h2>概要</h2>生成AIを活用した<strong>バイブコーディング</strong> (AIと対話しながら進める開発) を取り入れるエンジニアも増えてきている一方で、コードやIaC (Infrastructure as Code) における「うっかりしたセキュリティの事故」も増加傾向にあると思います。事実、GitGuardian社(ソースコードに含まれるAPIキーなどの機密情報を検知するセキュリティサービスを提供する企業)の「State of Secrets Sprawl」レポートによると、<strong>2024年に2,380万件の秘密情報が漏洩</strong>し、今年はさらに前年比の25%も増加したと報告されています。さらに驚くべきことに、<strong>2022年に漏洩した秘密情報の70%が現在も有効</strong>というデータも報告されています<a href="https://blog.gitguardian.com/the-state-of-secrets-sprawl-2025-pr/">¹</a>。本記事では、次の2つの代表的なリスクと、それに対する実践的な対策方法を紹介します。<ul><li>Git に誤って秘密情報を含めてしまうリスク → [crayon-68dfe5
2ヶ月前

MCP SDKを使ってシンプルなMCPサーバーを作ってみよう
レコチョクのエンジニアブログ
<p><img width="200" height="200" src="https://techblog.recochoku.jp/wp-content/uploads/2025/04/MCP.png" class="attachment-thumbnail size-thumbnail wp-post-image" alt="" /></p><h2>はじめに</h2>こんにちは、システム開発第1グループの清水です。普段は主にPHPを利用して、「レコチョク」等の単曲販売サービスを担当しています。システム開発第1グループではAI活用の取り組みに力を入れており、様々なAIコーディングツールやAIサービスの利用・検証を推進しています。今回はそういった活動の一環として、シンプルなMCPサーバーを作ってみることに挑戦したので、記事としてまとめたいと思います。<h2>そもそもMCPとは?</h2>MCPについてそれほど詳しくない読者もいるかと思いますので、まずはMCPの概要を説明します。<strong>MCP</strong>とはModel Context Protocolの略であり、LLMに対してデータ(コンテキスト)を渡すための標準規格を指します。開発元のAnthropic社はこれを 「AIアプリケーションのためのUSB-Cポート」と例えており、LLMとコンテキストを提供するサーバーの接続方法と言ってもよいでしょう。<h2>MCPサーバーとは?</h2>MCPという規格を利用して通信を行う際には、3つのコンポーネントが必要です。1つ目が<strong>MCPホスト</strong>。これはMCPを利用するアプリケーションのことで、Claude Desktop, Cursor, GitHub Copilotなどが該当します。2つ目が<strong>MCPクライアント</strong>。これは通信を担当するシステムです。この後説明するMCPサーバーとの通信を行い、情報のやり取りを担当します。3つ目が<strong>MCPサーバー</strong>。これはMCPの規格を使って、特定の機能をMCPホストに対して公開するプログラムです。Web APIのAIアプリケーション版だと思ってもらえば概ね合っていると思います。MCPサーバーのプログラムはLLMの要求に応じて外部ソースなどに
2ヶ月前

全く知らない技術をChatGPTと触ってみた
レコチョクのエンジニアブログ
<p><img width="200" height="200" src="https://techblog.recochoku.jp/wp-content/uploads/2023/06/chatgpt-icon-200x200.png" class="attachment-thumbnail size-thumbnail wp-post-image" alt="" /></p><h1>はじめに</h1>NX開発推進部プロダクト開発第1G の寺島です。普段はAndroidアプリの開発を行ってます。最近生成AIによるコーディングがめざましい発展をしています。私も生成AIをAndroidアプリ開発に関するコーディングで活用しています。しかし、未知の技術領域でChatGPTを使った経験がなかったため、今回は「まったく知らない技術をChatGPTと二人三脚で触ってみる」というテーマで、試行錯誤の過程を記事にします。自分がChatGPTを使いながら、やりたいことを実現した際の流れを紹介できればと思ってます。今後生成AIを使って、触ったことのない技術に挑戦しようとしている方々(エンジニア・非エンジニア問わず)の参考になれば幸いです。<h1>ChatGPTを使って実現したいこと</h1>私は家ではWindowsを使っています。Windowsを使っている際に、少し困っていることがあります。それはディスプレイの配置を設定することです。Windowsでは [crayon-68dfe54283d82040642010-i/] から以下のような画面を開くことができます。<div align="center"> <img src="/wp-content/uploads/2025/07/e941a17868027f989a30d5bb329d970a.png" width="500" /></div>この画面でディスプレイの配置を設定できます。たとえば、ディスプレイ2を横に切り替えます。その時、切り替えた直後に設定を反映するために、「変更の維持」ボタンをおさないといけません。<div align="center"> <img src="/wp-content/uploads/2025/07/a306b9c5793075f2b2e6ca4c107a98bd.png" width="500"
3ヶ月前

GitHub Actionsを駆使したカバレッジの自動計測と差分レポート生成
レコチョクのエンジニアブログ
<p><img width="200" height="200" src="https://techblog.recochoku.jp/wp-content/uploads/2025/06/GitHub-Actions-200x200.png" class="attachment-thumbnail size-thumbnail wp-post-image" alt="" /></p><h2>はじめに</h2>NX開発推進部プロダクト開発第1G の杉山です。Androidエンジニアとして日々開発を行っております。ここ一ヶ月の週末の内、名古屋を3往復もしており、一体どこ住みなのかと皆に聞かれている次第です。<del>そろそろ名古屋に別荘でも持つべきかと悩んでいます。</del>そんなことはさておき、近年社内の取り組みとしてアプリの品質改善を強化しており、リリース前のテストはもちろんのこと日々の開発の中でUT(ユニットテスト)の拡充を行っております。今回はそのUTのカバレッジをGitHub Actionsを使ってブランチごとに計測し、差分を算出できるようにしました。<h2>背景</h2>差分を算出しようと考えた背景として、UTの作成が十分に意識されず、見逃されたり後回しにされたりする現状があります。この状況を改善し、UT作成への意識をより強化したいと考えました。以前から、PR時にカバレッジの計測は行われており、マージ後のカバレッジを把握することは可能でした。しかし、個々のPRによって具体的にどの程度カバレッジが上昇したのかを把握することができず、UTの実装が不十分だった場合にPRの段階で検出できるようにはなっていませんでした。そのため、GitHub Actionsを用いてこれを改善し、実装しました。<h2>実現したいこと</h2>今回実現したいことは以下の3つになります。<ul><li>PR対象のターゲットブランチ(developブランチ)とソースブランチ(featureブランチ)それぞれのカバレッジを算出する</li><li>各ブランチのカバレッジをファイルに保存して参照できるようにする</li><li>各ファイルを用いてカバレッジの差分算出をする</li></ul>上記を実現することで、PRの段階でカバレッジの差分を見てUTの実装ができているかどうかを確認することが
3ヶ月前