[!이시중] 2021년 10월 26일 21:53에 최초 작성된 글로써 원글은 https://yuniel.tistory.com/41 에서 확인할 수 있음. 지난번 프론트에서 에러를 로깅하는 방법 중 하나인 sentry 관련 포스팅을 진행하며, 프론트엔드에서 에러 처리하는 방법에 대하여 정리해 봐야겠다는 생각이 들었다. 막상 정리하고 보니 너무나 기본 문법들이었는데, 안일한 마음에 나도 많이 놓치고 있었던 부분들이었다. 다만, 프론트엔드 내부에서의 일시적인 에러 처리이며, 에러 관련 데이터 수집 등에는 다소 비효율적이라는 한계가 있다. https://hyermione.tistory.com/5 프론트엔드에서 에러 처리하기 - SENTRY [!이시중] 2021년 10월 23일 23:24에 최초 작성된 글로써 원..
센트리에는 할당량 개념이 존재한다. sentry 공식 문서에는 Quota라고 표현하는데, 기업버전을 제외하고는 모든 버전에서 제한이 걸려있어 할당량 관리가 매우 중요하다. 이렇게 엔터프라이즈버전을 제외하고는 모두 제한이 걸려있다. 그래서 오류를 수집 할 때, 꼭 필요한 알짜들을 잘 필터링하여 수집하고 고쳐나가는게 중요하다. 그러나 아무렇게나 하게 된다면 나는 제외를 하였다고 생각했는데, 수집되는 경우가 더러있다. denyUrls 관련 기능을 설명하며 잠시 언급 한 적이 있는데, 예를 들어 에러 리스트에서 특정 에러를 ignored 시켰고, 이후 Unresolved 리스트로 들어오는 것이 아니라 ignored로 들어오는 것도 확인하였는데, 할당량이 가득 차는 경우가 있다. 왜냐하면 리스트에서 설정한 ign..
센트리를 구축하고 나면 생각보다 많은 에러들이 수집된다. 오류를 조금 보고 싶다 혹은 할당량 제한으로 인하여 적게 받아야만 한다 등 오류를 줄이고 싶은 경우가 많은데, 사실 제일 베스트는 모든 오류를 처리하는 방법이다-! 만, 쉽지 않다. 그럴때 말 이 기능을 사용하면 말 그대로 오류를 적게 수집할 수 있다. https://docs.sentry.io/platforms/javascript/configuration/options/#sample-rate Basic Options for JavaScript Learn more about how to configure the SDK. These options are set when the SDK is first initialized, passed to the in..
sentry에는 다양한 기능들이 많은데, 오늘 포스팅 해 볼 주제는 inbound filter에 대한 이야기이다. 사실 이 기능의 일부는 유료버전에서 사용이 가능하지만 무료로 사용할 수 있는 범위도 강력하거니와 나는 급할 때, 트라이얼 버전으로 해당 기능의 도움을 받은 경험이 있어 함께 소개해보고자 한다. https://docs.sentry.io/product/data-management-settings/filtering/ Inbound Filters Learn about the different methods for filtering data in your project. docs.sentry.io 그간 직접 코딩을 하면서 여러 조건의 에러를 필터링 하는 방법들을 소개했는데, 이번에 소개할 방법은 프로..
denyUrls는 말 그대로 sentry 프로젝트로 수집하지 않을 경로에서 생성된 오류를 막을 때 사용하는 옵션이다. https://docs.sentry.io/platforms/react-native/configuration/options/#deny-urls Basic Options for React Native Learn more about how to configure the SDK. These options are set when the SDK is first initialized, passed to the init function as an object. docs.sentry.io 간혹 검색하다보면 ignoreUrls이라는 옵션이 검색되기도 하는데, 이는 옛 버전으로 더이상 동작하지 않으니 반드시..
센트리를 세팅하고 이슈를 받아보면 당황스러울 때가 있다. 이렇게 많은 에러가 숨어있었다고!? 라는 마음 때문이다. 수집된 에러들을 천천히 살펴보면 사실 (이유가 어찌 되었건) 불필요한 에러들도 꽤 많이 자리를 차지하고 있다. 딱히 체크하지 않아도 되는 에러 일 수도 있고, 센트리가 init 된 이후의 모든 에러를 수집하기 때문에 의도되지 않은 페이지에서의 에러일 수도 있다. 아무튼 그럴 때, 이 전에 포스팅 한 beforeSend 함수를 이용하여 오류를 필터링 하는 방법도 좋지만 더 간단한 방법이 있어 소개해 보려고 한다. https://hyermione.tistory.com/20 센트리(sentry) BeforeSend 함수 활용 - 용량 조절, 슬랙 전송 등 참새가 방앗간을 들리듯이 센트리가 에러를 ..
참새가 방앗간을 들리듯이 센트리가 에러를 프로젝트로 보내기 전에 반드시 방문하게 되는 HOOK이 있다. https://docs.sentry.io/platforms/javascript/guides/electron/configuration/options/#before-send Basic Options for Electron Learn more about how to configure the SDK. These options are set when the SDK is first initialized, passed to the init function as an object. docs.sentry.io 바로 BeforeSend 라는 함수인데, 말 그대로 이슈를 보내기 전에 무조건 실행되는 함수이다. 가령 이슈를..
센트리를 프로젝트에 연결하기 위해서는 각각의 프로젝트에 부여되는 DSN을 연결시켜야 한다. DSN은 오류 이벤트를 보낼 위치를 SDK에 알려주는 역할을 하는데, 프로젝트 생성 직후에 한 번 알려주고 이후에는 꽁꽁 숨어있어서 찾기가 힘들다. (dsn 사용 예시) import * as Sentry from "@sentry/browser"; import { BrowserTracing } from "@sentry/tracing"; Sentry.init({ dsn: "https://examplePublicKey@o0.ingest.sentry.io/0", // Alternatively, use `process.env.npm_package_version` for a dynamic release version // i..
센트리가 무엇인지 궁금하신 분은 이전 포스팅 먼저 읽고 오시면 훨씬 도움이 됩니다 ^.^ https://hyermione.tistory.com/5 프론트엔드에서 에러 처리하기 - SENTRY [!이시중] 2021년 10월 23일 23:24에 최초 작성된 글로써 원글은 https://yuniel.tistory.com/39 에서 확인할 수 있음. 이직 면접에서 나 스스로가 만족하지 못 한 대답을 하여 아직까지 기억하고 있는 질문 hyermione.tistory.com 이 전에 센트리에 대하여 포스팅을 하였다. 백문이 불여일견. 백번 보는 것보다 한 번 시도를 할 때 더 많이 남는다는 말에 십분 공감하며, 테스트용 리엑트 프로젝트를 하나 생성하였다. 하단에 나오는 모든 정보는 https://sentry.io/..
- Total
- Today
- Yesterday
- sentry
- 김민태
- 사파리
- storybookUI
- react
- 센트리
- javascript
- BFCache
- 자바스크립트
- js테스트
- frontend
- 프론트엔드
- reacthook
- js
- Git
- 깃
- 프론트앤드
- vue
- 크롬
- 깃명령어
- 모바일사파리
- 리코일
- 리액트상태관리
- 리액트훅
- npm
- CSS
- TIL
- 센트리모니터링
- 리액트
- gitRebase
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |