JSライブラリを1日1つ紹介する
今日から1日1つJSのライブラリを紹介していきたいと思います。
先日1on1で私があまりJavaScriptについて理解できていないことを上司に相談したところ、「会社で使っているJSライブラリを1日1つみんなに紹介してみてはどうか」というご提案をいただきました。
やることは以下です。
① ライブラリに関するドキュメントを最初から最後まで読む
② 実際に使ってみる
③ ライブラリを3行で説明する
本日は、@Sentry/browserのドキュメントを読んで実際に使っていきたいと思います。
ドキュメント
今回読んだドキュメントはこちらです。
Sentryとは、ログ収集ツールのことです。
今回取り上げた@Sentry/browserを使うとアプリケーションのログが監視できるようになります。
実際に使う
ざっくり内容もわかったところで、@Sentry/browserを私が個人的に運営しているEscolaで試してみようと思ったのですが、JavaScriptはRailsから使用しているので使えなかったです...😭
とりあえずアカウント登録だけしたので、今度webpackかwebpackerを導入してからこのブログに追記していこうと思います🙇♀️
ちなみにアカウント登録は、以下のページからGithub経由で登録しました。
ここでJavaScriptを選択できないことに気づきました😭
導入すると、Sentry上でアプリケーションのエラーが見られるようになるみたいです。
3行でまとめる
@Sentry/browserを導入すると、
- イベントログをSentry上でみることができる
- （今回はJSライブラリとして紹介したが）様々な言語で使用できる
- ユーザーの行動記録も取得できる
フィードバック
Sentryなどのerror reportツールは二つの使い方を覚えておくと良い。
- エラーが起きたときにどこかでキャッチして送る方法
例えばErrorBoundaryというComponentでキャッチする方法。
Reactのドキュメントでも解説されているので、読むと良い。
https://ja.reactjs.org/docs/error-boundaries.html
- 自分でエラー通知を送る方法
SentryだとcaptureException と captureMessage の二つがある。実際にはエラーでなくてもSentryに情報を送ることができるので、例えば deprecatedなメソッド（非推奨なメソッド？）があってどこから呼ばれてるかわからないので呼ばれたら通知するようにしてみようという使い方ができる。
- Sentryのライブラリには、raven-jsというライブラリもある。公式のBlog Announcementがあるので読んでみる。
https://blog.sentry.io/2019/11/13/deprecating-our-legacy-javascript-sdk
- JSライブラリの試し方
codesandbox.ioでもいいし、空のindex.htmlを使ってlocalhostで動かしてhttps://unpkg.com/で読み込んだ上で chrome console 上で実行するとかでも十分。
以上です！
初回少し残念な感じになってしまいましたが、明日も頑張ります。
