LeetCode 1071

LeetCode: Merge Strings Alternately

HOC 패턴에 대해 정리해보자..!

프론트엔드 개발자의 AWS Cloud Practitioner 준비했던 과정을 공유합니다..!

Javascript & Vue 프로젝트에서 갑자기 Vue - Official 플러그인이 동작하지 않았다..!

Container Presentation Pattern이란, 로직을 위한 컴포넌트(Container)와 UI를 위한 컴포넌트(View)로 분리시키는 디자인 패턴입니다.

오래 미뤄왔던 블로그를 다시 끄적끄적 하려고합니다..! Vue를 개발하면서 React의 디자인 패턴을 Vue에서도 사용하면 좋겠다는 생각이 들어 React에서 자주 사용하는 패턴을 Vue로 옮겨보려고합니다. 오늘은 그 중에서도 가장 많이 사용되는 compound component pattern을 옮겨보겠습니다!! 1. Compound Component P...

DND 13기의 프론트엔드로 참여하여 런닝을 처음 하는 사람들이 친구 혹은 크루와 함께 런닝을 진행하며 운동을 독려하는 앱(**Runky**)를 개발한 회고록을 작성했습니다!!

사내 AI 프로젝트를 고도화하던 중, 답변을 클릭하여 모달이 아닌 새로운 탭창에서 그래프를 보여줘야하는 로직이 있었습니다. 실시간으로 변하는 데이터를 탭에 전송해야 했기에 여러 방법을 찾아보았습니다. 그러던 중 window.postmessage와 BroadcastCha

requestionAnimation을 사용하여 프레임 드랍 없는 부드러운 애니메이션을 만들어봅시다!

Vite는 왜 process.env가 아닌 import.meta.env를 사용할까?

종속성아 잡혀줘..!

프론트엔드 개발자라면 모두 알다시피 Javascript는 싱글스레드 언어입니다.Javascript는 싱글스레드이기 때문에 한계가 명확히 존재합니다. 그렇기 때문에 작업들을 병렬로 처리할 수 없고, 다른 작업이 끝날 때까지 기다려야합니다. 이를 개선하기 위해 JS는 `

Vite를 통해 최적화를 진행하다보면 Gzip, Brotil로 압축하여 전송하라는 내용들이 많이 보입니다. 그렇다면 Gzip, Grotil은 무엇인데 사용자에게 빠른 경험을 제공할 수 있을까요? Gzip Gzip은 번들링 이후 단계에서 만들어진 파일들을 압축하는 알고

React Query의 useClient 구조를 알아보자오늘은 저번 주에 이어서 useQuery가 어떻게 실행되며 그에 따라 React가 어떻게 업데이트를 진행하는지 알아보겠습니다!useQuery(https://github.com/TanStack/query/b

서버 상태 관리를 위해 많이 사용하는 React Query는 캐싱, 동기화, 업데이트 등 많은 장점이 있어 자주 사용되는 라이브러리입니다. 그 중에서도 가장 많이 사용되는 것을 꼽자면 데이터 조회를 위해 사용되는 useQuery 기능이라고 생각합니다.실무에 적용하고 사

말머리 사내 프로젝트를 진행하다 대화 이력을 조회해야하는 로직이 있었습니다. 초기에는 성능상의 이슈가 없었지만, 대화 이력시 쌓여갈수록 많은 렌더링으로 인하여 성능이 저하되는 이슈가 있었습니다. 이를 개선하기 위해 Virtual Scroll과 Intersection O

NextAuth.js사이드 프로젝트를 진행하며 네이버 소셜로그인 파트를 담당하게 되었습니다.네이버 소셜 로그인을 구현하는 방법을 찾아보던 중, Next-Auth라는 라이브러리를 알게되었습니다.

사내 챗봇 프로젝트 구현 중에 ppt, pdf, jpeg 등 다양한 형태의 이미지를 다운로드하는 기능이 있었습니다. 처음에는 단순하게 Blob URL을 a태그에 넣고 클릭 이벤트 전달해야지라는 생각으로 구현했다가 오류가 발생했습니다. 그러다가 찾아본 내용과 해결 방법을

Next/image는 컴포넌트입니다. 서버 동작시 ./_next/image라는 이미지 최적화 라우트를 생성하고 모듈을 통해 최적화를 진행합니다. 이 때, 쿼리트스링 URL 을 만들고 prop로 전달한 속성값을 통해 최적화를 진행합니다.