본문 바로가기 - React에서 텍스트 오버플로우 감지 및 스크롤 애니메이션 구현하기 React에서 요소의 위치를 비교해 긴 텍스트가 옆 영역을 침범했는지 감지하고, 오버플로우일 때만 호버 스크롤 애니메이션을 적용한다.
- Yarn을 사용한 모노레포에서 cannot find module 문제 해결하기 Yarn Berry 워크스페이스와 코드 에디터가 서로 다른 TypeScript 버전을 사용해 모듈을 찾지 못할 때의 원인과 해결 절차를 기록했다.
- [Solidity] 함수 시그니처를 사용해 동적으로 데이터를 인코딩하는 폼 만들기 Solidity 함수 시그니처를 viem으로 ABI로 변환하고, 파라미터 타입에 맞는 입력 폼을 동적으로 만든 뒤 데이터를 인코딩한다.
- Next.js App Router + RainbowKit + SIWE + NextAuth.js를 사용해 지갑으로 로그인하는 기능 구현하기 Next.js App Router에 지갑 연결과 서명 로그인을 구성하고, 세션 관리와 인증 API 및 보호된 페이지까지 구현하는 과정을 담았다.
- Damn Vulnerable DeFi Foundry V3 업데이트 작업 DeFi 보안 실습 저장소를 Foundry V3에 맞춰 갱신하며 메인넷 포크, 가격 정밀도, 컴파일러 충돌과 서명 트랜잭션 재현 문제를 해결한 기록이다.
- Solidity 런타임 바이트코드 분해하기 소스 코드와 ABI가 없는 컨트랙트의 런타임 바이트코드를 opcode 단위로 읽어 함수 선택자와 호출 인수를 추론하는 과정을 다룬다.
- Hyperlane V3를 사용한 Crosschain NFT Foundry로 NFT와 라우터 컨트랙트를 구성하고 서로 다른 테스트넷에 배포한 뒤, Hyperlane 메시징으로 체인 간 NFT를 발행한다.
- mdBook을 사용해 markdown 형식의 정적 웹사이트 만들기 Rust 환경에 mdBook을 설치해 마크다운 기반 정적 사이트를 만들고, 로컬 실행부터 GitHub Actions를 이용한 페이지 배포와 테스트까지 구성한다.
- Zola를 사용해 나만의 블로그/포트폴리오 만들기 Zola를 설치해 테마 기반 블로그를 빌드하고 로컬 실행과 Vercel 배포를 시도하며, 정적 자산이 적용되지 않은 문제를 기록한다.
- WSL에서 Terraform 사용하기 WSL에 Terraform과 AWS CLI를 설치하고 자격 증명을 구성한 뒤, 예제 리소스의 초기화와 생성 및 제거 과정을 실행한다.
- WSL에서 Github 사용하기 WSL에서 SSH 키를 생성해 GitHub에 공개 키를 등록하고, Git 사용자 정보를 설정한 뒤 SSH 경로로 저장소 연결을 테스트한다.
- WSL에서 Go 사용하기 WSL에 Go 바이너리와 환경 변수를 설정하고, VSCode 확장과 개발 도구를 설치한 뒤 모듈 생성과 코드 실행까지 확인한다.
- Chainlink - Data Feeds Chainlink 가격 피드 인터페이스의 주요 조회 함수와 반환값을 설명하고, Sepolia에서 컨트랙트를 배포해 최신 비트코인 가격을 읽는다.
- 바빌로니아 법 (The Babylonian Method) 내장 제곱근 함수 없이 바빌로니아 반복법으로 소수점 둘째 자리까지 근삿값을 구하고, 단순 탐색 방식과 두 방법의 시간·공간 복잡도를 비교한다.
- [Nginx] Reverse Proxy 설정 Docker 환경에서 Nginx로 웹 앱을 제공하고 API 요청의 접두사를 제거해 내부 서버로 전달하는 리버스 프록시 구성과 노출 위험을 다룬다.
- [Trouble Shooting] net::ERR_NAME_NOT_RESOLVED React 앱의 요청이 컨테이너가 아닌 브라우저에서 실행돼 Docker Compose 서비스 이름을 해석하지 못한 원인을 추적한다. 포트를 외부에 노출해 해결한다.
- [Go] gRPC서버 요청에 담긴 메타데이터 읽기 Go gRPC 요청 컨텍스트에서 메타데이터를 읽어 사용자 에이전트와 클라이언트 IP를 추출하고 재사용 가능한 함수로 구성한다.