본문 바로가기

부트캠프교육중301

[JS] 자주이용하지만 자주 헷갈리는 splice부분 코드 구현시 자주 이용하는 부분이고 내용이지만 항상 헷갈리고 막상하려고 하면 어찌했더라 자꾸 헷갈리는 부분을 정리했다!! splice! 이런 배열이 있다고 치자. let x = ["a", "b", "c", "d", "e", "f"]; 여기서 a를 지우고 싶다면 x.splice(0, 1) " 0번째 index이고 지우고싶은건 1개이다 " 이런 의미로 생각하면 된다!!! 그럼 배열은 이렇게 된다. let x = ["b", "c", "d", "e", "f"]; 여기에 a를 원하는 자리에 중간에 추가하고싶다면 (만약 원하는 자리가 index2라면) x.splice(2, 0, "a") " index2에서 시작해서 지우고싶은건 0개이고 추가하고싶은건 "a"이다 " 이런 의미로 생각하면 된다!! 2023. 9. 7.
[React] Recoil 정리 Recoil은 Facebook에서 만든 React전용 상태 관리 라이브러리입니다. 상태관리 툴을 사용하면 state값들을 props로 계속 타고들어가지 않아도 되어 코드가 깔끔해집니다. 프로젝트의 규모가 커질수록 상태 관리 또한 필요성이 커지게 됩니다. 대표적인 상태관리툴로는 Redux, Mobx 등이 있습니다. 먼저 Recoil 패키지 설치합니다. npm install recoil recoil을 사용하기 위해서는 사용하고자하는 부모 컴포넌트에다 를 사용해야 합니다. (Recoil 초기연동할때 사용됩니다.) 리코일로 전역상태를 관리할 범위를 RecoilRoot 컴포넌트로 감싸줍니다. RecoilRoot는 리덕스나 컨텍스트의 Provider와 같은 역할을 합니다. index.tsx import React .. 2023. 9. 5.
[React] Recoil 2편 value만 불러오고 싶을때 => useRecoilValue value와 변경 함수를 둘다 얻고 싶으면 => useRecoilState hook const value = useRecoilValue(toDoState); const modFn = useSetRecoilState(toDoState); const [value, modFn] = useRecoilState(toDoState); selector는 atom의 output을 변형시키는 도구이다. selector는 state를 가져다가 뭔가를 return 할거다. selector에는 key와 get function이 필요하다. get function은 인자로 객체를 받는데, 그 객체에는 get function이 들어가 있다. get function이 있어.. 2023. 9. 4.
[React] Ts+eslint+prettier 기초셋팅설정 https://velog.io/@qhgus/React-ESLint-Prettier-Typescript-%EC%84%B8%ED%8C%85%ED%95%98%EA%B8%B0 React + ESLint + Prettier + Typescript 세팅하기 React + Prettier + ESLint + Typescript 세팅 velog.io 이거 블로그 보고 일단 ts+eslint+prettier설정했다 1. 일단 확장프로그램 설치 2. npm install eslint prettier --save-dev 3. npm install @typescript-eslint/eslint-plugin @typescript-eslint/parser --save-dev 이거 했는데 에러가 났다. 버전 문제인것 같았다. 4... 2023. 8. 29.