안녕하세요, 오랜만에 글을 적어보네요. 오늘은 최근에 Sentry를 통한 모니터링 중에 이슈가 하나 발생해서 그 이슈를 디버깅해 보고 해결한 내용을 간단하게 적어보려고 합니다. 문제 발생 기존에 tsup을 통해 라이브러리를 개발해서 사용하고 있는데요. 레거시 브라우저 지원을 위해서 브라우저 지원 타겟을 es5로 지정해서 C …

회사나 팀에서 개발하다 보면 한 번쯤은 거의 필연적으로 내부에서 사용하기 위한 패키지 저장소에 대해 고민해보게 됩니다. 오늘은 그 고민을 통해 사내에서 사용할 수 있는 NPM 패키지 저장소를 구축하기 위해 겪었던 부분들에 대해 짧게나마 공유하려고 합니다. git을 사용한 패키지 설치 기존에는 비공개 패키지를 git+ssh 방식을 사용하여 특정 …

많은 것을 얻고, 한편으론 여운도 많이 남는 그런 해였던 것 같습니다. 오늘은 작년 회고의 이어 2021년을 보내며 어떤 것들을 했으며 그로 인해 무엇을 느꼈는지 정리해보려고 합니다. 슬럼프 시작부터 약간 암울한 이야기를 적어보자면 2020년부터 조금씩 여러 감정 변환들로 인해 내가 정말로 웹 프론트엔드 개발자로서 잘 성 …

얼마 전 사내 채널에서 FFmpeg.wasm으로 만들어진 인코딩 도구(AVPress)가 공유되었습니다. 그래서 이참에 웹 어샘블리 라이브러리를 사용해보고자 FFmpeg.wasm에 대해 알아보고, 간단하게 GIF 및 MP4 파일 웹 변환기를 만들어 보았습니다. 최종 결과물은 데모를 통해 확인 가능하며 코드는 깃헙 리 …

최근에 페이스북에 어떤분이 dev.to에 포스팅한 한글로 된 글을 보면서 저런 건 어떻게 만드는 걸까? 관심이 생겨 알아보게 되었습니다. 최종 완성된 프로젝트 코드는 깃헙 리포지토리에 올려 두었습니다. nabigraphics/render-link-preview-image-on-server-example Render an link preview image on server. Contribute to nabigraphics/render-link-preview-image-on-server-example…github.com 어떻게 포스팅 제목을 커버 이미지로 만들까? 보통은 직접 커버 이미지를 제작해서 사용하는 방법도 있지만 조금 더 생각해보니 SVG(Scalable Vecto …

최근 react-hot-loader를 적용한 리액트 환경에서 MirageJS를 적용하다 동작이 되지 않아 확인해보니 react-fast-refresh를 사용하면 된다는 댓글을 확인하여 react-fast-refresh 라는 것을 알아보게 되었습니다. 관련 코드는 nabigraphics/react-fast-ref …

AWS CloudFront(CDN) 서비스를 사용하여 서비스의 레이턴시(Latency) 줄여보자 안녕하세요! 👋 위즈페이스 팀에서 웹 프론트엔드 개발을 담당하고 있는 Jusung입니다. 오늘은 저희 팀에서 운영 중인 서비스에 CloudFront를 사용하여 동적 콘텐츠를 전송했던 경험에 대해 공유하려고 합니다. 동적 컨텐츠 전송이란 보통 …

Vercel(now.sh)을 도입하여 사내 개발 프로세스를 개선한 후기 안녕하세요! 👋 위즈페이스 팀에서 웹 프론트엔드 개발을 담당하고 있는 Jusung입니다. 홍수처럼 콸콸 넘치는(?) 지출을 막아보자

2019년에 이어 2020년 한해도 정말 많은 일이 있었네요. 옛날부터 언제 한번 저의 얘기들을 글로 남겨보고 싶었는데 매번 글을 쓸 타이밍을 잘 잡지 못해서 이제야 써보게 되었네요. (어떻게 쓸지감이 잘 안 잡히고 가장 큰 이유는 귀찮았기 때문인 듯하다…) 산업기능요원으로 복무 시작 현재 재직 중인 Wizpace(위즈페이스) 회사에서 작년 …