도리 도리

일시:8월 23일 (토)장소: 세종대학교 광개토관 B2홈페이지: https://2025.feconf.kr/트위터: https://x.com/feconfFE Conf 2025에 다녀왔다.NHN Forward 2022 이후 3년 만에 참가한 오프라인 개발자 컨퍼런스였다.특히 프론트엔드 개발자위주의 행사라는 점, 유튜브로 꾸준히 챙겨보던 행사라는 점 때문에 더 기대가 됐다.결론부터 말하면 매우 즐거웠고 개발에 열정 가득한 많은 사람을 만나는 게 건강한 자극이 되었다.메인 프로그램메인 프로그램은 A, B 홀에서 병렬로 진행되었다. A는 모바일 관련 내용이 많아 보여서 나는 주로 B 홀에서 발표를 시청했다.세부 내용은 유튜브에 공개될 예정이라, 여기서는 기억에 남은 발표만 간단히 정리했다. 스벨트를 통해 리액트 ..

https://www.yes24.com/product/goods/105911017 프로그래머의 뇌 - 예스24인지과학을 활용한 개발자의 일머리 개선법 이 책은 인지과학에 기반을 둔 각종 방법론으로 개발자가 새로운 언어나 프레임워크를 빠르게 배워 생산성을 향상하도록 돕는다. 코드를 더 잘 이해www.yes24.com 크게 네 파트로 구성되어, 개발하면서 겪는 어려움을 인지 과학의 관점에서 분류한다.이를 분석하여 어떻게 해야 코드를 잘 읽고 좋은 코드를 작성할지에 대해 설명한다.공감되는 부분도 많고 머릿속으로만 느끼던 부분들에 대해 구체적으로 설명해주기 때문에 실무에서도 도움이 될 것 같다.내가 짠 코드를 상대방에게 설명하거나, PR을 작성할 때좋은 코드, 안좋은 코드 느낌은 있지만 설명을 잘 못하겠을 때이..

개발하다보면 Git은 뗄레야 뗄 수 없다. 특히, Github에서 해야할 일이 굉장히 많다.여러 Repository에 걸쳐서 다양한 PR과 코멘트를 상대하다보면, 어디까지 리뷰했고 어디를 하다 말았고 헷갈리는 경우도 종종 있다.이런 파편화된 업무를 한마디면 척척 정리해주고, 나 대신 코멘트도 달아주는 친구(?)가 있으면 좋겠다는 생각을 하게된다.마침 최근에 Github 공식 MCP 서버가 나왔고, 우리 Copilot에 활용이 가능했기 때문에 바로 적용해보았다.https://github.com/github/github-mcp-server GitHub - github/github-mcp-server: GitHub's official MCP ServerGitHub's official MCP Server. Co..

TL;DRProgressive 이미지를 통해 느린 이미지 로드로 인해 저하된 사용자 경험을 개선할 수 있다.JPG, PNG로 한번 만들어보기이미지의 용량이 크거나 네트워크가 느릴 때, 이미지가 위에서 아래로 끊기듯이 로드되어 사용자 경험을 저해할 수 있다.이 문제를 해결하기 위한 방법을 보다가 Progressive 방식을 알게 되었다.인터넷을 사용하다보면 이미지를 로드하는 방식에 차이가 있다.1) 앞서 말한 것처럼 이미지가 끊어지면서 로딩2) 흐린 이미지가 점점 선명해지면서 로딩후자가 바로 progressive 방식의 이미지이다.장점Progressive 방식의 이미지는 UX 상의 이점이 있다.저사양 환경에서도 빠른 시각적 피드백사용자가 로딩 중임을 인지하게 함으로써 이탈율 감소단점좋은 점만 있는 것은 아..

회사에서 Copilot 지원이 시작되었다. 바로 신청해서 사용해보았지만 너무 큰 문제가 있었다.VSCode와 Neovim의 싱크가 깨지는 문제였다.Vscode Neovim 익스텐션은 VScode 탭과 Neovim 인스턴스 사이에서 싱크를 맞춘다.이 때, 코파일럿의 자동완성을 사용하면 간할적으로 Neovim의 싱크가 깨졌다.키들이 동작하지 않았고 매번 익스텐션을 재시작 해야했다.아래 등록된 이슈로 확인할 수 있는데, 25.02.28 기준 아직 진행 중으로 확인된다.Github 이슈 참고: https://github.com/vscode-neovim/vscode-neovim/issues/2184 bug: "Syncing layout: Syncing active editor" keeps running forev..

권세규님의 네이버 엔지니어링 데이 세션 infer, never만 보면 두려워지는 당신을 위한 고급 TypeScript를 보았다.이 세션을 통해 아래 개념들을 더 명확히 익힐 수 있었다.타입의 대소 비교타입의 종류제네릭 타입 검사또한 아래 과정들을 시각적으로, 단계별로 보여준다.타입스크립트의 타입 검사가 이뤄지는 과정실제 라이브러리 코드에서 타입을 개발하는 과정1시간 12분으로 짧지 않지만 내용이 밀도 있고, 발표자료가 준비가 잘 되어 있기에,타입스크립트를 잘 사용하고 싶다면 꼭 한번 보는 것을 추천한다.infer, never만 보면 두려워지는 당신을 위한 고급 TypeScript이를 아래에 간단히 정리해보았다. (많은 내용 생략) 타입의 대소 비교타입 A와 B의 대소는 서브타입 관계에 따라 달라진다.서브..

글자 수 문제JS에서 글자 수를 validation을 하는 경우 보통 length를 사용한다.const MAX_LENGTH = 10;const validate = (value: string) => value.length 하지만, 아래 경우는 어떨까?validate('정답을 맞춰보세요😀');띄어쓰기 포함 10글자이지만, false를 출력하는것을 볼 수 있다.'정답을 맞춰보세요😀'.length; // 11emoji가 길이 2로 계산되기 때문이다.해결책[...'정답을 맞춰보세요😀'].length; // 10위와 같이 spread 연산자를 사용하면 결과가 10으로 정상적으로 나오는 것을 알 수 있다.원인문자열은 인덱싱, 길이연산 등에서 기본적으로 UTF-16 코드 유닛 기반으로 동작한다.'정답을 맞춰보세요..

이전 글 - https://blue-tang.tistory.com/97 NeovimIntro 요새 코드에디터로 Neovim을 사용하려는 시도를 하고있다. Vim 자체가 익숙치 않아서 초기에 좀 어려움을 겪었다. Vim motion부터 좀 익숙해지고, 개인 프로젝트 개발할 때는 급하지 않으니 최대blue-tang.tistory.com Neovim은 약 1년이 넘는 기간동안 나의 메인 코드 에디터였다. 키보드만으로도 모든 것을 제어할 수 있는 강력한 기능과 속도는 나에게 큰 즐거움을 주었다. 그러나 시간이 지나면서, 나는 점점 Neovim을 메인 에디터로 사용하는 것에 대한 한계를 느끼게 되었다. 이번 글에서는 내가 왜 Neovim을 더 이상 메인 에디터로 사용하지 않게 되었는지에 대해 이야기해보려고 한다...