아이패드에서 프로그래밍 공부를 해보고자 여러 어플을 찾아봤습니다. 파이썬 같은 경우는 적당한 유료 어플이 있었지만 VSCode와 같은 무료면서 강력한 기능을 가진 어플은 없었습니다.

 

다양한 방면으로 찾아보던 중 Code Server라는 기능을 사용하면 웹 브라우저에서 VSCode의 기능을 이용할 수 있다고 하여 사용하는 방법에 대해 포스팅합니다.

 

 

 

1. Code server란?

 

Run VS Code on any machine anywhere and access it in the browser.

* Code on any device with a consistent development environment
* Use cloud servers to speed up tests, compilations, downloads, and more
* Preserve battery life when you're on the go; all intensive tasks run on your server

🔔 code-server is a free browser-based IDE while Coder, is our enterprise developer workspace platform. For more information, visit Coder.com

 

사실상 마지막 줄이 핵심입니다. code-server은 무료입니다!

 

https://github.com/coder/code-server

 

GitHub - coder/code-server: VS Code in the browser

VS Code in the browser. Contribute to coder/code-server development by creating an account on GitHub.

github.com

 

자세한 내용은 깃 허브에서 확인하실 수 있습니다.

 

 

 

2. Code server 설치 서버 요구 사항.

 

우선 Ubuntu 서버를 미리 준비합니다. 서버 스펙의 요구사항은 다음과 같습니다.

  • 1 GB of RAM
  • 2 CPU cores

전 이 글에서 AWS EC2의 Free tier를 사용한 우분투 서버를 사용합니다.

 

 

 

3. Code server 설치.

 

code-server를 설치하는 데는 다음과 같은 세 가지 방법이 있습니다

  • 대부분의 프로세스가 자동화된 설치 스크립트를 사용하는 방법.
  • 수동으로 설치하는 방법.
  • 클라우드 업체에 원버튼으로 배포하는 방법.

 

저는 가장 처음 방법인 설치 스크립트를 사용해 설치를 진행해 보도록 하겠습니다. 

 

SSH를 사용해 우분투 서버에 접속합니다. 접속 후 다음 명령어를 수행해 설치를 미리 테스트해 봅니다.

curl -fsSL https://code-server.dev/install.sh | sh -s -- --dry-run

위와 같이 드라이 런의 결과를 미리 확인해 볼 수 있습니다.

 

이제 진짜 설치를 진행해 보도록 합니다. 다음 명령어를 수행해 주세요.

curl -fsSL https://code-server.dev/install.sh | sh

설치가 완료되면 다음 명령어로 서버 부팅 시 서비스가 시작될 수 있게 만들어 준 뒤 code-server를 확인해 줍니다.

sudo systemctl enable --now code-server@ubuntu
code-server -h

** @뒤는 유저의 이름을 적절히 변경해 넣어 주셔야 합니다.

 

이제 설정 파일을 수정해 봅시다.

 

 

 

4. 설정 구성.

 

설정 파일은 ~/.config/code-server/config.yaml입니다. 다음 명령어로 설정 파일을 열어줍니다.

sudo vi ~/.config/code-server/config.yaml

파일을 열면 기본 설정 파일은 다음과 같습니다.

외부에서 접속 가능하도록 하기 위해서 127.0.0.1을 0.0.0.0으로 변경하고 포트도 원하시면 변경해 주시면 됩니다.

비밀번호는 자신이 편한 값으로 수정해 주시거나 외울 수 있다면 그래도 쓰시면 됩니다.

cert 옵션은 자체 인증 서버를 사용해 https 통신을 할 때 사용합니다. 우선 그대로 두고 넘어가도록 하겠습니다.

 

설정 파일 변경이 완료되었다면 다음 명령어를 사용해 code-server를 재시작해 줍니다.

sudo systemctl restart code-server@ubuntu

이제 code-server에 접속해 봅시다.

 

 

 

5. 접속 확인.

 

처음 접속하면 다음과 같은 화면을 확인할 수 있습니다.

 

설정에서 변경한 암호를 입력해 줍시다.

이제 맘껏 사용하시면 됩니다!

 

다음 글을 참고하시면 HTTPS 설정을 진행할 수 있습니다: https://smoh.tistory.com/457

 

[Ubuntu] Certbot(Nginx)을 이용해 code-server에 https 적용하기.

앞서 작성한 code-server에 HTTPS를 적용해 보도록 하겠습니다. 이번 글에선 certbot의 nginx옵션 이용해 인증서를 발급받고 적용해 보도록 하겠습니다. 편의를 위해 code-server 설치와 nginx를 통한 역방향

smoh.tistory.com

 

 

 

 

 

 

반응형

+ Recent posts