HHeeeeinheeee.hashnode.dev·Apr 29, 2024 · 8 min read이미지 유효성 검사 로직에 테스트 적용하기들어가며 얼마 전부터 <쏙쏙 들어오는 함수형 코딩> 책을 읽기 시작했다. 그러다 문득 이전에 수강했던 원티드 챌린지 강의에서 준 과제가 생각났다. 당시에는 이것저것 하는게 많아서 과제는 못 하고 넘어갔다. 이 부분이 내심 아쉬웠는데 이참에 함께 하기로 했다. 과제는 본인이 작성한 코드에서 액션/계산/데이터를 구분하고 느낀 점을 정리하는 것이다. 책에서도 해당 파트를 읽었던 터라 바로 시작했다. 실습할 코드는 조금씩 리팩토링하고 있던 작심삼칩 프...00
HHeeeeinheeee.hashnode.dev·Apr 26, 2024 · 5 min read모드에 따라 로고 다르게 렌더링 하기들어가며 이번에는 로고 컴포넌트를 만들었다. 원래는 필요한 곳에 로고 이미지를 삽입해서 사용하거나 Banner 컴포넌트를 사용했는데 아무래도 로고다 보니 재사용성을 고려해 만드는 게 좋겠다는 생각이 들었다. 기존 방식의 문제점과 개선 방향, 그리고 이 과정에서 styled-components의 as prop은 어떻게 사용했는지 풀어볼 것이다. 배경설명 로고는 두 종류가 있다. 밝은 배경에는 다크 버전을, 어두운 배경에는 라이트 버전을 사용한다...00
HHeeeeinheeee.hashnode.dev·Apr 19, 2024 · 11 min read공통 Header 컴포넌트를 만드는 여정여러 곳에서 사용하고 있는 Header 디자인 디자인 시안을 보다가 비슷하게 생긴 Header 디자인이 여러 곳에서 등장하는 것을 발견했다. 레이아웃은 비슷하고 내부 요소만 조금씩 다른 컴포넌트다. 내 담당 페이지에도 있어서 만들어야 하는데, 어차피 만드는 거 공통 컴포넌트로 제작하면 좋을 것 같다. 만약 Header 컴포넌트를 따로 만들게 되면 아래와 같은 문제가 있다. 매번 번거로운 작업을 해야 한다. Header 디자인은 약 20곳에서...00
HHeeeeinheeee.hashnode.dev·Jan 14, 2024 · 2 min read프로젝트 초기 세팅하기지난 번에 프로젝트 초기 세팅을 했는데 vite + yarn berry를 사용해서 하는건 처음 해봤다. 정리도 할 겸 다시 처음부터 차근차근 세팅을 해보자. 01. Vite로 프로젝트 만들기 Vite 공식문서를 보면 템플릿으로 프로젝트를 만들 수 있다고 한다. TypeSciprt, React를 기반으로 만들거라 react-ts 템플릿을 사용했다. yarn create vite . --template react-ts 터미널에 yarn -v 명령...00
HHeeeeinheeee.hashnode.dev·Jan 8, 2024 · 4 min readJira 티켓 복붙에서 벗어나기🐢 복붙의 늪에 빠지다… 이전 프로젝트에서 효율적인 프로젝트 관리를 위해 Jira를 도입했다. 원래는 PM/디자이너는 노션에 할 일을 적어두고 개발자는 GitHub 이슈와 프로젝트를 통해 할 일을 관리했는데, 이렇게 하니 각 팀의 진행상황을 한번에 보기 힘들었다. 또 요구사항도 노션에 적어두었는데 체계적으로 적혀있지 않아서 확인이 조금 불편했다. Jira 도입 이후에는 이슈 관리가 확실히 편해졌다. 백로그에는 해야할 일, 앞으로 할 일을 쭉 ...00