Conversation
|
수고 하셨습니다 ! 스프리트 미션 하시느라 정말 수고 많으셨어요. |
| export interface GetArticlesQuery { | ||
| page?: number; | ||
| pageSize?: number; | ||
| orderBy: "recent" | "like"; | ||
| keyword?: string; | ||
| } | ||
|
|
|
|
||
| useEffect(() => { | ||
| const { title, content } = articleValues; | ||
| title !== "" && content !== "" ? setDisabled(false) : setDisabled(true); |
There was a problem hiding this comment.
삼항 연산자는 기본적으로 가독성이 좋지 못합니다 !
다음과 같이 코드를 작성할 수 있어요:
| title !== "" && content !== "" ? setDisabled(false) : setDisabled(true); | |
| if (title !== "" && content !== "") { | |
| setDisabled(false); | |
| } else { | |
| setDisabled(true); | |
| } |
There was a problem hiding this comment.
그리고 if 문 안에서 분기를 나누고 true/false를 직접 기입하는 경우:
setDisabled(title === "" || content === "");위와 같이 조건문 자체를 변수로 활용할 수 있습니다 ! 😊
| }; | ||
|
|
||
| useEffect(() => { | ||
| comment !== "" ? setDisabled(false) : setDisabled(true); |
There was a problem hiding this comment.
여기도 삼항연산자군요 !
한 번 위에 예시대로 직접 조건문을 변수로 활용하여 바꿔보시겠어요?
| export interface GetArticlesQuery { | ||
| page?: number; | ||
| pageSize?: number; | ||
| orderBy: "recent" | "like"; | ||
| keyword?: string; | ||
| } |
There was a problem hiding this comment.
음 해당 타입은 API 함수와 가까이 있는게 어떨까요?
API에 필요한 파라메터 타입을 지정한 것 같아요. API 쿼리에 필요한 파라메터가 맞다면 API 함수와 가까이 둬보시고 사용해볼까요 ?
| href, | ||
| activePaths, | ||
| children, | ||
| }: PropsWithChildren<LinkType>) => { |
There was a problem hiding this comment.
오올 굳굳 !! 리액트 내장 타입을 사용하셨군요.
이미 정의되어 있다면 굳이 다시 정의할 필요 없지요 ㅎㅎㅎ
| className="absolute top-2/4 left-5 -translate-y-2/4" | ||
| /> | ||
| <input | ||
| type="search" |
| <form onSubmit={handleSubmitSearch} className="flex-1 relative"> | ||
| <Image | ||
| src={searchIcon} | ||
| alt="검색" |
There was a problem hiding this comment.
단순 장식용으로 있을 경우 ""로 나타낼 수 있습니다 !
| alt="검색" | |
| alt="" |
장식 이미지는 페이지 콘텐츠에 정보를 추가하지 않습니다. 예를 들어, 이미지에서 제공하는 정보는 인접한 텍스트를 사용하여 이미 제공될 수도 있고, 웹 사이트를 시각적으로 더욱 매력적으로 만들기 위해 이미지가 포함될 수도 있습니다.
이러한 경우 스크린 리더와 같은 보조 기술에서 무시할 수 있도록 null(빈) alt텍스트를 제공해야 합니다( ). alt=""이러한 유형의 이미지에 대한 텍스트 값은 화면 판독기 출력에 청각적 혼란을 추가하거나 주제가 인접한 텍스트의 주제와 다른 경우 사용자의 주의를 산만하게 할 수 있습니다. 속성 을 생략하는 alt것도 옵션이 아닙니다. 속성이 제공되지 않으면 일부 화면 판독기가 이미지의 파일 이름을 대신 알려주기 때문입니다.
| const SubmitButton = ({ | ||
| disabled, | ||
| children, | ||
| }: PropsWithChildren<ISubmitButtonProps>) => { |
There was a problem hiding this comment.
버튼 타입은 이미 정의되어 있어요 !:
| const SubmitButton = ({ | |
| disabled, | |
| children, | |
| }: PropsWithChildren<ISubmitButtonProps>) => { | |
| const SubmitButton = ({ | |
| disabled, | |
| children, | |
| }: React.ButtonHTMLAttributes<HTMLButtonElement>) => { |
위와 같이 정의해볼 수 있습니다. 😊 disabeld와 children은 이미 해당 타입에 존재합니다 !
|
훌륭합니다 은빈님 ! 이 전의 피드백 정말 잘 반영해주셨군요 😊👍 |
요구사항
기본
[sprint10]
멘토에게