Jest를 사용해보자! - 3편

1. 3편은 버튼 클릭 시, Count 올라가는 걸 만들거야. 1편은 셋팅, 2편은 로그인 폼까지만 만드는 걸 했다. 이번엔 button을 클릭하면 숫자가 1씩 증가하거나 감소하는 컴포넌트를 만들고 테스트를 해보려고 한다. 2. 기본적인 세팅을 해보자. App.test.tsx 파일이 아닌 Counting.test.tsx 파일을 만들어주고, src 밑에도 Counting.tsx란 파일을 생성해주고 코드를 작성해주었다. // Counting.tsx import { useState } from 'react'; export function Counting() { const [count, setCount] = useState(0); const onIncrease = () => { setCount((prev) =>..

2023.10.30

Jest를 사용해보자! - 2편

1. Jest를 사용해보자 - 1편 에 이은 2편 https://ykss.netlify.app/translation/unit-testing-with-jest-react-and-typescript/ (번역) Jest, React 및 Typescript를 사용한 단위 테스트 원문: Unit testing with Jest, React, and TypeScript 💡 소프트웨어 테스트는 무엇인가요? 소프트웨어 테스트(Software Testing… ykss.netlify.app 위의 블로그에서 간단하게 알려주셔서 이걸 활용해서 jest를 사용해보려고 한다. 1편에 이은 글이기 때문에 기본 세팅을 다 해놨다고 가정했다. 만약 못했다면 1편 글을 보고 오도록 하자. https://daily-dev-note95.t..

2023.10.27

'@types/...' 모듈 또는 해당 형식 선언을 찾을 수 없습니다.ts(2307) 에러 대처하기.

개인 프로젝트를 진행하던 중에 해당 에러를 만났다. '@types/CalendarType' 모듈 또는 해당 형식 선언을 찾을 수 없습니다. ts(2307) 나는 vite, react, typescript를 사용 중이어서 아래와 같이 설정을 해놓은 상태였다. //tsconfig.json "compilerOptions": { ... "paths": { "@types/*": ["src/types/*"], }, ... } //vite.config.js import { defineConfig } from 'vite' import react from '@vitejs/plugin-react' import path from 'path' export default defineConfig({ plugins: [react(..

2023.09.27

'string | null' 형식은 'string' 형식에 할당할 수 없습니다. 'null' 형식은 'string' 형식에 할당할 수 없습니다.ts(2322)

개인 프로젝트를 진행하는 중 만난 에러에 대해 기록을 남겨놓는다. // Userstate.ts 파일 import { atom } from "recoil"; ... const userInfo = atom({ key: 'userInfo', default : [{ uid: "", email: "", displayName: "" }] }) ... // Login.tsx 파일 const setUserInfo = useSetRecoilState(userInfo); // 사용자 정보 ... try{ const auth = getAuth(); const { user } = await signInWithEmailAndPasswordService(auth, userId, userPw); setUserInfo([ { uid..

2023.08.21