🥬 상추의 공간

배웠던걸 기반으로 useState를 이용해 단위변환 기능을 만들어보자. 먼저 input에 입력한 값이 화면에 실시간으로 보이도록 만들어보자. onChange를 통해 사용자가 다른 값을 입력할 때마다 value 업데이트 시킨다. const App = () => { const [minutes, setMinutes] = React.useState(0); const onChange = (e) => { setMinutes(e.target.value); }; return ( Super Converter Minutes You want to convert {minutes} Hours ); }; input의 value를 연결시켜주는 이유는 input 값을 외부에서 수정해주기 위해서다. label에서 for은 js용어가 ..

Understanding State state는 기본적으로 데이터가 저장되는 곳이다. 아래 코드는 별로 좋지 않은 방법이다. const root = ReactDOM.createRoot(document.getElementById("root")); let counter = 0; function countUp() { counter += 1; } const Container = () => ( Total clicks: {counter} Click me ); root.render(); // 렌더링 컴포넌트는 화면 페이지를 처음 로드했을 때 딱 한번 렌더링되므로 그 이후로는 어떤 작업을 해도 UI가 업데이트되지 않는다. 그래서 button을 눌러도 counter 변수 자체는 증가하지만 UI는 계속해서 0을 표시한다...

학습 키워드props, state, event handling, useState, useEffect 미션 저번 미션을 통해 만든 회원가입 폼을 학습 키워드 기반으로 다음과 같이 기능을 추가해야 한다.이메일, 비밀번호, 비밀번호체크, 이름, 나이를 useState로 작성하고, input 컴포넌트에서 이벤트를 통해 state를 변경useEffect를 사용해 비밀번호 재확인이 올바르지 않으면 올바르지 않다는 문구 추가 심화 미션필수 항목을 입력하지 않았을 때와 비밀번호 재확인이 올바르지 않을 때 가입하기 버튼이 클릭할 수 없도록 비활성화클릭했을 때 폼 내용이 모두 지워지는 초기화 버튼 만들기 결과물    코드먼저, 클래스 시간 때 멘토님이 몇가지 팁을 알려주셔서 그것에 대해 적용을 했다.멘토님은 파일 확장자를..