vscode for web, python 실행하기

 

vscode  for web 버전에서 Python 실행 및 디버그

 

vscode의 웹버전도 충분히 고마운데, web버전에서 python 을 실행하고 디버깅 할 수 있게되었습니다. 아직까진 experimental version 이지만 곧 정식 버전이 release 될 것 같습니다.

 

vscode for web 사용은 아래 링크를 클릭 하시면 사용하실 수 있습니다.(https://code.visualstudio.com/docs/editor/vscode-web)

 

우선 vscode for web을 실행하여 마켓플레이스에서 "python wasm" 을 검색하여 설치하시면 됩니다. 아직 정식 release 전이기 때문에, 설치 시 release 버전이 아닌 시험판 버전을 설치하셔야합니다. 

 

 

vscode for web에서 python의 실행은 python의 WASM(Web Assembly) 을 기반으로 합니다. WASM은 실행 프로그램 및 그와 일치하는 텍스트 어셈블리어, 그리고 이러한 프로그램과 호스트 환경 간 통신을 용이케하는 인터페이스를 위한 이식 가능한 이진 코드 포맷을 정의하는 개방형 표준이라고 합니다. 

말이 어렵습니다. 이에 대해서는 다른 포스팅에 공부 열심히 해서 다뤄보겠습니다. 궁금하신 분은 아래 링크로 가서 선행학습하시길 바랍니다.

https://pythondev.readthedocs.io/wasm.html

Compile Python to WebAssembly (WASM) — Unofficial Python Development (Victor's notes) documentation

 

vscode for web의 WASM extension을 사용하기 위해서는 아래와 같은 전제조건이 있습니다.

 

1. GitHub Repositaries 확장을 설치해야 합니다.
2. GitHub로 인증해야 합니다.
3. 마이크로소프트 엣지와 구글 크롬 브라우저와 같은 cross-origin isolate를 지원하는 브라우저를 사용해야 합니다.

4. VS Code for the Web의 insider 버전사용. (stable버전이 아닌 최신기능을 먼저 사용해볼 수 있는 insider버전 사용)

5. 소스 코드는 GitHub 리포지토리 확장자를 통해 액세스되는 GitHub 리포지토리에서 호스팅되어야 합니다.

6. 웹용 VS Code를 시작할 때 URL 끝에 다음 쿼리 매개 변수를 추가해야 합니다. ?vscode-coi=.

 

저는 안드로이드 폰에서 code 를 실행하고, 마켓플레이스에서 extension을 설치하였습니다. vscode for web을 실행하면 로컬 파일시스템에 접근이 안되기 때문에 원격 리포지토리 열기를 선택하여 본인의 git repository와 연결설정을 해줍니다.

 

 

이어서 연결된 repository 에 python 파일을 하나 만들고, wasm extension 을 이용하여 실행시켜줍니다. 우측 상단에 실행버튼이 있습니다.

 

 

 

 

실행하면 위 그림과 같이 터미널에 출력 결과가 찍히네요. 아주 훌륭합니다.