In React Official doc when explain about Error Boundaries they encourage us to use JS error reporting services or build our own one. So I need to know is there any good error reporting service for React that you used, Is it easy to build that kind of thing then how or is it unless? thanks for your time.
1 Answer
Reacts error boundaries are components that catch JavaScript errors anywhere in their child component tree. They enable you to handle errors gracefully and display a fallback UI to users. Wrap components that might throw errors with the Error Boundary component to gracefully handle errors.
import React, {component} from 'react';
class Errorboundary extends component {
constructor(props){
super(props);
this.state = {hasError: false};
}
static getDerivedstatefromerror(error){
return {hasError: true};
}
componentdidcatch(error, errorinfo){
console.error('Error',error, errorInfo);
}
render(){
if(this.state.haserror){
return <h1>our error message</h1>
}
return this.props.children;
}
}
class Examplecomponent extends component {
render(){
return <div>example of component</div>;
}
function App(){
return(
<div>
<h1>my react app</h1>
<Errorboundary>
<Examplecomponent/>
</Errorboundary>
</div>
);
}
}
error_logsor similar and then save error messages and stack traces in it. That would be a primitive way of error reporting, but it's still better than nothing.