들어가며 사내 타운홀 미팅 중, 발표자이신 임원분께서 다음과 같은 질문을 주셨습니다. “앞으로 우리 제품의 방향성 대해 궁금한 것이 있나요?” 잠깐 곱 씹은 끝에 엔지니어로서 가장 궁금한 것을 여쭈었습니다. “비즈니스의 확장과 기술 부채에 대한 우선 순위가 궁금합니다.” 네, 제품의 비전에 대한 질문을 드릴 수도 있었지만… 낭...

들어가며 프론트엔드 개발은 시간이 지남에 따라 복잡성과 규모가 증가하여 다양한 패러다임을 받아들이게 되었습니다. 초기의 절차적 프로그래밍에서 객체지향 프로그래밍의 전환 이후로 최근에는 함수형 프로그래밍이 많은 주목을 받고 있는데요. 저도 어느새부턴가 함수형 프로그래밍으로 개발하는 것이 익숙해졌습니다. 프론트엔드에서 점유율이 가장 높은 React...

들어가며 이번 포스팅은 “나는 왜 프론트엔드 개발자가 되었는가?”라는 주제로 계기와 과정 등을 서술한다. 약 2년 간의 개인 프로젝트를 마치고 회사에 입사한 지 1년이 되어가는 지금, 나는 프론트엔드 개발자로서 책임을 다하고 있다. 취준생 시절에 백엔드와 데브옵스 등 타 직군에 대해 고민이 있었지만 이미 답은 정해져 있었다. 나는 시각적인 부...

Transition Component Transition은 내장 컴포넌트로 <slot>을 통해 전달된 요소나 컴포넌트에 enter 또는 leave 애니메이션을 적용하는 데 사용한다. enter 또는 leave의 트리거는 다음과 같다: v-if를 통한 조건부 렌더링 v-show를 통한 조건부 표시 <component&g...

Atomic Design Atomic Design은 인터페이스를 작은, 재사용 가능한 구성 요소로 나누고 이를 조합하여 복잡한 디자인을 만드는 방법론이다. 이 방법론은 선형 프로세스가 아닌 정신적 모델로 사용자 인터페이스를 응집력 있는 전체이자 동시에 부분의 모음으로 생각할 수 있도록 도와준다. 이로 인해 코드의 구조를 더 명확하게 만들어주고 유...

발단 사내에서 Preview를 보여주는 기능을 개발하던 중에 발생한 이슈이다. 저장을 하기 전까지 기존 UI와 수정 UI를 함께 제공해야 하는데 기존 UI가 함께 변경되는 것이 아닌가? 아래 코드를 살펴보자. import { ref } from "vue"; interface ILayoutItem { id: string; data: IDa...

플랫폼 이주 기존 Velog에서 포스팅 이후 맥이 끊기고 다시 시작하기로 마음을 다잡았다. “굳이 왜 Git으로 플랫폼을 옮겼는가?” 하면 두 가지 이유가 있다. 1. 커스텀하기 편하다. 고퀄리티의 글을 작성하기 위해서는 어느정도 정형화된 형식이 도움이 될 수 있다. 하지만 강조 처리나 특정한 부분을 삽입할 때, 커스텀이...