IDE / 에디터

개발 IDE / 에디터

웹 애플리케이션 개발을 위한 IDE(통합 개발 환경)로 Visual Studio Code 또는 동일한 사용자 경험을 제공하는 온라인 에디터를 설치해 사용합니다.

https://code.visualstudio.com/code.visualstudio.com

오프라인 도구

The online code editor for web apps. Powered by Visual Studio Code. - StackBlitzStackBlitz

온라인 도구

Visual Studio Code 확장

https://marketplace.visualstudio.com/items?itemName=loiane.ts-extension-packmarketplace.visualstudio.com

VSCode Typescript 확장 팩

Typescript 확장 기능 중, 가장 많이 사용 되는 패키지 중 일부 패키지를 묶은 확장 팩입니다.

확장 패키지 목록

• TSLint TypeScript linter로 TS 코드 오류 등을 실시간으로 확인할 수 있습니다.
• TypeScript Hero 설정된 규칙에 따라 import 구문을 정렬하고 사용 되지 않은 것은 제거합니다 Windows / Linux : Ctrl + Alt + O MacOS : Ctrl + Opt + O
• json2ts 복사된 JSON 코드를 TypeScript 인터페이스로 변환합니다. Ctrl + Alt + V

• Move TS 프로젝트의 일부 파일을 리팩토링 하고 재구성하는데 도움이 되는 훌륭한 확장 프로그램입니다. 경로가 변경된 파일의 import 및 컴포넌트를 가져 오는 파일을 자동으로 수정합니다. 프로젝트 탐색기 창에서 파일이나 폴더를 마우스 오른쪽 버튼 클릭 후 'Move TypeScript'를 선택해 사용합니다.
• Path Intellisense VSCode는 자동 가져 오기 기능이 뛰어나지만 일부 파일을 수동으로 가져와야 하는 경우가 있습니다.이 확장을 사용해 이를 보완할 수 있습니다.
• TypeScript Importer 작업 영역 파일에서 TypeScript 정의를 자동으로 검색하고 알려진 모든 기호를 완료 항목으로 제공하여 코드 완성을 허용합니다.
• Prettier - JavaScript formatter Javascript / Typescript / CSS 코드 포멧을 보기 좋게 만들어 줍니다.
• Debugger for Chrome 크롬을 사용하여 디버깅 하고 VSCode에 중단점(Breakpoint)을 추가 할 수 있습니다.