こんにちは、stand.fm エンジニアの 外松(@toshi-toma)です。 stand.fmでは、Sentryをエラー監視に加えて、パフォーマンスの計測でも活用しています。 今回はSentryのPerformance Monitoringの活用方法について紹介します。特にReact Nativeやフロントエンド・クライアントの計測について扱います。 SentryでPerformance Monitoring SentryはアプリケーションのPerformance Monitoringを提供しています。 Web Vitalsや画面遷移、特定の操作完了までの時間などをSentryのダッシュボードで視覚的に確認したり、詳細な情報を見て分析することができます。エラーに関する情報は「Issues」タブを見てると思いますが、「Performance」タブから情報を確認できます。 既にSentry

RemixにRemix開発チームが推奨する技術スタックを利用したプロダクションレディなテンプレートをすぐに利用することができる新機能、Remix Stacksが追加されました。 はじめに こんにちは CX事業本部MAD事業部の森茂です。 2021/3/18 未明、Remixに「Remix Stacks」と呼ばれる新機能が追加されました。 Remix StacksはRemixチームが推奨する技術スタックを用いたプロダクションレディなテンプレートを簡単にセットアップできる機能です。また、これにあわせてCreate React AppのCustom TemplatesやNext.jsの--example-pathのようにGitHubリポジトリにあらかじめ用意したテンプレートを利用することもできるようになりました。 Remix Stacks 公式ドキュメントによると、Remix Stacksには以

こんにちは、FAANS部の田中です。普段は、WebのフロントエンドエンジニアとしてFAANSの開発を行なっています。 FAANSの由来は「Fashion Advisors are Neighbors」で、「ショップスタッフの効率的な販売をサポートするショップスタッフ専用ツール」です。現在正式リリースに向けて、WEARと連携したコーディネート投稿機能やその成果を確認できる機能など開発中です。プラットフォームとしてはWeb、iOS、Androidが存在し、今回取り上げるWebはショップ店長をはじめとした管理者向けツールという立ち位置です。 本記事では、FAANSのWebにおけるStorybook × MSW × Chromaticを使ったUIの影響範囲を自動検知するための取り組みを紹介します。 はじめに FAANSのWebはReact、TypeScriptで構成されています。設計に関しては、ロ