재학습/Typescript

[Typescript] 코딩테스트를 위한 타입스크립트 프로그래밍 환경 구축

재이든 2024. 9. 26. 23:51
반응형

서론

'코딩테스트 준비는 꼭 이직이 아니더라도 항상 준비해놓아야 한다. 마치 운동처럼'

내가 만들어놓고도

'아! 이게 진리다 정말!'라는 생각이 드는 말.

하지만 실천은 하지않고 항상 생각으로만 존재했던 말이다.

 

그러나 이제는 정말 다시 시작해야겠다는 생각이 들었다.

 

일만 하고있으니 매너리즘에 빠져 코딩 능력 성장이 멈추고있다는 생각이 강하게 들었기 때문이다.

 

나는 코딩테스트 언어를 Typescript로 정했다.

 

언어 선정에는 고민이 참 많았다.

회사의 레거시는 PHP, 모던은 Node(Typescript), 관심있는 분야는 Python, Go

너무 짬뽕되어있기 때문이다. (덕분에 내 책장도 짬뽕 그 잡채이다..)

 

그래도 제일 중요한것은 현업아니겠는가. 

또한, 사이드프로젝트를 하면서 프론트엔드도 만질일이 많이 생겼는데 프론트엔드는 죄다 Typescript이다.

 

이런 배경에 따라 언어 숙달능력과 알고리즘능력을 기르고자 Typescript로 다시 알고리즘문제를 열심히 풀어보고자 한다.

 

준비해보자

1. IDE인 Visual Studio Code를 다운로드

 

Visual Studio Code - Code Editing. Redefined

Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications.  Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.

code.visualstudio.com

vsCode는 다양한 확장 프로그램을 지원한다. 다운로드하는것을 추천

ESLint: 코드 스타일 및 오류 검사

Prettier - Code formatter: 코드 포맷팅

TypeScript: TypeScript 코드의 구문 강조 및 자동 완성

Code Runner: 터미널을 열지 않고도 코드를 실행할 수 있도록 도와줍니다.

반응형

2. NodeJS및 NPM 설치

 

Node.js — Run JavaScript Everywhere

Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.

nodejs.org

 

3. VScode의 터미널을 띄워 Typescript를 설치 (이 명령어 수행 시 tsc커맨드 사용 가능)

npm install -g typescript

 

4. 작업폴더를 생성하여 Typescript 프로젝트 초기화

tsc --init

typescript라는 폴더를 생성하여 그 안에 tsc --init 커맨드를 수행 시 아래와같이 config파일이 구성된다.

tsconfig.json은 타입스크립트 관련 다양한 설정을 하는 파일이다.

 

5. ts파일을 바로 실행하기위해 Code-Runner에 Typescript관련 설정

우선, Code-Runner확장프로그램을 다운로드받고나서 아래와같이 확장설정에 접근한다.

"code-runner.executorMap"

위 객체에는 여러 언어 별 설정이 되어있을텐데 

Typescript Key-value값을 아래처럼 수정해준다.

"typescript": "npx ts-node"

 

 

그리고 테스트용으로 test.ts를 만들어 Ctrl + Alt + N 또는 우측 상단 화살표버튼을 누르면 실행이 되어야한다.

 

 

'되어야한다'...

왜 나는안되지?

오류발견 ^^*

npm ERR! code EACCES
npm ERR! syscall open
npm ERR! path /Users/../.npm/_cacache/tmp/1dd64e20
npm ERR! errno -13
npm ERR! 
npm ERR! Your cache folder contains root-owned files, due to a bug in
npm ERR! previous versions of npm which has since been addressed.
npm ERR! 
npm ERR! To permanently fix this problem, please run:
npm ERR!   sudo chown -R 501:20 "/Users/../.npm"

npm ERR! A complete log of this run can be found in: /Users/../.npm/_logs/2024-09-26T14_44_48_009Z-debug-0.log

 

원인

npm이 설치폴더에 접근권한이 없기때문에 발생한 원인이다.

npm을 sudo로 설치하면 일부파일이 root소유권을 가지게되어 발생하는 문제라고 한다

 

조치

터미널에서 다음 명령어를 사용하여 npm디렉터리의 소유권을 현재 사용자로 변경한다

sudo chown -R $(whoami) ~/.npm

 

정상적으로 조치가 됨을 확인했다.

 

이제 야무지게 코딩테스트를 준비해보자

반응형

'재학습 > Typescript' 카테고리의 다른 글

[Typescript] 타입스크립트란?  (0) 2023.01.02