Study (3) 썸네일형 리스트형 OpenSource Contribute 후기 시간이 너무 많이 흘러버렸지만... 이제라도 남겨보는 오픈소스 컨트리뷰팅 후기 시작글 막연하게 오픈소스 개발에 대한 욕심이 있었다. 라이브러리 혹은 패키지 없이 개발하는 IT 개발 실무자는 없을 것이다. 어느순간 어쩌면 너무 본인이 라이브러리에만 의존하고 있지 않나라는 생각이 들었다. 아마 이런 죄책감(?)에서 비롯된 욕심이었나보다. 이런 생각에서 비롯되어 실제로 오픈소스 기여에 대한 경험을 정리하여 기록해두고자 한다. 본문 🔎 오픈소스 프로젝트 찾기 본인이 기여할 오픈소스를 찾는게 가장 첫번째였다. 돌아보자면, 이 단계에서 가장 긴 시간이 소요됐다. 나에게 있어 기여할 오픈소스 프로젝트를 찾는다는 건 다음과 같은 기준에 부합하는 프로젝트를 찾는 것이었다. 흥미로워 보이거나 본인이 평소에 사용했던 프로젝.. [Next.js] Data Fetching APIs 비교 분석 (getStaticProps, getStaticPaths, getServersideProps, getInitialProps) 개요 생각해보면 현재 재직중인 회사에서 관리자 페이지를 제외한 프론트 서비스들은 모두 Next.js 를 사용하고 있는데 Next.js 프레임워크를 시간들여 공부해본 적이 따로 없는 것 같다. 🥲 핑계를 대보자면 React.js 만 사용할 줄 알아도 Next.js 으로도 그냥저냥 개발이 가능하기 때문이었다. 게을렀던 본인을 속죄하는 마음으로 Next.js 를 사용하며 의문이 들었던 부분들 위주로 하나씩 공부해나가보고자 한다. data fetching 메서드들을 정리하는 것으로 첫 글을 시작해본다. Pre-Rendering Next.js 는 페이지 요청시 자체적으로 pre-render 한 html 파일을 응답하고, 브라우저에서 hydration 위해 필요한 코드를 재호출하는 방식을 사용하고 있다. 이로써 빠.. 웹 요청 중단 시키기 (ft. AbortController) 최근 QA 테스트 진행 중, QA 팀원분의 다음과 같은 요청이 있었다. api를 사용하는 컴포넌트의 네트워크 실패/지연 케이스를 재현해보고 싶은데 방법이 없을까요? 로컬 환경에서는 이를 쉽게 재현할 수 있겠지만, 개발 내용을 공유하기 위해선 개발 서버로 배포가 필요했고 특정 api만을 원할때마다 실패 혹은 지연을 일으킬 수 있는 방법이 떠오르지 않아 당시엔 '그건 좀 힘들 것 같아요 ㅜㅜ' 라고 답변을 드렸다. 이후, 같은 질문을 받는다면 좀 더 괜찮은 답변을 드리고 싶었고 몇가지 방법을 찾아냈다. Chrome 개발자 도구 > 네트워크 탭 > fetch/XHR 탭 > 원하는 api 요청 block Chorme 개발자 도구 > 설정 > 제한 > 커스텀 네트워크 속도/지연 프로필 설정 (네트워크 탭에서 제공.. 이전 1 다음
