심재무 심재무

과거 에이전시에서 퍼블리셔, 프론트엔드 포지션으로 수년간 많은 프로젝트를 구축하고 관리 하면서 이러한 고민들이 꾸준히 머릿속에 있었는데요. 어떻게 하면 더 좋은 html, css 코드들을 짤 수 있을까? 이 컴포넌트의 마크업 구조가 이게 맞을까? 클래스 명칭은 어떤 패턴을 적용하는게 좋을까? 어떻게 하면 반복되는 작업에 있어 생산성을 높일 수 있을까? 어떻게 하면 가독성을 높혀 다른 작업자가 내 코드를 쉽게 이해할 수 있을까? 버튼들을 재사용하려 할때 border radius, background color, padding 등의 스타일요소의 변칙성 안에서 어떤 패턴을 적용해야 확장성있게 만들 수 있을까? 정해진 답이 없는 질문들...여러 방식들을 모두 다 허용하고 에러에도 관대하며 정해진 규칙의 엄격성이..

현재 재직 중인 회사의 프론트엔드 구조는 Monolithic Architecture로 각 device 환경(PC, Mobile)에 따라 각 repository로 개별 구성되어있다.문제점은...프로젝트 규모가 커질수록 구조적 한계로 인해 다음과 같은 문제가 따른다.중복 작업. 간단한 텍스트 수정이나 기능 수정 등.. 대부분의 작업이 각 레파지토리에 중복되어 코드가 쌓이게 된다. 비지니스 로직(function, hook, utils, config, etc...)은 한 공간(shared 폴더 같은)에서 관리되는게 편리하며 효율적이다.CI/CD 빌드, 배포 시간 증가로 인한 개발속도 저하. 작은 일부의 소스 코드가 변경하더라도 프로젝트 전체가 배포되어야 하므로 많은 시간을 기다려야 한다. 만약 배포중 어떠한 이..

매번 새로운 프로젝트 구축 시 반복해서 처음부터 만들어야 하는 지루한 작업들.. (Button, Modal, 기본 스타일…)서비스마다 심지어 페이지 마다 다른 일관되지 않는 Component의 기본 스타일…font-size, padding, margin, border-radius 등… 규칙적이지 않은 수치 값들… 매번 블록들을 하나하나 처음부터 다시 만들기 보다는 만들어진 블록들로 조립만 할 수 있다면, 분명 효율적인 작업이 되어 생산성이 오르고, 시간을 아낄 수 있어 다른 중요한 부분 및 기능들에 시간을 투자할 수 있을 것이다.Benefit.생산성 향상: 미리 만들어진 UI 구성 요소를 재 사용하여 생산성 및 작업 효율을 향상 시킨다.일관성 유지: 동일한 UI 구성요소로 사용자 경험의 일관성을 유지한다..