저는 개발을 참 좋아하는데 제가 소속한 조직의 문화를 개선하는 것도 그에 준할 정도로 좋아하는 편이예요. 현재까지의 커리어를 전부 스타트업에 쏟아서 그런진 몰라도 “꼬우면 바꾸자” 라는 마인드가 내재 되어 있어서 그럴지도 모르겠네요 😀 어쩌다가 기술 블로그를 시작했을까 기술 블로그는 회사의 이미지를 바깥에 보여주고 구성원들의 기술 향상에도 도움을...
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 화질 저하에 대해 검색해보니 꽤 오래 전부터 이 이슈에 대해 논의 되고 있었다는 것을 알 수 ...
원활한 협업을 위한 .nvmrc
nvmrc .nvmrc 파일이란, 프로젝트 구동을 위한 Node의 버전을 기록할 수 있는 파일을 말합니다. NodeJS 프로젝트에서 타인이 만든 프로젝트를 구동할 때 버전 문제가 발생해서 실행을 못한다거나, 일부 라이브러리를 사용하지 못했던 경험이 한 번 쯤은 있을텐데요. README.md 파일에 버전명을 적어두는 것 보다 협업 대상자가 명령어 한 줄...
내가 주로 쓰는 Next.js ESLint 설정
Package 설치 더욱 정교한 Formatting을 위해 플러그인을 설치합니다. yarn add -D eslint-plugin-simple-import-sort eslint-plugin-unused-imports # or npm install -D eslint-plugin-simple-import-sort eslint-plugin-unused-i...
기술 블로그에 Giscus를 추가했습니다!
개요 기술 블로그를 Github Pages로 이전하면서 정적인 웹사이트로 바뀐 이후, 기술 블로그에 방문하는 분들의 리액션을 알 수 있는 창구가 필요해졌습니다. 그래서 지난번에 게시물 하단에 applause-button를 추가했었죠. 가장 큰 호응을 얻고 있는 Pinia 게시글 하지만 박수 횟수로는 방문자들의 니즈를 알 수가 없다는 문제가 있습니...