좌충우돌 anecdote

OSI 계층으로 구분[HTTP] ← 응용 (L7) [TLS] ← 암호화 (TCP와 HTTP 사이, L5~6쯤) [TCP] ← 전송 (L4) [IP] ← 네트워크 (L3) OSI 계층과 다르게 안티 봇이 검사하는 순서 / 스크래퍼가 뚫어야 하는 순서를 정리해보자. Step 1 · 네트워크 지문curl_cffi / tls-client impersonate, TLS + HTTP2 둘 다 맞춰줌브라우저 불필요Step 2 · JS 지문curl_cffi가 못잡는 challenge 영역실제 / 패치 브라우저 사용 (Camoufox, Patchright, Pydoll / NoDriver)Step 3 · IP/ASN진짜 ISP 주거용/4G만 깨끗. 세션 중 IP 교..

스크래핑을 하다 보면 한 번쯤은 이런 경험을 한다.“분명히 요청은 똑같은데 브라우저에서는 되고, python requests로는 403이 뜨네” 처음엔 헤더 문제라고 생각해서User-Agent도 바꿔보고, Accept-Language도 맞춰보고,쿠키도 복사해 붙여본다. 그런데도 안되는 것을 보면서, 헤더의 문제가 아니란 것을 알게 된다. User-Agent를 속였는데 왜 안 될까?많은 사람들이 User-Agent를 브라우저 흉내의 전부라고 생각한다.하지만 서버 입장에서는 훨씬 많은 걸 보고 있다.그중 하나가 바로 TLS fingerprint다.TLS fingerprint란TLS는 HTTPS 연결을 만들 때 쓰는 암호화 프로토콜이다.이 과정에서 클라이언트는 서버에게 이런 정보를 보낸다.지원하는 TLS 버전..

콜스택에서 발행한 RN 최적화 문서인 React Native Optimization를 2023년에 공부했던 것 같은데,2025년 버전도 새로 나와서 이 참에 정리해 봤다. 예전에 웹 개발 팀원분이 React Native도 DOM 기반이에요? 라고 질문했을 때 아닌 건 알았지만, 제대로 설명 못했던 경험이 있는데, 리액트 리렌더링 모델 내용을 정리하면서 그때 생각이 났다. 아직도 React와 React Native의 차이를 모르는 분이라면 해당 내용을 읽어보면 좋을 것 같다.react-dom은 별도의 렌더러라는 것을 ... 앱이 ‘빠르다’는 것은 무엇을 의미할까? ex.1940년대에 뉴욕의 한 오피스 빌딩에서 느린 엘리베이터에 대해 한 직원이 불만을 호소했는데, 건물 관리자는 엘리베이터 속도를 실제로 높이..

아이템 41 any의 진화를 이해하기요약일반적인 타입들은 정제되기만 하는 반면 (ex. 타입 좁히기), 암시적 any와 any[] 타입은 진화할 수 있습니다. 이러한 동작이 발생하는 코드를 인지하고 이해할 수 있어야합니다.any를 진화시키는 방식보다 명시적 타입 구문을 사용하는 것이 안전한 타입을 유지하는 방법 입니다. 1. 일반적인 타입들은 정제되기만 하는 반면, 암시적 any와 any[] 타입은 진화할 수 있습니다.❗️타입의 진화는 값을 할당하거나 배열의 요소를 넣은 ‘후’에만 일어나기 때문에, 편집기에서는 할당 다음 줄을 봐야 진화된 타입이 잡힌다.//1. 배열의 any 타입 진화(evolve)const result = [];  //any[]result.push('a');  result   //st..

아이템 34 ~ 40 정리본 목차아이템 34아이템 35아이템 36아이템 37아이템 38아이템 39아이템 40 아이템 34 부정확한 타입보다는 미완성 타입을 사용하기타입이 구체적일수록 버그를 더 많이 잡고 타입스크립트가 제공하는 도구를 활용할 수 있게 된다.하지만 부정확한 타입 설계는 없는 것보다 못하다그리고 타입정보를 구체적으로 만들 수록 오류 메시지와 자동 완성 기능에 주의를 기울여야 한다. 예시 1. 타입을 구체적으로 개선한 코드interface Point { type: 'Point'; coordinates: number[];}interface Linestring { type: 'LineString'; coordinates: number[][];}interface Polygon ..

리액트 환경의 무한 스크롤무한 스크롤은 페이지 하단 영역까지 스크롤될 경우 다른 컨텐츠를 새롭게 로딩해 페이지에 추가되는 방식이다.react-intersection-observer 라이브러리를 사용해서 구현해보았다. - 라이브러리 설치$ npm install react-intersection-observer --save - useInView hook const { ref: observerRef, inView } = useInView() => 관찰하는 객체 (observer) 하나를 ref로 설정한 후 해당하는 객체가 화면에 보이면 특정 코드를 실행시킬 수 있다.https://github.com/thebuilder/react-intersection-observer GitHub - thebuilder/re..

Selenium 자동화 코드를 작성하면서 텍스트 입력된 내용을 삭제하는 코드를 자주 쓰게 되는데,처음 알게된 내용을 공유하려고 한다. 네이버 쇼핑에서 여러 개의 키워드를 검색해서 내용을 가져오는 웹 크롤링을 하다가아래 코드에서 이슈가 발생했다. 이슈keywords = ['라면', '바구니', '커피']for idx, keyword in enumerate(keywords): input = wait.until(EC.element_to_be_clickable((By.XPATH, '//*[@id="gnb-gnb"]/div[2]/div/div[2]/div/div[2]/form/div[1]/div/input'))) input.send_keys(keyword) 키워드 배열을 돌면서 input 안에 keyw..

속절없이 지나가는 시간들을 붙잡고 싶어 .. 쓰기 시작한 나의 첫 회고항상 회고라는 것을 해보고 싶었지만, 바쁘다는 핑계로 미뤄왔었다.하지만 좋은 기운들을 마주하고 잊지 않기 위해서, 누군가에게 전달받은 동기부여들을 잊지 않기 위해 기록해본다 🙌 1분기 (1~3월) : 1. 호주 여행운이 좋게 친구가 퇴사하고, 나는 방학을 맞아 길다면 긴 2주간의 호주 여행을 다녀왔다.호주가서 호주인이 다 된 고등학교 친구를 만나고, 또 처음보는 외국인들과 같이 놀면서 정말 재밌었다.휴식하고 싶다는 마음 가짐으로 찾아간 호주 여행에서 세상은 넓고, 무엇이든 할 수 있겠다라는 마음으로 돌아왔다.호주 워홀을 30대 이전에 꼭 가겠다는 마음으로 .. 돌아왔는데, 막상 한국이 더 좋긴 하다. 돈만 있으면 살기 좋은 곳 나라 ..

아이템 1 ~ 5 정리본아이템 1: 타입스크립트와 자바스크립트의 관계 이해하기모든 자바스크립트는 타입스크립트지만, 모든 타입스크립트는 자바스크립트가 아니다.let city = 'new york city';console.log (city.toUppercase());// 'toUppercase* 속성이 'string* 형식에 없습니다.// 'toUpperCase1 을(를) 사용하시겠습니까?city 변수가 문자열이라는 것을 알려주지 않아도 타입스크립트는 초깃값으로부터 타입을 추론한다.타입 추론은 ts에서 중요한 부분 !! 타입 시스템의 목표런타임에 오류를 발생시킬 코드를 미리 찾아내는 것하지만, 타입 체커가 모든 오류를 찾아내지는 않음const states = [ {name: 'Alabama'f capi..

Android 앱 개발을 하다보면 보안을 위해서 출시 전에는 꼭 난독화를 해야한다.  Android 소스 난독화란? 앱의 소스 코드를 난독화하는 기술로,안드로이드 앱의 소스 코드를 분석하기 어렵게 만들기 위한 기술입니다.이를 통해 소스 코드를 더욱 안전하게 보호할 수 있습니다. 해커가 앱의 코드를 이해하고 악성 기능을 추가하는 것을 어렵게 만들 수 있습니다.그렇기 때문에 앱을 배포하기 전 앱 소스 난독화는 꼭 필요합니다.   Proguard 적용하기  Proguard는 소스코드를 난독화 및 최적화 해주는 무료 오픈소스 툴입니다. minifyEnabled축소, 난독화 및 코드 최적화를 활성화 / 비활성화 한다. getDefaultProguardFile("proguard-android.txt")Android..