useState 2

State

State React에서의 State 컴포넌트의 상태컴포넌트가 가지고 있는 데이터나 조건을 나타냄예:Todo List에서의 할 일 목록 == 컴포넌트의 상태→ 사용자가 할 일을 추가하거나 삭제하면 상태가 변경, 이에 따라 UI가 업데이트됨 useState Hook을 사용한 상태 관리 상태 값을 정의하고, 이를 업데이트하는 함수도 함께 제공해야 함 (상태 정의, 변경)const [state, setState] = useState(initialValue);state: 현재 상태 값setState: 상태를 변경하는 함수initialValue: 초기 상태 값상태 값을 변경하면 React가 자동으로 해당 컴포넌트를 다시 렌더링 하여 UI를 업데이트함 State 업데이트 방법 새로운 값을 바로 설정 setState..

GUI Controller

GUI(Graphical User Interface) Controller 사용자가 소프트웨어의 기능을 시각적으로 조작할 수 있도록 도와주는 인터페이스예 : 게임에서 클릭할 수 있는 메뉴 버튼/ 설정 패널   Leva 라이브러리 활용 LevaReact 애플리케이션에서 사용 가능한 경량화된 GUI 컨트롤러 라이브러리실시간으로 장면 속성을 조정할 수 있는 인터페이스를 제공 npm i leva useControls 훅을 사용하여 다양한 입력 컨트롤을 쉽게 생성하고 관리할 수 있음장면 내 요소의 속성을 실시간으로 조정 가능코드 몇 줄의 추가로 GUI 패널을 추가할 수 있어 편리  Leva를 활용한 3D 객체 컨트롤 useControls를 이용한 속성 조정const options = useMemo(() => { ..

728x90