IT오류잡기/React공부하기10 [React.js] useReducer, useState은 언제 사용 하는가? React 함수형 컴포넌트를 사용하면서 가장 많이 사용되는 useState가 있다 useReducer 등 여러 함수가 있는데, 차이점과 사용 용도를 공부하여 정리해 보았다. state를 관리하기 위한 함수 - useState, useReducer 대부분의 사람들이 useSate는 사용할 줄 안다. 하지만 useReducer은 무엇인가 ??????? 차이점은??? 인터넷을 찾아보면 useState 와 useReducer의 사용방법 등 예시가 많이 널려있다.(모든 블로그에 사용 방법이 친절히 설명되어있어 해당 블로그에서는 스킵한다.) 그래서 언제 useSate를 사용하고 언제 useReducer를 사용한다는 말인가? 글쓴이는 useSate와 useReducer를 언제 사용하는지 필자의 온전한 의견으로 설명하.. 2022. 11. 16. [React.js] yarn.lock / package-lock.json 파일을 혹시 .gitignore에 포함 하셨나요 ? 안녕하세요. 오늘 문득 yarn.lock 파일에 대해서 궁금하여 공부를 해 보았습니다. 1. yarn.lock / package-lock.json 파일은 왜 있는 건가요? 패키지 잠금 파일로 패키지 매니저 npm을 사용할 경우 package-lockjson 파일을 , yarn을 사용할 경우 yarn.lock 파일이 생성됩니다. 프로젝트의 패키지는 package.json에 모두 정의되어있습니다. 해당 파일에 패키지 이름과 버전이 나열되어있습니다. package.json에 보면 패키지 버전 앞에 ^ 혹은 ~ 혹은 아무것도 없는 경우로 나누어집니다. ^ 의미 : 해당 버전 이상 ~ 미만의 버전을 설치 (예를 들어 "^12.4.1" 이면 "12.4.1"이상 , "13.0.0"미만) 패키지는 끊임없이 버전이 변경.. 2022. 11. 15. [React js] input, textarea 글자 수 제한 안녕하세요. 고집프로그래머 입니다. 오늘 간단히 react에서 input이나 textarea 글자 수 제한 관련 포스팅 입니다. 정말 간단 히 "maxlength"만 추가해 주면 됩니다. 그럼 이 이상 작업 되도라도 끝~! 추가로, 글자 수 표현하기 변수 (value) value.replace(//gm, "\n").length 하면 띄어쓰기, 엔터 등 모두 카운트 되도록 길이를 실시간으로 변화하는 값을 볼 수 있습니다. 감사합니다. 2022. 7. 7. [React js] input type checkbox로 toggle 만들기 안녕하세요 . 고집 프로그래머 입니다. 최근에 재택을 시작하면서 유익한 React 정보를 자주 올리려고 합니다. 기존 형식으로 네모 체크박스 이런 형태를 많이 보셨을 텐데요 , 간혹가다 인데, 토글(toggle)형태로 표현되는 경우가 있습니다. 다른것이 문제되는 건 없는데, defualt value 설정때문에 저는 조금 어려웠습니다. 기존에 구글링 하면, 이런식으로 defualtValue로 표현했는데, type이 checkbox다보니 해당 기능은 잘 안먹히는 경우가 많았습니다. 그래서 저는 , const [checked, setChecked] = React.useState(true); setChecked(!checked) /> 이렇게 간단히 구현할 수 있었습니다. 만약 API에서 불러오는 값을 defua.. 2022. 7. 5. 이전 1 2 3 다음