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

 

편의를 위해 code-server 설치와 nginx를 통한 역방향 프록시 설정에 대한 설명은 스킵하도록 하겠습니다.

 

 

 

01. code-server 설치 및 역방향 프록시 설정.

 

다음 글을 참고하여 code-server를 미리 준비합니다: https://smoh.tistory.com/456

 

[Ubuntu] 아이패드에서 code-server로 코딩 공부 해보기.

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

smoh.tistory.com

 

** 위 글에선 예시를 위해 AWS의 EC2를 사용하였습니다만 현재는 관리하는 서버에 code-server를 옮겨둔 상태입니다.

** NGINX를 통한 역방향 프록시 설정 방법은 별도로 설명하지 않습니다.

 

 

 

02. CERTBOT 설치.

 

만약 apt 같은 OS 패키지 관리자를 사용하여 설치된 Certbot 패키지가 있는 경우 기존 Certbot은 제거해야 합니다. 다음 명령어로 Certbot을 제거해 주세요.

sudo apt-get remove certbot

 

이제 snap을 사용해 최신 Certbot을 설치해 줍니다. 다음 명령어로 snap을 사용해 Certbot을 설치합니다.

sudo snap install --classic certbot

 

설치가 완료되면 다음 명령어를 실행해 certbot 명령을 실행할 수 있는지 확인합니다.

sudo ln -s /snap/bin/certbot /usr/bin/certbot

 

이제 다음 명령어를 수행해 인증서를 발급받습니다.

sudo certbot certonly --nginx

 

만약 nginx에 여러 개의 사이트가 등록되어 있으면 위의 그림처럼 리스트가 나열됩니다. 발급을 원하는 사이트의 번호를 입력합니다. 만약 입력하지 않는 경우 모든 사이트가 선택됩니다. 

 

이제 인증서 발급이 완료되었습니다. 인증서의 위치는 /etc/letsencrypt/live/사이트명 폴더에 저장됩니다.

 

 

 

03. NGINX 설정 변경.

 

다음 명령어를 통해 nginx의 설정 파일을 엽니다. 전 별도 설정 파일에 server 설정을 관리하고 있습니다. 설정 파일 이름은 사용자에 따라 다릅니다.

sudo vi /etc/nginx/conf.d/my-server.conf

 

설정 파일을 열고 다음과 같이 설정을 추가합니다.

#/etc/nginx/conf.d/my-server.conf
#code-server
server {
  listen 80;
  server_name your.domain.here;
  location / {
    proxy_pass http://localhost:{PORT};
    proxy_set_header Host $host;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection upgrade;
    proxy_set_header Accept-Encoding gzip;
  }
  listen [::]:443 ssl ipv6only=on;
  listen 443 ssl;
  ssl_certificate /etc/letsencrypt/live/your.domain.here/fullchain.pem;
  ssl_certificate_key /etc/letsencrypt/live/your.domain.here/privkey.pem;
  include /etc/letsencrypt/options-ssl-nginx.conf;
  ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;
}

 

이제 다음 명령어로 nginx 서비스를 재시작합니다.

sudo service nginx restart

 

접속해서 확인해 봅시다.

 

 

도메인에 접속하면 https가 정상적으로 적용된 것을 확인할 수 있습니다.

 

 

 

 

 

 

반응형

 

 

아이패드에서 프로그래밍 공부를 해보고자 여러 어플을 찾아봤습니다. 파이썬 같은 경우는 적당한 유료 어플이 있었지만 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