Your site is broken for someone right now โ and without error reporting, you'll never know. The safety nets:
The two global handlers
// synchronous errors anywhere
window.addEventListener("error", (e) => {
logError({ msg: e.message, src: e.filename, line: e.lineno });
});
// rejected promises nobody .catch()ed โ the modern blind spot
window.addEventListener("unhandledrejection", (e) => {
logError({ msg: String(e.reason), type: "promise" });
});A DIY logger (20 lines, free)
const seen = new Set();
function logError(info) {
const key = info.msg + info.line;
if (seen.has(key)) return; // don't spam duplicates
seen.add(key);
navigator.sendBeacon("/api/errors", JSON.stringify({
...info,
url: location.href,
ua: navigator.userAgent,
time: Date.now(),
})); // sendBeacon survives page unloads; fetch might not
}A tiny PHP/Node endpoint appends to a log file โ review weekly, fix the top recurring error. This loop is 80% of what paid tools do.
The graduation path
Real products use Sentry (generous free tier): source-mapped stack traces, grouping, release tracking, user context. Resume line either way: "implemented frontend error monitoring" โ it signals production thinking, which is exactly what separates fresher candidates.