2022/02/05 2

[React] render props 한번 써보자

1. Render Props란 "render prop"란, React 컴포넌트 간에 코드를 공유하기 위해 함수 props를 이용하는 간단한 테크닉입니다. Render Props – React A JavaScript library for building user interfaces ko.reactjs.org Render Props에 대해 React 공식문서에 이렇게 나온다. render props 패턴으로 구현된 컴포넌트는 자체적으로 렌더링 로직을 구현하는 대신 react 엘리먼트 요소를 반환하고 이를 호출하는 함수를 사용한다. ( Hello {data.target} )}/> 2. 예시 공식문서를 바탕으로 함수형으로 만들어봤다. Mouse 컴포넌트는 마우스가 움직일 때마다 좌표를 알 수 있는 컴포넌트다. ..

React 2022.02.05

[개발자의 글쓰기] 3장. 사용자와 소통하는 에러 메시지 쓰기

이 글은 "개발자의 글쓰기"를 읽고 좋은 구절들을 기록하거나 느낀 점을 기록하는 글입니다. 1. 사용자 에러 메시지를 제대로 쓰는 법 사용자 에러 메시지에는 에러의 내용, 원인, 해결 방법이 포함돼야 한다. 내용 -> 원인 -> 해결 방법 순으로 나타낸다. 내용과 원인이 복잡하다면 해결 방법을 제일 먼저 알려 주는 것도 좋은 방법이다. 해결 방법 -> 원인 -> 내용 순으로 나타낸다. 2. 사용자의 에러를 줄이는 메시지 구조화 에러 메시지를 사용할 때 알림 창을 사용한다.아래의 사진은 windows에서 사용하는 알림 창이다. 아래의 사진은 ios에서 사용하는 알림 창이다. 같은 알림 창이 지만 확인, 취소 버튼의 순서가 서로 반대로 되어있다. OS에 따라서 순서가 달라 무엇을 따라가라고 하기엔 어렵지만 ..