8/24 (목) 퀴즈 풀이 디렉토리에 TypeScript를 적용하다 TIL, TIT — 개발 공부 기록

공부한 것

LeetCode #141. Linked List Cycle
LeetCode - The World's Leading Online Programming Learning Platform
Level up your coding skills and quickly land a job. This is the best place to expand your knowledge and get prepared for your next interview.
https://leetcode.com/problems/linked-list-cycle/description/?envType=list&envId=rus4c4ci
⇒ 주어진 링크드 리스트에 순환하는 지점이 있는지를 검사하는 문제다. 바로 얼마전에 배운 Floyd’s Tortoise & Hare 알고리즘을 이용해 쉽게 풀어냈다.

구상 중

코드 문제풀이를 작성하고 테스트하고 있는 자바스크립트 프로젝트 “test_and_play_모음”에 TypeScript를 적용하였다. 어떤 모듈을 설치해야 하는지와 어떤 config.json 설정 파일을 만들어줘야 하는지, nodemon과 ts-node, ts-node-dev의 실행 차이와 Jest 테스트 도구에 TypeScript를 적용하는 방법 등등을 알아보았다. “test_and_play_모음”의 README_ABOUT_TYPESCRIPT.md 에 정리해두었다.
- export function solution() 으로 내보내기를 진행하는 문법은 분명히 ES6 모듈일텐데, 막상 다른 파일에서 import solution from ‘…’로 가져오기를 하면 해당 파일이 CommonJS 로 내보내고 있기 때문에 문제가 있다고 한다. 다른 방식으로 시도해도 잘 안 돼서 알아보는 중이다.
  1. export default 방식
```
// [1] export default { solution: solution, ListNode }로 내보내서 이렇게 불러오든지:
import ori from "./leet141-링크드 리스트 순환"
const { solution, ListNode } = ori;
```
  1. export 방식
```
// [2] export { solution, ListNode }로 내보내거나
//     export function solution() {...} 처럼 내보내서
//     이름을 못 바꾸게 불러오든지: 
import { solution, ListNode } from './leet141-링크드 리스트 순환';
```
  ⇒ 내게 필요한 건 solution 함수의 이름을 통일해서 불러오는 것이므로 1안을 채택했다.

다음은 정리한 노트 중 일부이다:

Jest로 TypeScript 코드 테스트하기
이 방법은 Jest 설정만 조금 바꿔주면 ts 코드를 해석하고 자동으로 재실행까지 할 수 있다:
1. Jest 라이브러리 설치
```
npm i -D jest
```
1. TypeScript용 Jest 프리셋(ts-jest) 설치
```
npm i -D ts-jest
```
1. 루트 디렉토리에 jest.config.js 파일을 생성하여 Node.js 환경에서 테스트를 실행하도록 설정
```
// jest.config.jsmodule.exports = {
	preset: 'ts-jest',
	testEnvironment: 'node',
	testMatch: [
		'**/*.test.(ts|js)',// TypeScript 파일과 .test.js 파일을 모두 테스트
	],
}
```
1. TypeScript로 작성된 Jest 코드를 해석할 수 있도록 (Jest 모듈 자체의 TypeScript 타입 정보를 제공하는) @types/jest 패키지 설치
```
npm i -D @types/jest
```
1. 테스트 대상 코드와 테스트 코드 작성 (둘 모두 .ts 형식으로 파일을 저장한다.)
1. 테스트 실행
```
npx jest
```
1. 코드를 수정하고 저장할 때마다 Jest가 자동으로 변경된 파일을 감지하고 테스트를 실행하게 된다.
=> Jest의 ts-jest 프리셋이 TypeScript 코드의 변환 및 실행을 처리해주기 때문에 ts-node나 ts-node-dev 라이브러리를 이용하여 따로 실행해주지 않아도 된다.

느낀 점

TypeScript 문법을 오랜만에 접해서 새로웠다. 든든한 ChatGPT가 있어서 샘플 변환 코드를 받아보고 쉽게 기억을 되살릴 수 있어서 좋았다.

Uploaded by N2T

티스토리툴바