연습 - 코드 실행 및 디버그

SSH 서버에 연결했으므로 코딩을 시작할 준비가 되었습니다. 에이전시용 Express 앱을 개발하는 임무를 맡고 있으므로 기본 Node 애플리케이션을 생성해야 합니다.

이 연습에서는 SSH를 사용하여 연결된 상태에서 기본 Node 프로젝트를 만들고 프로젝트 코드를 실행하고 디버그합니다.

Node.js 애플리케이션 만들기 및 실행

Node.js 애플리케이션을 만들고 실행하려면 터미널에서 일련의 명령을 실행해야 합니다.

작업 표시줄에서 터미널 새 터미널을> 선택하여새 터미널을 엽니다. 터미널에서 다음 명령을 실행하여 Linux VM의 패키지를 업데이트하고 Node.js설치합니다.
```
sudo apt-get update
```
```
curl -sL https://deb.nodesource.com/setup_lts.x | sudo -E bash -
```
```
sudo apt-get install nodejs -y
```
다음 명령을 실행하여 Express 생성기를 설치합니다.
```
sudo npm install -g express-generator
```
다음 명령을 실행하여 myExpressApp이라는 새 Express 애플리케이션을 만듭니다.
```
express myExpressApp --view pug
```
탐색기 보기에서 폴더 열기 를 선택하여 애플리케이션 파일을 엽니다. 드롭다운에서 myExpressApp 을 선택하여 Visual Studio Code 창에서 폴더를 엽니다.
다음 프롬프트에서 확인을 선택하면 애플리케이션 파일이 포함된 폴더가 열립니다. 프롬프트가 표시되면 작업 영역을 신뢰합니다.
터미널을 다시 열고 다음 명령을 실행하여 애플리케이션의 모든 종속성을 설치합니다.
```
npm install
```
다음 명령을 실행하여 애플리케이션을 실행합니다.
```
npm start
```
애플리케이션은 VM의 http://localhost:3000에서 실행됩니다. 다음 단계에서는 로컬 컴퓨터에서 이 애플리케이션을 찾아보는 방법을 보여 줍니다.

이제 애플리케이션이 실행 중이므로 포트 전달을 사용하여 로컬 컴퓨터에서 웹앱을 찾아볼 수 있습니다.

앱이 계속 실행 중인 상태에서 명령 팔레트 에서 포트: 포트 뷰에 포커스 를 지정하는 명령을 실행합니다.
포트 전달 단추를 선택합니다.
포트 3000을 지정한 다음 Enter 키를 누릅니다.
이제 서버는 포트 3000의 트래픽을 로컬 컴퓨터로 전달합니다. 이제 실행 중인 웹앱을 보려면 http://localhost:3000 찾아볼 수 있습니다.
터미널에서 Ctrl + C를 눌러 앱을 중지합니다.

Visual Studio Code의 기본 제공 기능을 사용하여 원격 머신에서 실행되는 애플리케이션을 편집하고 디버그할 수 있습니다.

Visual Studio Code의 왼쪽 메뉴에서 파일 탐색기를 선택하고 app.js 파일을 엽니다.
줄 번호 왼쪽의 여백을 클릭하여 파일의 줄 10에 중단점을 설정합니다. 빨간색 원이 표시됩니다.
실행 및 디버그 보기에서 실행 및 디버그를 선택합니다. 메시지가 표시되면 Node.js선택합니다.
앱이 실행되면 중단점에 도달합니다. 변수를 검사하고, 조사식을 만들고, 사이드바의 디버그 보기에서 호출 스택을 탐색할 수 있습니다. 상단에 있는 디버그 액션 바를 사용하여 한 줄씩 단계적으로 디버그 세션을 제어할 수 있습니다.
코드가 로컬 컴퓨터에 있는 것처럼 파일을 편집할 수도 있습니다. app.을 입력하여 IntelliSense를 트리거하십시오.

Congratulations! 원격 머신에만 있는 코드를 실행, 편집 및 디버그했습니다.

이 페이지가 도움이 되었나요?