westagram 멘토님 리뷰를 받았다.
input 내 onchange 이벤트 사용 시, 동일한 이벤트를 반복하여 사용할 때, [e.target.name]을 사용하여 이벤트를 여러번 쓰지 않고 한번에 동일한 이벤트를 발생시킬 수 있다는 피드백을 받았다.

기존 코드

handleIdInput = e => {
    this.setState({
      idValue: `${e.target.value}`,
    });
  };
  handlePwInput = e => {
    this.setState({
      pwValue: `${e.target.value}`,
    });
  };

현재 handleIdInput과 handlePwInput에 동일한 내용이 중복되는 것을 볼 수 있다.
this.setState내 key값을 idValue와 pwValue에서 동일하게 사용할 수 있는 무언가로 바꿀 수 있다면 이벤트를 중복하여 사용할 수 있을 것이라는 피드백을 받았다.

수정 코드

handleInputs = e => {
    this.setState({
      [e.target.name]: e.target.value,
    });
  };`

이벤트 명을 handleInput으로 변경하고 key값에 [e.target.name]을 주어서 해당 이벤트를 반복해서 사용할 수 있도록 만들었다.

event 객체를 사용하여 [e.target.name]을 주고 name을 input 태그의 속성 값으로 주었다.

          <input
            onChange={this.handleInput}
            name="idValue"
            className="id"
            type="text"
            placeholder="전화번호, 사용자 이름 또는 이메일"
          />
          <input
            onChange={this.handleInput}
            name="pwValue"
            className="password"
            type="password"
            placeholder="password"
          />

input 내에 name 속성을 지정하면 이벤트를 반복하여 사용할 수 있다.

react는 jsx라 javascript에서 사용하는 이벤트나 메소드를 거의 동일하게 쓴다고 생각하면 될 것 같다.

코딩은 불필요한 반복을 줄이고 효율성을 찾는 일이라고 생활코딩님께서 말씀하셨는데, 이번 코드리뷰를 통해 불필요한 반복을 줄이는 작업을 해보았고, 너무 신기하고 유익했다:)