[React][TS] MSW 2.0 오늘은 MSW 를 뿌셨다!! 어제 반나절 동안 파헤쳐보다 답 없는 것 같아서 포기하려던 찰나!나의 번뜩이는 정신과 MSW 공식문서와 어떤 멋진 블로거 분의 글과 지피티의 합작으로 성공했다 미텨따...ㅎㅎㅎㅎ 이거 뜨자마자 얼굴에 해가 뜸 ㅋㅋㅋㅋㅋㅋㅋ 욱기다 단순한 내 기분^^MSWMock Service Worker.브라우저에서 API 요청을 가로채고, 실제 서버와의 통신 없이 모의 데이터를 응답으로 처리할 수 있도록 해주는 라이브러리. So, MSW를 사용하면 server 없이, 실제로 API를 개발하지 않고도, 프론트 단에서 가짜 api와 data를 자체적으로 만들어 화면을 개발할 수 있다.그냥 mock 데이터를 api로 호출해서 불러올 수 있게 해주는 라이브러리. 라고 보면 된다. MSW 로 가짜 .. 2025. 5. 13. [React][TS] useLocation useLocation현재 위치(작업중인 코드)의 location 객체를 반환.위치가 변경될 때마다 새로운 location 객체를 반환하기에, 위치 변화에 따른 동적인 UI 업데이트나 조건부 렌더링에 유용하게 사용 가능. useLoaction의 주요 속성- pathname : 현재 위치의 경로- search : 현재 위치의 query parameter- hash : 현재 위치의 hash- state : 라우팅된 component로 전달되는 상태 객체- key : location 객체의 고유 식별 useLocation 객체의 state 속성 예제import { useLocation } from 'react-router-dom';interface SelectedTable { table_id: string; .. 2025. 1. 15. [TS] TypeScript 기초 변수 선언let스코프 범위 : 블록 스코프 (중괄호)변수 선언 이후 (메모리 주소) 값 변경 가능const스코프 범위 : 블록 스코프 (중괄호)변수 선언 이후 메모리 주소 값(레퍼런스) 변경 불가능배열 or 객체 할당 시 값 변경 가능var스코프 범위 : 함수 스코프 or 전역 스코프호이스팅 : 선언 전 접근 가능 (undefined)*사용 권장하지 않음 Type Annotations변수 선언let username: string = "nowag"; 객체 변수 선언let myInfo : { name: string; height: number; isConditionGood: boolean; gender?: string // 선택적 속성}= { name: "nowag", hei.. 2025. 1. 14. [TS] TypeScript 가 뭐야 TypeScriptJavaScript에 type을 부여한 언어, JacaScript의 확장판. TypeScript를 쓰는 이유1. 에러 사전 방지TypeScript의 정적 타입으로 코드의 가독성이 높아지고 타입 안정성이 보장된다. 2. 유지보수타입 명시가 가능하기에, 유지보수 및 협업 시 용이하다. 3. 코드 자동완성과 가이드FrontEnd 개발 시 가장 빈번히 사용되는 vscode 툴의 내부가 TypeScript 로 작성되어 있어, TypeScript 개발에 최적화 되어있다. 4. 높은 생산성직관적인 코드 작성이 가능하고, 실행속도가 매우 빠르다. TypeScript vs JavaScript TypeScriptJavaScript타입 결정 방식정적동적자동 타입 변환XO타입확인/에러검출 시기컴파일런타임장점.. 2025. 1. 13. 이전 1 다음 728x90 반응형
