React4 리액트 Input 컴포넌트: 모바일 사용자를 위한 키보드 타입 지정 방법 input 요소에 inputMode 속성을 추가하면, 표시되는 키보드 유형을 지정할 수 있습니다. 이 속성은 다양한 모바일 기기에 최적화된 키보드를 사용자에게 제공합니다. inputMode 가 가질 수 있는 다양한 값들은 다음과 같습니다. none text tel url email numeric decimal search inputMode 속성을 원하는 값으로 설정하면 적절한 키보드가 표시되어 사용자 경험을 개선할 수 있습니다. 입력 모드 예제 다음은 inputMode의 사용 예제입니다. 이 예제를 사용하면 React의 input 요소에 inputMode 속성을 추가할 수 있습니다. import React from 'react'; function Example() { return ( Enter your .. 2023. 6. 19. 리액트 상태 관리란? 리액트 상태 관리를 어떻게 하냐에 따라 의미 없는 리렌더 등 성능 이슈가 생길 수 있고 어떤 상태 라이브러리를 쓰며 어떤 구조로 상태를 설계해서 다루냐에 따라서 유지보수 관점에서 코드의 라이프 사이클이 크게 짧아질 수도 길어 질 수도 있다. 전역 상태 라이브러리로 Redux가 여전히 대세로 쓰이고 있고 많은 프로젝트에서 전역 상태가 무분별하게 사용되고 있다. 점차 전역 상태 라이브러리를 안쓰는 게 좋다는 흐름이 생기고 있고 리액트 팀에서는 Recoil을 만들어서 기존의 전역 상태 라이브러리를 대체 하려고 하고 있다. 리액트 상태란 뭘까 리액트 상태란 무엇일까 Props 는 컴포넌트간 전달 되지만 State는 컴포넌트 안에서 관리 되고 시간이 지나면서 바뀌는 동적인 데이터다. State는 해당 State를.. 2022. 6. 9. useEffect의 실행순서 useEffect라는 Hook은 컴포넌트가 화면에 1. 마운드 됐을때 ( 처음 나타났을 때 ) 2. 업데이트 될때 ( 특정 props가 바뀔 때 ) 3. 언마운트 됐을 때 ( 사라질 때 ) 특정 작업을 처리하는 Hook이다. useEffect 를 사용 할 때에는 첫번째 파라미터에는 함수, 두번째 파라미터에는 의존값이 들어있는 배열 (deps)을 넣습니다. 만약에 deps 배열을 비우게 된다면, 컴포넌트가 처음 나타날때에만 useEffect 에 등록한 함수가 호출됩니다. ex) useEffect( ( ) => { } , [] ) useEffect 에서는 함수를 반환 할 수 있는데 이를 cleanup 함수(return 하는곳)라고 부릅니다. cleanup 함수는 useEffect 에 대한 뒷정리를 해준다고 .. 2022. 6. 9. React - icon 사용법 리액트 (React.js) 리액트를 이용하여 웹페이지를 구현하는데 빠르게 아이콘을 사용하고 싶을때 react-icons를 사용할 수 있습니다. 우선 해당 라이브러리를 설치해야 합니다. npm install react-icons --save // npm yarn add react-icons // yarn react-icons.github.io/react-icons/ React Icons React Icons Include popular icons in your React projects easily with react-icons, which utilizes ES6 imports that allows you to include only the icons that your project is using. In.. 2022. 3. 21. 이전 1 다음
