들어가며 이번 포스팅은 “나는 왜 프론트엔드 개발자가 되었는가?”라는 주제로 계기와 과정 등을 서술한다. 약 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. 커스텀하기 편하다. 고퀄리티의 글을 작성하기 위해서는 어느정도 정형화된 형식이 도움이 될 수 있다. 하지만 강조 처리나 특정한 부분을 삽입할 때, 커스텀이...