フロントエンドエンジニアがこれだけは知っておいて欲しい ~ 不具合調査について ~

Posted at 2022-12-25

はじめに

最近だと、フロントエンドから開発の世界の飛び込み、バックエンドやインフラは未経験という方もいらっしゃるかと思います。

バックエンドやインフラを知らなくても開発ができてしまう時代、だけど、不具合が起きた時に原因がわからない（バックエンドエンジニアに頼るしかない）というのが辛いときはありませんか？

僕も自分の知識不足を感じることが多々ありますが、インフラやバックエンドの経験もあるため、不具合が発生した時にどこに問題があり、どうすれば修正できるのかがなんとなくはわかったりします。

なので、今回は、フロントエンドエンジニアが知っておきたい不具合調査についてまとめようと思います。

ページが真っ白になっているのか、ユーザーが見えてはいけないコンテンツが見えているのか、表示が崩れているのか。
何がどのページで発生しているのか把握してください。

正確にわかるに越したことはないですが、ここに時間をかけるぐらいならSTEP2へいってください。

これはフロントエンドエンジニアに限らず、エンジニアの基本です。
不具合が発生したかもと思った瞬間、上司や関係各所に報告をしてください。

調査の基本は「調査しないで報告をすること」です。
結果、不具合じゃなかった。ならそれでいいじゃないですか。
不具合だったのに誰も報告していなかった。ということほど信頼を落とすことはありません。

これもできてない人が多いです。
「何が原因か」ということに集中しすぎて「何が発生しているのか」の把握を怠っています。

真っ白になっているのは本当にそのページだけですか？
STEP2の関係者というのは必要十分ですか？
個人情報が漏れるみたいなクリティカルな事象は本当に発生していないですか？

考えうる最大限、別の問題が発生していないか考えてください。

STEP2が重要。というのは関係者を増やすことで、この別の問題に気づきやすくするという意味もあります。
あなたの上司はあなたよりシステムや影響範囲に詳しい可能性が高い。だからまずは報告しましょう。

ここからはフロントエンドエンジニア特有で伝えたいことです。
不具合調査っていっても、フロントエンドしかわからないし、、という人はこれができていないことが非常に多いです。

問題がどこにあるのかを見極めましょう。

フロントエンドエンジニアがまず調査することは1や2の部分を疑い、調査すること。

フロントエンドといっても、SSRなどであれば、サーバーサイドの問題なのか、クライアントサイドの問題なのかも切り分ける必要があります。

最終的にはユーザーに誤った画面が出ているということは、エラーメッセージがどこかには出ているはずです。
エラーメッセージを見つけたら、バックエンドエンジニアやインフラエンジニアにも共有しましょう。

これだけでもめちゃくちゃ助かります。

これもできていない人が多いです。
不具合が起きた時、フロントエンドエンジニアができることはそこまで多くありません。

バックエンド的な問題だった場合や、インフラの問題だった場合、フロントエンドしか触ったことがない人より、専門的に普段から触っている人の方が早く調査が進むと思います。

でも、やることは終わりではありません。

非エンジニアに定期連絡をする。これがフロントエンドエンジニアにできることだと思います。

エンジニアが集まって解決してくれていることはわかるけど、何が起こっているのかわからない。非エンジニアの人たちは不安です。
なので、何が発生していて、どういう影響があって、今何をしているのかということを非エンジニアの方達に伝えてください。

何が起きているのか自分もわからなければ、「僕、ちょっとみんなに進捗を報告しておきたいので、今何が起こっているのか簡単に教えてください」と言ってみるといいと思います。

ここまでできれば、フロントエンドエンジニアとしての不具合調査完了です！

これもできていない人多いです。

結局、何が発生していて、どうすれば修正できたのか説明できますか？
不具合が終わった後にこれが説明できないのであれば、成長なしです。

バックエンド、インフラで起こったことであったとしても説明できるようにしましょう。
わからなかったらその周辺知識を勉強して、勉強した内容と相違ないか、ベテランエンジニアに話してみましょう。

今回はフロントエンドエンジニアに知っておいて欲しい不具合調査についてお話ししました。

不具合を0にすることは不可能です。
つまり、不具合調査とは切っても切れない関係にあるわけですね。

不具合が発生した時に、ぼーっとしなくていいようにしていきましょう。