들어가며 안녕하세요 😀 박찬영입니다. 저는 회사에서 신규 서비스 런칭을 앞두고 있기 때문에 정말 많은 Task가 몰아치는 하루를 보내고 있어요 😭 그렇게 해결했던 수많은 Task 중 문서로 남겨두면 유용할 법한 내용을 가져왔어요! Amplitude란? Amplitude는 서비스의 사용성을 증대시키는데 도움을 줄 수 있는 다양한 정보를 수집하고 응용하...
Headless 브라우저를 이용한 스냅샷 촬영 구현
들어가며 요즘 업무가 바빠 기술 블로그에 글을 투고 한지 너무 오래 되었다는 것도 잊고 있었습니다. 사정 상 주기적인 업데이트가 불가능 했어요 😢 그래서 이번 포스트에서는 최근에 있었던 개발 Task 중 가장 인상 깊었던 Task를 갖고 왔습니다! 저는 최근에 위 움짤과 같은 에디터를 개발하고 있었습니다. 디자인 편집을 가능하게 해주는 이 에...
VSCode User Snippet 알아보기
User Snippet? 개발을 하다보면 비슷한 형식의 코드를 반복적으로 작성해야 할 때가 자주 있습니다. 대표적으로 Redux의 Slice나 Hook과 같은 코드를 작성할 때 자주 이러한 상황이 펼쳐집니다. interface UseExampleArguments { } export const useExample = (args: UseExampleA...
기술 블로그 살리기, TF부터 글 작성까지의 일대기
저는 개발을 참 좋아하는데 제가 소속한 조직의 문화를 개선하는 것도 그에 준할 정도로 좋아하는 편이예요. 현재까지의 커리어를 전부 스타트업에 쏟아서 그런진 몰라도 “꼬우면 바꾸자” 라는 마인드가 내재 되어 있어서 그럴지도 모르겠네요 😀 어쩌다가 기술 블로그를 시작했을까 기술 블로그는 회사의 이미지를 바깥에 보여주고 구성원들의 기술 향상에도 도움을...
SSR 환경에서의 React Query
React Query는 서버와 클라이언트 사이에서 데이터를 관리하기 위한 좋은 라이브러리입니다. 자세한 설명은 React Query 문서를 확인 해주세요. SSR 환경에서 사용하기 React Query는 useQuery라는 hook을 이용하여 사용하는 점에서 알 수 있듯이 클라이언트 렌더링 때 데이터를 호출하고 관리하는 라이브러리입니다. 그러다보...
도형의 각도를 회전하는 방법
들어가며 이미지 편집 서비스 Canva 다중 오브젝트를 한 번에 회전 시키려고 하면 오브젝트의 각도와 위치가 동시에 변경 됩니다. 본 문서에서는 위 기능을 구현하는 방법에 대해 기술합니다. 회전 각도 구하기 우선 두 점 사이의 각도를 구하는 함수에 대해 정의 합니다. interface Point { x: number; y: number; }...
Git 원치 않는 파일 제거하기
들어가며 가끔 .env 파일이나 개발 내용과는 전혀 상관 없는 이미지 파일, 개인적인 자료들이 실수로 Git 히스토리에 커밋 되어 원격에 올라가는 경우가 있습니다. 로컬에서 파일을 삭제하고 커밋을 할 경우 최신 이력에서는 삭제 되지만 히스토리를 살펴보면 파일 조회가 가능하기에 보안상 심각한 이슈를 낳을 수 있어요. git filter-branch ...
Safari SVG Blurry 현상 해결 방법
들어가며 회사에서 서비스 되는 앱에서 사용할 WebView 페이지를 작업하던 중 발견한 이슈입니다. iOS 앱에서 WebView 페이지를 접속하면 SVG로 추출한 이미지인데도 불구하고 화질 저하가 일어난다는 기묘한 이슈였습니다. 구글에 Safari SVG 화질 저하에 대해 검색해보니 꽤 오래 전부터 이 이슈에 대해 논의 되고 있었다는 것을 알 수 ...