목록frontend/react (25)
DEVLOG
React 프로젝트 typescript로 변경하기 : react로 세팅되어있는 프로젝트에 타입스크립트를 적용해보자! 타입스크립트 라이브러리 설치 yarn add typescript @types/node @types/react @types/react-dom @types/jest node, react 등 타입스크립트 라이브러리를 설치합니다. @types가 앞에 붙으면 타입스크립트가 지원되는 라이브러리입니다! + 기존 프로젝트를 ts로 변경하는게 아니라 그냥 typescript프로젝트로 시작할거면 아래 명령어로 CRA! npx create-react-app my-app --template typescript jsconfig.json > tsconfig.json 기존에 있던 jsconfig 파일을 tsconfi..
add 메소드 Key Shorthand years y quarters Q months M weeks w days d hours h minutes m seconds s milliseconds ms moment().add(7, 'days').add(1, 'months'); // with chaining moment().add({days:7,months:1}); // with object literal moment().add(1000000, 'milliseconds'); // a million milliseconds moment().add(360, 'days'); // 360 days moment([2021, 0, 31]); // January 31 moment([2021, 0, 31]).add(1, 'mon..
history 객체 라우트로 사용된 컴포넌트에게 match, location 과 함께 전달되는 props 중 하나이다. 이 객체를 통하여, 우리가 컴포넌트 내에 구현하는 메소드에서 라우터에 직접 접근을 할 수 있다 ex. 뒤로가기, 홈으로 이동, 특정 경로로 이동, 이탈 방지 등.. ○ 뒤로가기 history.goBack(); 한단계전으로 이동 ○ 특정 경로로 이동 history.push('/경로'); '경로'부분에 이동하고자 하는 경로를 /를 포함하여 써주면 된다. +홈으로 이동 history.push('/'); ○ 이탈 방지 history.block(); useEffect를 함께 사용하여 .block을 걸어주면 버튼을 눌러도 페이지가 이동되지 않는다. history.block('문구'); 단, blo..
URL파라미터와 쿼리 페이지 주소를 정의할 때 가끔 유동적인 값을 전달해야하는 경우가 있다. 이 경우 파라미터와 쿼리로 나눌 수 있다. · 파라미터 예시 : /profiles/merorii · 쿼리 예시 : /about?details=true 파라미터와 쿼리 두 가지 중 무조건 이 상황엔 이거!라고 정해진 규칙은 없다. 다만 일반적으로 파라미터는 특정 아이디 혹인 이름을 사용하여 조회할 때 사용하고, 쿼리는 우리가 어떤 키워들르 검색하거나 페이지에 필요한 옵션을 전달할 때 사용한다. ○ URL 파라미터 match 객체 URL 파라미터를 사용할 떄는 라우트로 사용되는 컴포넌트에서 받아오는 match라는 객체안의 params값을 참조한다. match객체 안에는 현재 컴포넌트가 어떤 경로 규칙에 의해 보이는지..