본문 바로가기

💃 타입스크립트 공부4

타입스크립트로 리액트쿼리 쓰는데, 컴포넌트에서 undefined 뜰 때 어제 서버 연결하는 코드를 useQuery를 사용해서 리팩토링을 하려고 하는데 데이터가 필요한 해당 페이지에서 자꾸 undefined가 떴었다. get 에서는 분명 data가 잘 찍히는 걸 확인할 수 있는데, 이상하게 useQuery가 토해낸 data는 undefined가 떴었다. 이것저것 연구하다가 쿼리펑션에 then을 붙여서 response를 바로 state에 set하는식으로 할까도 했지만 const { data } = useQuery({ queryKey: ["getPros1Data"], queryFn: () => { getPros1Data(urlReqCompanyName).then((response) => setDataState(response) ); }, }); 사실 이렇게 코드를 자면 유즈쿼리를.. 2023. 1. 22.
구글 스프레드시트를 서버 API로 연결하기 (리액트+타입스크립트) 오늘 구글 스프레드를 연결해서, input 데이터를 구글 스프레드로 실시간 받아오는 코드 구현을 해봤는데 sheet.best 라이브러리를 사용하여 구글스프레드 링크를 rest api로 만들어주었는데 먼저 구글 sheet에서 (검색창에 sheet라고 치면 됌) sheet를 하나 만들어주고 [공유] - 캡쳐대로 권한 해제하고 링크복사!! https://www.google.com/sheets/about/ Google Docs Google Docs. 좋아하는 사람 57,043명 · 이야기하고 있는 사람들 352명. News and updates about Google Docs, Sheets, Slides, Sites, Forms, and more! www.facebook.com 복사한 그 링크를 데리고 shee.. 2023. 1. 20.
1/17 타입스크립트 공부노트 ( 코딩애플 타입스크립트 강의!! ) tsconfig.json 중요한 부분들 정리 ( 코딩애플 강의 내용 ) { "compilerOptions": { //target'은 타입스크립트파일을 어떤 버전의 자바스크립트로 바꿔줄지 정하는 부분이다. "target": "es5", // 'es3', 'es5', 'es2015', 'es2016', 'es2017','es2018', 'esnext' 가능 "module": "commonjs", //무슨 import 문법 쓸건지 'commonjs', 'amd', 'es2015', 'esnext' "allowJs": true, // js 파일들 ts에서 import해서 쓸 수 있는지 "checkJs": true, // 일반 js 파일에서도 에러체크 여부 "jsx": "preserve", // tsx 파일을 j.. 2023. 1. 17.
[TS] 타입스크립트 기초 공부! / 삼성 인사이트 포스팅 보면서 공부하깅 변수 타입 설정 let str: string = 'hi'; let num: number = 100; let arr: Array = [1, 2, 3]; let arr2: number[] = [1, 2, 3]; let obj: object = {}; let obj2: { name: string, age: number} = { name: 'hoho', age: 22 }; 함수 타입 설정 function add(a: number, b: number): number { return a+b; } //옵셔널 파라미터 function log(a: string, b?: string, c?: string) { console.log(a); } 기본 타입 중 자바스크립트에 존재하지 않는 타입은 다음과 같다. • Tuple: .. 2023. 1. 12.