Social PLUS Tech Blogのフィード
https://zenn.dev/p/socialplus
株式会社ソーシャルPLUS 開発チームの技術ブログです。
フィード

ShopifyアプリのインストールフローをManaged Installに移行した話
Social PLUS Tech Blogのフィード
はじめにこんにちは、masaki です。現在ソーシャルPLUS では CRM PLUS on LINE という Shopify アプリを開発し、公開しています。CRM PLUS on LINE は一言でいうと、「SNS連携機能やLINE配信機能をShopifyストアに組み込めるアプリ」 です。詳しくは以下をご覧ください。https://crmplus.socialplus.jp最近、このアプリの Shopify ストアへのインストールフローを、従来の認可コードフローから 2024年1月に Shopify が発表した Managed Install へ移行しました。htt...
6日前

【ActiveRecord】 inverse_of の自動推論によって別モデルが返ってきた話
Social PLUS Tech Blogのフィード
こんにちは、st-1985 です。先日、「あるモデルの設定値が増えてきたので別モデルとして切り出す」という作業を行いました。その際に切り出したモデルを取得しようとすると別のモデルが取得されるという現象に遭いました。調べていくと原因は自動設定された逆関連付け(inverse_of)と別モデルの関連付けと重複しているというものでした。本記事では上記について書いていこうと思います。 背景:設定値が増えてきたので別モデルへもともと以下のようなSiteとそれに紐づく機能に対する設定のモデルがありました。class Site < ApplicationRecord ha...
21日前

教えるから助けへのシフト
Social PLUS Tech Blogのフィード
エンジニアの仕事において、私たちは日々「教え、教えられる」環境にいます。しかし、技術の進化が加速し、正解のない問いが増えている今、単なる「ティーチング(教えること)」だけでは限界が見え始めています。今、私たちが意識的にシフトすべきなのは、「教える」から「助ける」への転換です。一見似ているこの2つには、決定的な違いがあります。「教える」と「助ける」の構造的な違いまず、この2つのスタンスを整理してみましょう。項目教える(Teaching)助ける(Helping)関係性先生と生徒(上下関係)共に立ち向かうパートナー(並列関係)答えの所在教える側が既に...
21日前

TanStack Query v5で廃止された refetchPage の代替実装
Social PLUS Tech Blogのフィード
こんにちは、koyablueです。最近TanStack Queryのv4 → v5へのアップデート作業を行いました。その際、useInfiniteQueryのrefetchPageというオプションが廃止されており、v4までの「ページを選別してリフェッチする」という挙動をどう置き換えるべきか、いろいろと調査が必要になりました。この記事ではその調査内容と代替実装をまとめます。 useInfiniteQueryとはTanStack Queryが提供するフックで、無限スクロールや「もっと読み込む」など、ページを追加取得して積み上げていくタイプのUIを実装したい場合に使用されます。 ...
1ヶ月前

Argo CD の Pull Request Generator で構築している PR ごとのプレビュー環境の運用改善
Social PLUS Tech Blogのフィード
こんにちは、tsub です 😄弊社では以前から Argo CD の ApplicationSet と Pull Request Generator を使ってバックエンドリポジトリの PR 単位で独立した環境をデプロイできるプレビュー環境を構築しています。Pull Request Generator を使うと PR 単位で Argo CD Application を作成・削除できるためプレビュー環境の実装に非常に便利ですが、一方でバックエンドリポジトリの PR の状況に依存するため、インフラリポジトリの Kubernetes マニフェストを変更する際に、マニフェスト差分を CI で確認...
1ヶ月前

長時間 Job に対して job-iteration gem を利用した話
Social PLUS Tech Blogのフィード
okumud です。 はじめにRails で CSV 取り込みや外部 API 連携などの 長時間かかる Job を書いたことがある方は多いと思います。処理対象が少ない場合は問題なく動いている Job が、大量の処理を行ったときに以下のように落ちる経験はないでしょうか。デプロイ時に Job が中断されるJob 中断後、最初からやり直しになる弊社でもまさにこの問題に悩まされていました。本記事では、Rails 8.1 にまだ移行していない環境でも使える job-iteration gem を使って、 「中断されても困らない Job」を実装した話 を紹介します。Rails ...
2ヶ月前

【CircleCI】node_modules のキャッシュは node/install-packages に任せよう
Social PLUS Tech Blogのフィード
はじめにこんにちは、zomysan( https://x.com/zomysan )です。CircleCI で CI を回していると、ジョブ間でファイルを共有するために persist_to_workspace と attach_workspace を使っている方も多いと思います。install ジョブで node_modules をインストールし、それを後続のテストやビルドジョブに引き継ぐというパターンですね。ただ、この方法はファイルサイズが大きくなると保存や復元に時間がかかりボトルネックになることがあります。今回、persist_to_workspace から node_...
2ヶ月前

Shopify UI Extensions、裏では何が起きているのか
Social PLUS Tech Blogのフィード
Shopify UI Extensions、初見だとちょっと魔法っぽく見えます。React っぽいコードを書いたら、いつの間にか Shopify の Checkout や Admin の中に UI が生えている。iframe でもない別タブでもない普通に Shopify の画面の一部として存在している……いや、これ普通に考えて怖くない?実はこの仕組み、「とにかく DOM を触らせない」という、かなり割り切った設計で成り立っています。この記事では、Shopify UI Extension って何?なぜそんな厳しい制限があるの?裏で何が起きているの?それっぽいもの...
2ヶ月前

フロントエンドテストパフォーマンス改善:Vitestのボトルネックを探っていく
Social PLUS Tech Blogのフィード
どうもこんにちは、たくびーです。最近、CIにかかる時間が気になり、その手始めとしてテストの高速化に挑戦していました。今回はそこで得たボトルネックの特定方法と意外なボトルネックについて紹介したいと思います。 推測するな、計測せよかの有名なロブ・パイク氏の「Notes on Programming in C」の言葉を意訳したものです。Rule 2. Measure. Don't tune for speed until you've measured, and even then don't unless one part of the code overwhelms th...
2ヶ月前

Rails 8.0.2 で autosave の挙動が静かに変わった話
Social PLUS Tech Blogのフィード
Ruby on Rails のモデル同士の関連付けにおいて、親モデルの保存のタイミングで子モデルも一緒に保存するための設定として autosave オプションがあります。今回は、この autosave オプションの挙動が v8.0.1 → v8.0.2 で少し変わったため、その内容について書きたいと思います。autosave を内部で使用している accepts_nested_attributes_for を使っている場合も影響があります。 何が変わったかリリースノートでは以下のように説明されています。Fix autosave associations to no lo...
3ヶ月前

[Slack, Teams]リモートワークで活きる、何の話かすぐわかる書き方のススメ
Social PLUS Tech Blogのフィード
はじめに この記事についてリモートワークでテキストコミュニケーションをしていると、「これ何の話だっけ?」となることはありませんか? Issue番号だけ書かれたメッセージ、リンクのない相談、表記が揺れている説明などなど、当事者同士はわかっていても、後から見た人や周りの人には何のことかわからないことがよくあります。この記事では、「何の話かすぐわかる」テキストを書くための具体的な工夫を紹介します。書く行為は1回ですが、読まれる機会は複数回(×複数人)あります。書くときに1回頑張っておくだけで、読まれるたびに何度も効果が発揮されます。やってみましょう。 書かないこと以下につい...
3ヶ月前

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

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

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

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

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

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

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

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

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