본문 바로가기

React/Library2

redux toolkit 라이브러리 설치 및 세팅 *아래의 프로젝트는 타입스크립트를 사용합니다. ts 를 사용하지 않는다면 js 파일로 만들어 주세용* 참고로 아래처럼 폴더를 만들어 파일을 넣어두는 것은 그저 편한 관리를 위한 것으로 공식 문서에서 권장하는 것이므로, 굳이 저렇게 안해도 제대로 로직만 잘쓰면 잘 돌아가긴 한당 그럼 일단 yarn으로 라이브러리 설치부터 하자 아래의 코드들을 터미널에 입력하여 라이브러리를 설치하자 yarn add @reduxjs/toolkit yarn add redux react-redux yarn add --dev @types/react-redux 그 후 프로젝트 폴더 내의 src 폴더에 store 폴더를 만든다 store 폴더 안에 hooks.ts 파일을 만들고 아래의 코드를 붙여 넣어주자 import { TypedUs.. 2022. 12. 14.
classnames 사용법 classnames 모듈은 html요소에서 클래스를 조건부로 넣거나 빼줄때 따로 조건문 필요없이 쉽게 작성하게 해주는 라이브러리다 만약 내가 돈이 있을때만 'can-buy' 라는 클래스명을 추가하고, 돈이 없을때는 클래스를 빼고 싶다면 아래와 같이 조건문을 사용해서 클래스를 추가하는 방법을 사용할 수 있지만 export default Tok = () => { let hasMoney = true; const myClasses = [sleepy, hungry]; if (hasMoney) { myClass.push('can-buy'); } return ( Hello Tokkissi ) } classnames 라이브러리를 사용하면 자바스크립트 조건문을 사용하지 않고도 같은 의미를 말할수 있다. 아래와 같이 사용.. 2022. 11. 26.