본문 바로가기

Project29

코드 가꾸기 - 테스트 코드 1. Why?프론트엔드에서 테스트 코드를 작성하는 비율은 상대적으로 높지 않다. 삼성청년SW아카데미 내에서 3차례 프로젝트를 진행하며 그 때마다 10팀 씩, 총 30팀을 봤지만 한 팀도 테스트를 도입하지 않았다. 심지어는 현업에서도 테스트 코드를 작성하지 않는 경우를 보기도 했다. 하지만 테스트 도입에 대해서 고민하면서, 그리고 직접 테스트 코드를 작성하면서 느낀 것은 보통 테스트를 작성할때의 비용이 테스트를 작성하지 않았을 때의 비용에 비해 훨씬 적다는 것이다. 프론트엔드에 관심이 많은 학생이라면, 이 글을 읽고 테스트에 대해 관심을 가지게 되면 좋겠다.  2. 코드를 가꿔야하는 이유는 내가 진행한 프로젝트 중 테스트를 도입한 첫 프로젝트이다. 정확히는 Mock API를 사용한 비즈니스 로직 테스트와 .. 2024. 7. 9.
커뮤니케이션 잘 하기 1. Why?Pennyway팀은 팀원들의 상황이 학생 / 취준생 / 인턴 등으로 다양했기에 팀 프로젝트 중 처음으로 비대면으로 진행한 프로젝트다. 물론 스프린트 계획 / 리뷰를 위해 각각 2시간씩 주 2회 만나긴 했지만, 이를 제외한 대부분의 시간을 각자 진행했다.  그러다보니 다양한 시간대와 일정으로 인해 실시간으로 소통하기 어려운 경우가 많았고, 또 비대면으로 대부분의 소통을 진행하다 보니 서로의 의도를 오해하는 등 협업 과정에서 문제도 많이 발생했다. 이번 글에서는 정확히 어떤 문제들이 있었고, 이를 해결하기 위해 어떤 문화를 도입했는지 작성해보고자 한다.2. 문제 & 해결1. 코드 리뷰 관련문제우선 프로젝트가 시작되는 시점에서 함께 하는 팀원을 파악하지 못한 상태였기에, 큰 문제점이나 의문이 아니.. 2024. 6. 16.
최고의 공통 컴포넌트를 찾아서 0. TL;DR작업의 효율성과 유지보수성을 위해 고려해서 공통 컴포넌트를 구현문제 발생, 원인은 `명확성`을 충분히 고려하지 않았기 때문이를 개선하고, 공통 컴포넌트가 고려해야할 `명확성`에 대해서 이해1. Why?여러 차례 프로젝트를 진행하며, 어느정도 초기 설정이 끝나면 그 다음으로 공통 컴포넌트를 구현하게 된다. 이번 Pennyway에서도 마찬가지였는데, 이를 구현해서 작업의 효율성 높이기유지보수 용이하게 하기에 도움을 줄 수 있을 것이다. 하지만 프로젝트가 그렇게 쉽지만은 않은 법이다. 이번 글에서는 Pennyway에서 구현한 공통 컴포넌트에서 어떤 문제를 겪었고, 어떻게 컴포넌트를 수정해서 문제를 해결했는지 작성해보고자 한다. 2. 1차 코드 구현구현 코드가장 많이 고민한 부분이자 이후 수정하게.. 2024. 5. 21.
SCSS mixin으로 font 및 반응형 레이아웃 정의하기 0. TL;DRFont성능을 위해 woff2, subset font 사용. 지원 안할 경우를 대비 woff는 fallback font로 설정mixin을 사용해 classname으로 간단히 font 사용 가능하도록Layout모든 iPhone 사이즈에 대응가능하도록 media query로 계산mixin을 사용해 레이아웃 요소가 일관적인 사이즈 유지하도록1. Why?현재 iPhone용 App에 들어갈 Webview page 제작 중mixin을 사용해서 팀이 사용할 Font와 Layout을 설정해보자2. Font빠르게 Font를 설정할 수 있도록, 용량이 가장 작은 woff2 사용woff를 지원하지 않을 경우를 대비해 woff를 fallback font로 설정또한 기본 font 대비 1/3가량인 subset f.. 2024. 4. 21.