Frontend
로딩과 빈 결과를 구분하기, 유지보수할 때 남겨 둘 예제
검색 결과가 아직 오지 않은 상태와 실제 결과가 없는 상태가 같은 화면으로 표시되곤 한다. 다시 읽을 수 있는 최소 맥락를 중심으로 작은 예제와 확인 기준을 정리합니다.
THE BUILDER’S NOTE
Engineering.
01 / INSIDE THE BUILD만들며 배우고, 배운 것을 나눕니다.
더 나은 제품을 향한 개발의 기록.
찾고 있던 이야기
작은 발견부터 깊이 있는 고민까지.
카테고리Frontend
필터 초기화Frontend
이미지 자리를 미리 확보하기, 유지보수할 때 남겨 둘 예제
이미지가 늦게 로드되면 아래의 글과 버튼이 갑자기 밀려날 수 있다. 다시 읽을 수 있는 최소 맥락를 중심으로 작은 예제와 확인 기준을 정리합니다.
Frontend
Grid로 카드 열 수 조절하기, 유지보수할 때 남겨 둘 예제
화면 폭마다 카드 개수를 직접 지정하면 미디어 쿼리가 늘어나기 쉽다. 다시 읽을 수 있는 최소 맥락를 중심으로 작은 예제와 확인 기준을 정리합니다.
Frontend
Flex 항목의 최소 너비 이해하기, 유지보수할 때 남겨 둘 예제
긴 제목 하나 때문에 카드와 사이드바가 화면 밖으로 밀려나는 경우가 있다. 다시 읽을 수 있는 최소 맥락를 중심으로 작은 예제와 확인 기준을 정리합니다.
Frontend
입력 필드에 이름 붙이기, 유지보수할 때 남겨 둘 예제
플레이스홀더만 있는 입력창은 값을 입력한 뒤 어떤 항목이었는지 알기 어렵다. 다시 읽을 수 있는 최소 맥락를 중심으로 작은 예제와 확인 기준을 정리합니다.
Frontend
버튼과 링크의 역할 나누기, 유지보수할 때 남겨 둘 예제
클릭할 수 있는 글자를 모두 div로 만들면 키보드 조작과 브라우저의 기본 동작을 따로 구현하게 된다. 다시 읽을 수 있는 최소 맥락를 중심으로 작은 예제와 확인 기준을 정리합니다.