본문으로 건너뛰기

제 컴퓨터에서는 되는데요? #1.빌드 과정 중 특정 모듈을 찾을 수 없음

· 약 5분
MinjiKim
MinjiKim
FrontEnd Engineer

들어가며

로컬에서 문제없이 동작하던 코드가 리모트 환경에서는 예기치 않게 실패하여 당황하신 적이 있으신가요? 최근 GitHub Actions에서 로컬 빌드와 배포 환경 간의 차이로 발생한 문제를 해결하며 배운 내용을 공유합니다.

SVG가 화면에 렌더링 되지 않는 이유

· 약 18분
MinjiKim
MinjiKim
FrontEnd Engineer

들어가며

프론트 개발자라면 한두 번쯤 프로젝트를 하며 로고를 넣거나 라이브러리 아이콘을 사용하며 SVG 파일을 마주한 적이 있을 것입니다. 예를 들어, MUI 아이콘을 추가하고 개발자 도구를 열어 아이콘을 클릭해 보면 아래와 같은 코드를 볼 수 있습니다.

자바스크립트로 자연스러운 애니메이션하기: requestAnimationFrame

· 약 11분
MinjiKim
MinjiKim
FrontEnd Engineer

들어가며

레이싱 게임을 하다 갑자기 타고 있던 카트가 이상한 방향으로 움직이는 것을 경험해 본 적이 있으신가요? 이는 프레임 속도가 떨어지거나 애니메이션 타이밍이 맞지 않을 때 발생합니다. 이런 문제를 해결하기 위해 자바스크립트에서는 requestAnimationFrame을 제공합니다. 이 글에서는 화면 주사율에 맞춰 애니메이션을 업데이트할 수 있는 requestAnimationFrame에 대해 알아보겠습니다.

JavaScript에서 이진 데이터 이해하기 : ArrayBuffer, TypedArray, Blob, File

· 약 25분
MinjiKim
MinjiKim
FrontEnd Engineer

Intro

업무에서 이미지를 다루기 시작하면서 이진 데이터를 표현하고 처리하는 방법에 대해 알아보는 시간을 가졌습니다. 이진 데이터는 보통 파일을 생성, 업로드, 다운로드, 전송할 때 사용됩니다.

JavaScript에는 이런 데이터를 표현하고 다루기 위한 다양한 타입이 제공됩니다. File, Blob, ArrayBuffer, TypedArray와 같은 타입이 그 예로, 각각의 방식은 조금씩 다른 특성과 용도로 사용 되고 있습니다. 이 글에서는 각 타입이 어떤 상황에서 가장 잘 맞는지, 또 어떤 차이점이 있는지 알아보려고 합니다.

나를 '프론트 개발자'로 소개하기까지

· 약 23분
MinjiKim
MinjiKim
FrontEnd Engineer

프론트엔드 개발자로서 일을 시작한 지 어느덧 4개월이 지났습니다. 이번 글에서는 글또 9기 활동을 포함해 프론트엔드 개발자로 성장해 온 시간과 지난 4개월간의 회사 생활을 되돌아보고, 앞으로 글또 10기에서 목표한 계획을 공유하고자 합니다.