728x90 반응형 TypeScript8 [NodeJS] gts로 간편하게 TypeScript 프로젝트 생성하기 - 라이브러리 추천 가장 귀찮은 일은? 프로젝트 생성하기! 프로젝트를 하나 생성할 때마다 귀찮지 않은가? 개발자한테 귀찮음이란 해결해야하는 숙제와 같다. 역시 나처럼 생각하는 사람들이 많았는지 좋은 라이브러리가 있어 가지고 왔다. GTS란 구글에서 만든 TypeScript 가이드이다. npx gts init 단 한줄의 명령어로 TypeScript 프로젝트를 생성해준다. 사용법 // 폴더 생성 mkdir [name] // 생성한 폴더로 이동 cd [name] // gts 실행 npx gts init --yarn 사용할 때 아무 폴더에나 명령어를 입력하지 말고 먼저 폴더 생성한 후 gts 명령어를 입력해라. yarn을 사용할 경우 나처럼 명령어 뒤에 --yarn을 붙어주면 된다. package.json이 없다고 만들거냐고 물어.. 2023. 5. 2. [Babel] TypeScript 코드를 JavaScript로 바꾸기 위해 떠난 여정기 시작은 말이지.. TypeScript로 작성한 코드를 JavaScript로 바꾸고 싶을 때는 어떻게 해야할까? 나의 경우 TypeScript로 작성한 코드를 Parse 해야하는 작업을 해야했다. 하지만 메타성 정보가 아닌 실제 동작하는 코드가 runtime에서는 JavaScript이여야 한다는 피드백을 들었다. 그렇게 TypeScript to JavaScript가 되는 여정이 시작되었다..! 혹시 Babel 구성 조차 하지 않았다면 맨 아래 "+ Babel 구성이 되어 있지 않다면"만 참고하길 바란다. Babel을 사용하자 Jest에서 테스트코드를 돌리기 위해 Babel을 처음 써봤었다. 하지만 아직도 Babel은 나한테 낯선 존재로 코드 바꾸기를 들어갈 때 Babel을 고려하지 못했다. 감이 잡하지 않.. 2022. 11. 18. [TS] TypeScript에서 Enum을 쓰면 안된다! (이유, 방안) 우리 회사는 코드리뷰를 하지 않지만 동기가 내 코드를 보고 피드백을 줘서 코드를 고치다가 다시 원점을 돌아간 나의 이야기를 담았다. 사건의 전말 moogose에서 사용하는 Model과 type 체크를 위한 Interface에서 공통으로 사용되는 Object들이 있었다. // Model - mogoose에서 사용하는 파일 interface OS { IOS: 'IOS'; Anderoid: 'Anderoid'; } // Interface - type 체크를 위해 사용되는 파일 const OS = { IOS: 'IOS', Anderoid: 'Anderoid', }; export type OS = typeof OS[keyof typeof OS]; 위 코드와 같이 확실히 중복되어서 사용하고 있었다. 한 쪽에만 ex.. 2022. 10. 13. TypeScript + NodeJS(express) + MongoDB 조합으로 API 서버 만들때 주의할 점 들어서며 NodeJS를 쓰는 개발자들은 처음엔 유연한 JavaScript로 시작했다가 어느순간 TypeScript으로 넘어가게 되고 고마움을 느낍니다. 저도 개발을 하면 할수록 TypeScript의 필요성을 느끼고 있고 잘 이용할려고 합니다. 하지만 TypeScript로 API 서버를 만들면서 의아했던 부분들이 있었습니다. 의문 1. 상황 req.body로 클라이언트로부터 서버로 데이터를 전달 받았을 때 type 오류가 발생하지 않습니다. 제가 생각했을 때 아래 두가지 상황에서 분명 오류가 발생하고 데이터가 저장되지 않아야 하는데 그렇지 않았습니다. 2-1. Interface에 정의한 요소가 아님에도 오류가 발생하지 않는다. // interface.ts export interface UserInterfa.. 2022. 9. 28. TypeScript에서 <T>란 무엇일까? - Generic Type 들어서며 TypeScript는 단순하게 JavaScript에서 Type을 추가해준 언어이다. 하지만 TypeScript를 쓰면서 라는 새로운 아이를 만나게 된다. 처음에는 를 만나거나 쓸 일이 없어 단순하게 넘겼지만 TypeScript로 개발을 하면서 자연스럽게 를 만나게 되었다. 그럼 가 무엇이고 왜 TypeScript에서는 이걸 쓰는지에 대해서 이야기해보도록 하자. 쓰는 이유 JavaScript는 다른 언어들과 달리 type을 입력하지 않기 때문에 자유롭다. 그만큼 위험부담이 높기 때문에 JavaScript 개발자들은 필수적으로 TypeScript를 이용해서 type에 따른 위험 요소를 줄이고자 한다. TypeScript는 함수나 클라스를 사용하기 위해서는 미리 Type을 지정해줘야 한다. 그렇지만 .. 2022. 9. 26. [TypeScript] object vs. Object 차이점 간단하게 변수에 객체를 넣고 싶었다. 그런데 객체에 object와 Object가 있다는 것을 알았다. 문제점 text라는 변수에 object[]라는 타입을 지정했다. 일부러 string을 넣어보니 바로 타입 에러가 표시되어 잘못 지정해줬다는 것을 개발자에게 알려준다. 이럴 경우 코드 작성시 생길 수 있는 에러 확률을 현저히 낮춰준다. 하지만 Object[]를 주면 오류가 뜨지 않는다. 이럴경우 매우 당황스러운 순간이다. 어째서 object는 잡아주고 Object는 잡아주지 않는 것일까? 차이점 object의 경우 원시형이 아닌 모든 값들을 받을 수 있다. 즉, string, number, boolean, symbol, null, undefined가 들어오면 type 에러를 발생한다는 것이다. 하지만 원시.. 2022. 8. 29. [TypeScript] Property 'user' does not exist on type 'Session & Partial<SessionData>'. ts(2339) 해결 세션을 이용해서 로그인을 준비하던 중 에러가 발생했습니다. Property 'user' does not exist on type 'Sesson & Partial'. ts(2339) 아무리 구글링 해봐도 뾰족한 수가 보이지 않아 낙담하던 그때..! https://icecokel.tistory.com/17 TypeScript, Express-session 을 이용한 로그인 처리 (2) 안녕하세요. 오늘은 저번 포스팅에 이어서 TypeScript 환경에서의 Express-session 로그인 처리 포스팅을 진행하겠습니다. 작업환경 express-session, SessionData 수정 로그인처리 1. 작업환경 운영체제 Windows.. icecokel.tistory.com 이 분의 게시물을 보고 해결 😇 이.. 2022. 7. 1. [TypeScript] Optional Chaining - 옵셔널 체이닝 옵셔널 체이닝이란 null이나 nudefind인 값이 반환되면, 즉시 중단하고 undefined를 반환하는 문법입니다. 아마도 객체의 내부를 사용할 때 Object is possibly 'null'.ts(2531) 이라는 오류를 접하게 되었습니다. null 값 처리 중 가장 나은 방법이 옵셔널 체이닝이라는 것을 알게 되었어요. 처음 보는 문법이라 정리해보았습니다! const plusRoute = groupRouter?.route 옵셔널 체이닝은 객체 뒤에 ?를 사용하면 됩니다. 그렇다면 ?는 무슨 역할을 해주는 걸까요? 처음엔 선택적 프로퍼티라고 생각했어요. 하지만..! 선택적 프로퍼티랑 아예 다르더라고요. (당연함..이름도 다름 ㅎ..) const plusRoute = groupRouter ? grou.. 2022. 6. 7. 이전 1 다음 728x90 반응형
