분류 전체보기(20)
-
React (2) - TypeScript 에서 setState props로 넘길 때 Type 지정하는 법
상위 컴포넌트에서 useState 함수를 넘길 때 아래 처럼 기존에 해왔던 것처럼 void로 넘겼는데, react 에서 더 적절한 타입을 제공하고 있었다 interface ITestProps{ setTest: () => void } SetStateAction 과 Dispatch 이다. import React, { SetStateAction, Dispatch } from 'react' interface Props { setTest: Dispatch } 위에 코드처럼 타입을 작성하게 되면 어떤 타입의 값을 넣어야하는지 훨씬 쉽게 알 수 있다. https://newbedev.com/passing-usestate-as-props-in-typescript Passing useState as props in typ..
2022.04.04 -
React (1) - redux-saga
redux-thunk 대신 redux-saga 를 사용하는 이유 thunk 는 dispatch 를 여러번 불러오는 기능만 가지고 있다. npm i redux-saga npm i next-redux-saga redux-saga 액션을 모니터링하고 있다가, 특정 액션이 발생하면 이에 따라 특정 작업을 하는 방식으로 사용합니다. 여기서 특정 작업이란, 특장 자바스크립트를 실행하는 것 일수도 있고, 다른 액션을 디스패치 하는 것 일수도 있고, 현재 상태를 불러오는 것 일수도 있습니다. redux-saga는 redux-thunk로 못하는 다양한 작업들을 처리 할 수 있습니다. 예를 들자면.. 비동기 작업을 할 때 기존 요청을 취소 처리 할 수 있습니다. 특정 액션이 발생했을 때 이에 따라 다른 액션이 디스패치되게..
2022.04.03 -
JavaScript (4) - getElementById vs querySelecter
getElementById let element = document.getElementById(id); // id passwd 인 element 를 가지고 올 때 let passwd = document.getElementById("passwd"); querySelecter let element = document.querySelecter(selectors); // id passwd 인 element 를 가지고 올 때 let passwd = document.querySelecter("#passwd");
2022.04.03 -
JavaScript (3) - Window Size, Window.scrollTo, Window.scrollBy, Window Load 설명
Global Object ex) innerWidth ← Window 안의 innerWidth 를 가져온다. DOM - Document Object Model BOM - Browsers Object Model JavaScript Window Size window.screen 모니터 사이즈 - 브라우저 사이즈가 변경되어도 사이즈를 유지한다. window.outer 브라우저에 있는 url 상단,탭까지의 사이즈 window.inner 웹페이지(스크롤바 포함) documentElement.clientWidth 웹페이지(스크롤바 제외) page x,y (문서의 시작점) client x,y (브라우저 시작점) Window Coordinates scroll_to.addEventListener('click', event..
2022.04.03 -
JavaScript (2) - find() , filter() 함수 설명
find() 함수가 특정 조건에 부합하는 배열의 첫번째 값만을 리턴한다고 한다면, filter() 함수는 특정 조건에 부합하는 배열의 모든 값을 배열 형태로 리턴합니다. find() const arr = [ {name: 'apple', price : 1000}, {name: 'banana', price : 2000}, {name: 'apple', price: 3000} ]; arr.find((item)=>item.name === 'apple'); // {name: "apple", price: 3000} filter() const arr = [ {name: 'apple', price : 1000}, {name: 'banana', price : 2000}, {name: 'apple', price: 3000}..
2022.04.03 -
npm install 시 network timeout 에러 발생
ubuntu linux 에 파일을 올리고 npm install 을 실행 하였으나 network timeout error 가 발생하였습니다. `network timeout at : [https://registery](https://registery).npmjs.org/semver/-/semver-6.3.0.tgz` npm 이 잘못 설치된 것 같아서 node -v //노드 버전 확인 노드 버전을 확인해보니 v10.19.0 으로 굉장히 낮았습니다. 그래서 삭제 후 노드 버전을 최신버전으로 설치 하였으나 계속해서 v10.19.0 으로만 설치가 되었습니다. 원하는 버전을 설치하기위해 curl 을 우선 설치하였습니다. apt-get install curl - curl 설치 $ curl -sL []() | sudo ..
2022.04.02