Frontend
이미지 자리를 미리 확보하기, 리뷰에서 함께 확인할 질문
이미지가 늦게 로드되면 아래의 글과 버튼이 갑자기 밀려날 수 있다. 코드 밖의 맥락 전달하기를 중심으로 작은 예제와 확인 기준을 정리합니다.
THE BUILDER’S NOTE
Engineering.
01 / INSIDE THE BUILD만들며 배우고, 배운 것을 나눕니다.
더 나은 제품을 향한 개발의 기록.
찾고 있던 이야기
작은 발견부터 깊이 있는 고민까지.
카테고리Frontend
필터 초기화Frontend
Grid로 카드 열 수 조절하기, 리뷰에서 함께 확인할 질문
화면 폭마다 카드 개수를 직접 지정하면 미디어 쿼리가 늘어나기 쉽다. 코드 밖의 맥락 전달하기를 중심으로 작은 예제와 확인 기준을 정리합니다.
Frontend
Flex 항목의 최소 너비 이해하기, 리뷰에서 함께 확인할 질문
긴 제목 하나 때문에 카드와 사이드바가 화면 밖으로 밀려나는 경우가 있다. 코드 밖의 맥락 전달하기를 중심으로 작은 예제와 확인 기준을 정리합니다.
Frontend
입력 필드에 이름 붙이기, 리뷰에서 함께 확인할 질문
플레이스홀더만 있는 입력창은 값을 입력한 뒤 어떤 항목이었는지 알기 어렵다. 코드 밖의 맥락 전달하기를 중심으로 작은 예제와 확인 기준을 정리합니다.
Frontend
버튼과 링크의 역할 나누기, 리뷰에서 함께 확인할 질문
클릭할 수 있는 글자를 모두 div로 만들면 키보드 조작과 브라우저의 기본 동작을 따로 구현하게 된다. 코드 밖의 맥락 전달하기를 중심으로 작은 예제와 확인 기준을 정리합니다.
Frontend
브라우저 저장값의 버전 관리, 대안을 선택하는 기준 정리
로컬 저장소의 데이터 모양을 바꾼 뒤 예전 값 때문에 화면 초기화가 실패할 수 있다. 장점과 비용을 함께 보기를 중심으로 작은 예제와 확인 기준을 정리합니다.