운동 및 약물 계획 관리 화면 구현
계획 입력 및 관리 화면 개발
기능 개요
PlanManagementScreen은 사용자가 운동 계획과 약물 복용 계획을 입력하고 관리할 수 있는 화면입니다. 다음 두 종류의 계획을 지원합니다:
운동 계획: 시작일과 종료일 + 일일 운동 시간(분 단위) + 세부 내용
약물 계획: 시작일과 종료일 + 복용 용량(문자열) + 세부 내용
사용자가 입력한 계획은 로컬 AsyncStorage에 저장되어 ...
7월 21일 07:27에 게시됨
React에서 검색 폼과 리스트 렌더링 최적화하기
React에서 검색 조건이 있는 리스트 화면을 구현할 때, 입력값 변경마다 API가 호출되는 문제를 방지하고 검색 버튼 클릭 시에만 요청하도록 설계하는 방법을 살펴봅니다.
문제 상황
검색 조건을 상태로 관리하고 useEffect로 감시하면 입력값이 바뀔 때마다 불필요한 API 호출이 발생합니다.
const [filterCriteria, setFilterCriteria] = useState({
keyword: '',
...
7월 20일 04:30에 게시됨
React 함수 컴포넌트의 상태 및 효과 제어 기법
React Hook의 핵심 개념
React 16.8 이후 도입된 Hook은 클래스 컴포넌트 없이도 상태와 생명주기 처리가 가능한 기능을 제공합니다. 함수형 컴포넌트에서도 상태 관리, 사이드 이펙트 처리, 참조 접근 등 다양한 기능을 활용할 수 있게 되었습니다.
useState: 상태 관리
useState는 함수 컴포넌트 내에서 상태를 선언하고 조작할 수 있도록 해주는 기본 훅입니다. 초기값 ...
7월 7일 20:40에 게시됨
React 클래스형 컴포넌트와 주요 Hooks 정리
클래스형 컴포넌트
클래스형 컴포넌트는 ES6 클래스 문법을 기반으로 React.Component를 상속받아 생성되는 React 컴포넌트입니다.
React 클래스형 컴포넌트는 state, 생명주기 메서드 등 다양한 기능을 기본적으로 제공합니다. 이러한 기능을 사용하려면 단순히 React.Component를 상속받으면 됩니다.
하지만 클래스형 컴포넌트는 복잡성이 높아 문제 해결에 과도한 구조 ...
6월 14일 17:53에 게시됨