Overview React v18의 정식 릴리즈가 나오면서 Automatic Batching, Transition등 여러 Feature들이 소개되었습니다. 그중에는 React v16.6에 Experimental Feature로 등장했다가 이번에 정식으로 탑재된 "Suspense"에 대한 내용도 추가되어 있는데, 이번 포스팅에서는 특별히 이 Suspense라는 기능에 대해서 살펴보려고 합니다. What is Suspense? Suspense lets your components “wait” for something before they can render. In this example, two components wait for an asynchronous API call to fetch some data..

Membership 출시 1월부터 시작했던 프리미엄 멤버쉽 출시가 (드디어) 3월 초에 배포가 되었고, 어느 정도의 안정화 작업을 거쳐서 실 결제하는 사용자들이 하나 둘씩 생기게 되었다. 사내에서도 처음으로 구독결제 서비스를 출시하는 것이었기 때문에 기술적으로 여러 가지 고려해야 할 것들이 많아서 팀원들이 정말 고생을 많이 했구나 하는 생각이 들었다. 웹쪽에서는 사실 클라이언트와의 브릿지 연결 & 데이터 로깅등을 통한 일종의 매개 역할을 해주어야 하는 일들이 많아서 직접적으로 구독/해제 모델에 대한 기능 구현쪽과는 복잡하게 묶여있지는 않았지만, '웹뷰' 환경이기 때문에 고려해야 하는 여러 기술적인 과제들이 있었다. 클라이언트 웹뷰는 Operating System자체가 기존 데스크탑 브라우저에서 열리는 환..

Feedback 디자인 시안은 정말 중요하다. 웹 개발자가, 특히 작은 규모의 프로젝트에서 일하는 웹 프론트엔드 개발자가 빠지기 쉬운 함정 중의 하나는(내가 빠져서 그런가), 디자인 시안에 맞추어 개발하지 않고, 자신의 개발 편의에 맞춰 시안을 조금씩 조금씩 자기 입맛에 맞게 수정하려는 태도인 것 같다. 디자인 시안 (이번 같은 경우는 Zeplin)에 명시된 margin, color, font 등을 엄격하게 준수하고, 애매한 점이 있으면 (시안에 나오지 않는 애니메이션 효과 등) 해당 사항에 대해서 적극적으로 디자인 팀과 소통하여 의사결정을 하는 단계가 필요하다. 유들 있는 Validation. 프론트엔드를 개발한다고 하면 거의 대부분의 프로젝트에서 빠지지 않는 것이 Form Control이다. 사용자의..