내맘대로 개발일지

[React] Warning: Each child in a list should have a unique "key" prop.

📱테스트 환경"react": "18.3.0","react-dom": "18.3.0"map 을 사용하다보면Warning: Each child in a list should have a unique "key" prop.이런 경고 에러메시지를 볼 수 있다.해당 코드를 보면 {category && category[2] && category[2].map((v, i) => ( setSelected(prev => (prev === v.no ? null : v.no)) }> {v.name} {i !== category[2].length - 1 && } ..

📱테스트 환경"react": "18.3.1","react-dom": "^18.3.1","react-native": "0.76.1"회사에서 지원받은 맥미니가 용량이 엄청적다 ..256GB 짜리인데 시스템만 절반을 넘게 차지하니까 .. 프로젝트 뭐 설정하고나면용량이 없어서 뭐 추가만 하려고 하면 해당 에러를 만나게 되는데해당 원인은 용량부족이다..해결방법은 아주아주 간단하다.yarn cache celan생각보다 yarn 에서 캐시로 들고있는게 많아서 클린 해주고 진행하면대부분 라이브러리 추가는 문제없이 진행될꺼다.이래도 문제가있다면 이제 저장공간가서 열심히 필요없는걸 지워주도록 하자.

📱테스트 환경"react": "18.3.1","react-dom": "^18.3.1","react-native": "0.76.1"FlatList 를 사용한뒤로 navigation 을 사용할때마다저런 에러가 뜨는데 처음에는 관련있는 에러인지도 몰랐는데UI 업데이트 되면서 충돌에러가 발생하는 것이라고 한다.해결방법은 간단한데 item[rowKey]?.toString() || Math.random().toString() } // 고유 key renderItem={({item}) => ( {renderRow(item)} )} />removeClippedSubviews={false}이거 한줄 추가해주면 해결된다.해당 줄을 추가하면 U..

📱테스트 환경"react": "18.3.1","react-dom": "^18.3.1","react-native": "0.76.1","@react-native-picker/picker": "^2.7.7","react-native-picker-select": "^9.2.0", Android 나 Web 에서는 잘 되는게 Ios 에서만 이상하게눌러도 반응이 없었다.ChatGPT 나 스택오버플로우 깃 이슈 뭐 안본데가 없고 ..안해본게 없었는데 ..나와같은 이슈가 없어서버전도 다운그레이드 해보고 .. 삭제했다 다시깔아보고 ..다 의미없는 짓이였다 ..해결방법은 의외로 간단했는데 setValue && setValue(v)} items={items} placeholder={{label: place..

Simulator device failed to launch .Domain: FBSOpenApplicationServiceErrorDomainCode: 3Failure Reason: The process did launch, but has since exited or crashed.User Info: { BSErrorCodeDescription = ProcessExited; DVTErrorCreationDateKey = "2025-02-07 01:38:23 +0000"; IDERunOperationFailingWorker = IDELaunchiPhoneSimulatorLauncher; NSLocalizedFailure = "The request to open failed."; ..

📱테스트 환경"next": "15.1.3","react": "^19.0.0","react-dom": "^19.0.0",해당 에러만 잡고 잔다는게 .. 벌써 새벽 2시 36분 ..ChahGPT 도 자꾸 거짓말만 하고 해결못해서 진짜너무 피곤하고 화나는 상황에 열심히 구글링을 통해역시 공식홈페이지만한게 없다 징짜 .. NextJs 14.0.3 issue · Issue #46053 · ant-design/ant-designReproduction link https://ibb.co/tHKtCc7 Steps to reproduce just update nextjs to latest version and you will see there's an issue with antd config provider What ..

📱테스트 환경"react": "18.3.0","react-dom": "18.3.0"Antd DatePicker 를 사용하면 영어로 나온다.이를 위해서 locale 을 한글로 바꿔주는 작업을 해야하는데문서에 나와있는대로 바꾸면 반쪽짜리가 되는 이슈가 있을 것 이다.import {ConfigProvider} from "antd";import ko_KR from "antd/lib/locale/ko_KR"; 이 뿐만 아니라 dayjs locale 도 한글로 바꿔줘야한다.다른 블로그나 다른 곳에서 보면 moment 를 쓰라는 곳도 있지만왠만하면 dayjs 를 사용할 수 있도록 하자.이유는 여기서 보면 된다. [React] Moment 대신 Day.js📱테스트 환경"react": "18.3.0","react-..

📱테스트 환경"react": "18.3.0","react-dom": "18.3.0"드래그 앤 드랍 기능을 만들기 위해서여러 라이브러리를 살펴봤지만 폴더구조까지 가진 라이브러리가딱히 보이지도않았고 맘에 드는게 없었다.그러다가 react-complex-tree 를 딱 봤는데 react-complex-treeUnopinionated Accessible Tree Component with Multi-Select and Drag-And-Drop. Latest version: 2.4.6, last published: a month ago. Start using react-complex-tree in your project by running `npm i react-complex-tree`. There are 2..

📱테스트 환경"react": "18.3.0","react-dom": "18.3.0"숫자에 쉼표(,) 를 표기하는 방법에 가장 먼저 떠오르는 것은replice 를 이용한 정규식 사용 방법일텐데 ( 내가 그랬다 )찾아보니까 Intl.NumberFormat 이라는 함수를 사용하면 손쉽게표시할 수 있다는 꿀팁을 전달들었다.Intl 은 자바스크립트에서 기본으로 제공하는 함수로 다음과 같이 사용할 수 있다.Intl.NumberFormat('ko-KR').format(Number(text))Number 타입이 와야해서 숫자면 상관없다.나는 string 으로 넘어와서 형변환을 통해 사용했다.'ko-KR' 은 해당 지역 숫자 표기 지원 방식으로 'en-US' 등을 사용할 수 있다.

📱테스트 환경"react": "18.3.0","react-dom": "18.3.0"props 로 Element 를 넘길때가 있어서 기존에 사용하던JSX.Element 를 타입으로 줬다.내 코드는 다음과 같다.export const CardHeader = ({ label, info, onClick = () => { }, buttonText, buttonWidth, ..