こんにちは、ずっきーです！普段、Cursorを使って開発業務を行っているのですが、10月末に「Cursor 2.0」がリリースされ、最大8つのエージェントを並列実行できる「マルチエージェント機能」や Cursor独自のコーディングモデル「Composer 1」が使用可能になったりなど嬉しい機能が追加されました。それらの新しい機能の中で今回はAgentがウェブブラウザを操作できる「ブラウザ機能」(以前からベータとしてはありましがCursor 2.0でGA）を使って要素を直接選択してUIの修正を試してみたいと思います👌https://cursor.com/ja/changelog/2-...

こんにちは、terandard です。先日 Rails 8.1 がリリースされましたね。それに合わせて弊社のサービスを Rails 7.2 から 8.0 にアップデートしましたが、その際に発生した問題について共有します。 概要Rails 7.2 で導入された新機能として、Active Record のトランザクション内でジョブのエンキューを行うと、そのトランザクションがコミットされた後にジョブがエンキューされるようになりました。https://railsguides.jp/v8.0/7_2_release_notes.html#ジョブがトランザクション内でスケジューリングされ...

こんにちは、steshima です。クエリパラメータを state として扱い、簡単に URL と同期できる nuqs を紹介します。https://nuqs.dev/執筆時の nuqs のバージョンは 2.7.2 です。 nuqs についてnuqs は URL のクエリパラメータをフックで扱えるようにするライブラリです。React の useState と同じ感覚でクエリパラメータを読み書きでき、URL・ブラウザ履歴・React の状態を自動で同期してくれます。 nuqs 導入前の課題ソーシャル PLUS では、テーブルのページネーションが存在する画面ではページ番号...

こんにちは、simomu です。今日は Puma で処理待ちのまま待機しているリクエストと Puma.stats で確認できる backlog の値の関係を、Puma がワーカースレッドでリクエストを処理するまでの実装を踏まえて調査した話をします。以降は基本的には Puma 6.6 時点での話とし、Puma はシングルモードで使用している前提の話とします。また、最後には Puma 7.0 以降での backlog がリクエストを追加される挙動の変化について話します。 調査の経緯弊社では Ruby on Rails のアプリケーションサーバーとして Puma を使用しています。...

こんにちは、koyablueです。ずっと積読していたOAuthの本を最近読んだのですが、「リダイレクトURIにリダイレクトされる時に認可コードの漏洩リスクがある」ということが書かれていました。どのような仕組みで漏洩するのか、漏洩すると何がまずいのか、漏洩した場合に不正なリソースアクセスが可能になるのか...などに興味が湧いたので、実際に手を動かして理解を深めてみることにしました。今回は簡易的な認可コードグラントのフローを実装し、どのように認可コードが漏洩するのかをローカル環境で確認します。また、認可コードに加えてclient_secretが外部に露出してしまったら...という想定で...

概要Amazon EC2 スポットインスタンス は最大 90% という大きなコスト削減メリットを持つ一方で、突然のインスタンス中断（Spot Interruption） というリスクがあります。可用性を維持しながらスポットインスタンスを取り入れるには「どの Pod をスポットインスタンスに載せるか」「スポットインスタンスとオンデマンドインスタンスの比率をどう維持するか」「偏ったらどう直すか」まで設計に組み込む必要があります。本記事では弊社で実践した以下のアプローチを紹介します。安全に停止できる Pod のみスポットインスタンスにスケジューリングスポット / オンデマンド ...

Google タグマネージャー（以下、GTM）でちょっとハマったので、記事にしておこうかと思います。 type="module" な script 要素は実行されないGTM の「カスタム HTML」で<script type="module" src="/foo.js"></script>のように設定したとします。この場合、/foo.js のスクリプトが実行されるかと思いきや、実際には実行されません。ちなみに type="module" をつけずに<script src="/foo.js"></script>とすれば、期待...

こんにちは otsubo です。MySQL (InnoDB) のロックについて整理する機会があったので記事にします。 はじめに全ての ロックタイプ を網羅するのは大変なため、レコードロックギャップロックネクストキーロックを中心にまとめます。この3つはトランザクション内で UPDATE、DELETE、 SELECT ... FOR UPDATE / SHARE するときに獲得されるロックです。INSERT 時のインサートインテンションロックもちょっとだけ扱います。テーブルロックやメタデータロックは扱いません。InnoDB ではクエリによって特定の「範囲」がロックされるこ...

こんにちは Social PLUS のフロントエンドエンジニアのまっくすです。先日、Storybook を v7 → v8 にアップデートをしていた際に、Vitest のテストファイルに Storybook 用のモジュール@storybook/testing-library が紛れていたことに気がつきました。Storybook のアップデートに際して、@storybook/testing-library を @storybook/test に統合するために、@storybook/testing-library を devDependencies から削除したことで、Lintエラーが発...

はじめにこんにちは、terandard です。「新機能開発をお願いします。規模としては結構デカいです。」「システムの大幅リニューアルのために、深夜メンテナンスが必要なので対応してください。」こうした依頼を受けた瞬間、頭の中に様々な疑問や不安が浮かんできませんか？「工数はどのくらいかかるんだろう？」「本当に自分にできるのか？」「何から手をつければいいんだろう？」 などなど。大規模なタスクを前にすると漠然とした不安を感じるのは、エンジニアなら誰しも経験があるかと思います。先日大規模なタスクを任された際、私も同じように不安を感じました。現在はそのタスクを無事に終わらせることが...

だれだれがいくら売上をあげたなどを発表して競争関係で組織を運営している組織と同僚を信頼して協力して仕事をこなしていく信頼関係で組織を運営している組織。エンジニアだと、会議などでのマウントの取り合いや、どのエンジニアが優れているかを成果などで比較したりすることもあったり、競争関係を促す仕組みや雰囲気をもっている組織もあったり。競争関係の組織においては、緊張感があり、そのおかげで集中力が高く個々人のパフォーマンスが高く、なんでも一人でできる強強のエンジニアがあつまる感じ。一方、信頼関係の組織においては、問題が発生したらすぐに共有して、いろいろな知識や見方で問題に当たることができています。...

こんにちは、st-1985 です。Rails アプリケーションでは、モデルの属性変更を検知する際に saved_change_to_attribute? メソッドを使用できます。ただしこのメソッドは「直前の保存によって変化したか」を返します。そのことによって思わぬ落とし穴にはまってしまったので、今回はその経験を共有したいと思います。 問題の概要開発しているアプリケーションには以下のようなフォロー状態の属性を持ったユーザーデータが存在しています。以前からフォロー状態になっている新しくフォロー状態になったそれぞれのフォロー状態に応じて画面の表示を変化させていました。問...

こんにちは、tsub です。2023 年 11 月から育休を取得していて今年の 5 月に復職しました。今回が Social PLUS Tech Blog への初投稿となります 😄この数ヶ月間、徐々に tfaction の導入を進めていました。元々 Terraform の CI/CD は GitHub Actions で自前のパイプラインを組んでいましたが、通常の開発タスクを優先しつつ隙間時間で CI/CD の改善を行っていたため、段階的に移行する形となりました。この記事では tfaction を導入した背景や、どのように導入を進めていったかについて説明したいと思います。 tfac...

はじめにこんにちは、hamaguchi です普段仕事ではバックエンドエンジニアとして Ruby on Rails を使ったウェブサービスの開発を行なっていますが、プライベートで色々作ったりする中ではバックエンドだけではなくフロントエンドやインフラの領域も触らざるを得ないため色々と勉強中です特に TypeScript は慣れておくと便利そうだけどあんまりよくわかっていないので早めに仲良くなっておきたいなと思っています最近のブラウザは外国語のページを開くと「翻訳しますか？」と聞いてくれたりしますよね？ここでの翻訳は誰がやっているのかというと、ブラウザ自身が行なっているわけではな...

こんにちは、okumudです。フロントエンドのスクリプトを絡めて機能を任意サイト (別ドメイン) へ提供するにあたり、 CORS (オリジン間リソース共有: Cross-Origin Resource Sharing) の origin[1] を動的に判断させることがありました。本記事では rack-cors gem を使用して動的に判定する方法を紹介します。 はじめに CORS とはブラウザーはセキュリティ上の理由でスクリプトから異なる origin へのリクエストを制限しています。フロントエンドのスクリプトを絡めて機能提供を行うとき、スクリプトの実行がブロックされて...

どうもこんにちは、たくびーです。!この記事はAIを使わずに書かれています。弊社ではいくつかのアプリケーションが存在し、それらをモノレポで管理しています。今回はそのうちの1つのアプリケーションをReact + WebpackからNext.jsへ移行を行いました。 動機弊社にはいくつかのアプリケーションがあります。ここでは話を簡単にするために以下のようにしたいと思います。app1(Next.js Pages Router)app2(Next.js Pages Router)app3(React + Webpack) きっかけapp3以外のアプリケーションはNe...

こんにちは！Reactを普段使っていて、「これって中で何が起きてるの？」と思ったことありませんか？今回は、Reactの超ミニマル版「MiniReact」を自作してみます。全部JavaScriptで作ります。難しい依存関係はナシ！対応している機能はこちら：関数コンポーネント ✅useState()（複数呼び出し対応）✅JSXっぽい記法（h()関数）✅仮想DOMからの描画 ✅なんと100行以下！ なぜ作るの？Reactはすごく便利だけど、中身はちょっとブラックボックス。シンプルなReactを自作すると、次のような仕組みがスッキリ理解できます：...

Ruby を使用したコーディングではディレクトリに応じた module を定義することが多いと思います。例えば Rails で app/controllers/examples_controller.rb のようなコントローラーがあり、これの置き場所について controllers ディレクトリ直下ではなく、v1 ディレクトリを挟みたいとなったとします。その場合 app/controllers/v1/examples_controller.rb にリネームした後、ファイル内では module V1 の階層を増やすことになると思います。このとき、ファイルのリネームとファイル内の修正で...

リファクタリングをしていて、ガッと数十ファイルにわたって一括で書き換えたいような場面、みなさんもありますよね？ 場合によっては数百かもしれません。（「そんなに広範囲に影響する時点で設計が悪いのでは？」という指摘はあるかもしれませんが、この記事では横に置いておきます。）この記事は、「AI に codemod を書かせて、それを実行すると書き換えが楽ですよ」というお話です。codemod のことを全く知らなくても、AI に書いてもらえば今日から使っていけるはずです。やることは簡単で、要は以下の手順を回すだけです。「これをこう書き換える codemod を作って」と AI にお願いする...

masaki です。先日は「Dev Container で起動した Claude Code から Hooks でホストの Mac に通知する」という記事を書きました。https://zenn.dev/socialplus/articles/ea9be95301ae99今日は先日に引き続き、Claude Code と Dev Container の話題です。先日の記事の内容と共通する部分があるため、先日の記事に興味を持っていただいた方は今日の記事にも興味を持っていただけるかもしれません。 この記事で得られるものClaude Code (コンテナ) と Neovim (ホスト...