search

donghL-dev / blog-comments

0 stars 0 forks source link

code-server-tutorial-guide #10

Open utterances-bot opened 2 years ago

utterances-bot commented 2 years ago

code-server를 이용해서 어디서든 사용할 수 있는 Personal IDE를 만들어보자.

이 블로그는 제가 개발 또는 공부를 하면서 느낀점 또는 공부 내용을 정리한 내용을 게시하거나 제가 경험했던 내용 또는 제 관심사에 대한 내용들을 게시하기 위한 공간입니다.

https://donghun.dev/code-server-tutorial-guide

theangkko commented 2 years ago

잘 봤습니다.!

Deenoe-kim commented 1 year ago

혹시 글을 보고 따라 해볼려 했으나 처음해보는 것이라서 그런지 여러 문제들이 있어서 따로 자세히 설명 받을 수 있을지 물어봅니다..

donghL-dev commented 1 year ago

안녕하세요. @Deenoe-kim 님, 이 글을 이해하는 과정에서 어려움이 있다면, 여기에 질문을 남겨주시면 이 글을 보는 다른 사람들이 동일한 궁금증을 가질 때 도움이 될 것 같습니다.

질문을 남겨주신다면, 이 글에서 나오는 설명의 이내에 대해서라면 제가 아는 선에서 대략적으로 알려드릴 수 있을 것 같습니다. 그러나 여기에 설명되지 않은 그 이전의 환경 을 세팅하는 방법이나 과정에 대해서라면 전체적으로 알려드리기에는 힘들 것 같고 어떤 방법으로 문제를 해결해야 할지 문제 해결을 위한 검색 키워드 정도는 말씀드릴 수 있을 것 같습니다. 감사합니다.

zzipper21 commented 1 year ago

안녕하세요! 이틀을 이거해보겠다고 밤을샌 개발을 이제배워보려는 사람이라 도움을 요청하곳싶습니다 ㅜ 저는 비전공자라 아이패드사고나서부터 vscode dev 부터 code speace 까지 갔다가 도저히 사용성이 마음에 들지않아 알아보던차 aws ec2에 우분투로 code server 깔고 쓰는 사용자입니다 크롬으로 사용시 적용은 잘되는거같은데 https 적용이안되서인지 8080으로는 live server가 작동이 안되네요ㅜ pc에선 html짠게 live익스텐션깔면 바로보이는데 지금은 not pound뜨면서 보이질않습니다 한가지만 더여쭤보면 말씀해주신데로 사파리에서 홈스크린에 깔고 들어가면 pwa자체적용이 되어야할텐데 어쩐일인지 매직키보드 스크롤이 전혀먹지를 않습니다.. 제가 어떤부분을 잘못한걸까요? 오늘도 밤을 새봅니다... 보시면 도움 부탁드립니다 ㅠ

donghL-dev commented 1 year ago

안녕하세요. @zzipper21 님, 크게 문제가 되는 부분이 두 가지를 말씀해주셨는데 도움이 될지는 모르지만 몇 가지 제안을 드려보겠습니다.

첫 번째 문제는 aws ec2 인스턴스에 code-server 를 설치하고 사용하셨다고 해주셨는데, 설정에서 code-server 포트는 어떤 것으로 해주셨을까요? 혹시 live-server랑 동일한 포트를 사용하고 있는건 아닐까 조심스럽게 말씀드려봅니다. ec2로 설치해서 사용하는 code-server 자체에는 접근이 되는지 접근이 된다면 포트는 어떤걸 사용하고 있는지 확인해보시면 좋을 것 같습니다. pc에선 live server 익스텐션 깔면 바로 보이신다는게 PC용 VS Code를 사용해서 live server를 구동 시켰을 때 로컬로 접근해서 보이신다는 거라면 그건 code-server랑 다르게 생각해보셔야 할 부분 일 것 같습니다. PC용 VS Code에서는 로컬에서 바로 접근하는 거라 상황이 조금 다를 수 있습니다. 그리고 HTTPS를 적용하지 않았다면, 사파리나 크롬 등의 브라우저에서 안전하지 않은 사이트라고 판단해서 접근이 되지 않을 수 있습니다. 이 부분 또한 참고 부탁드립니다.

두 번째 문제는 사파리로 홈 스크린에서 앱을 만들어주셔서 접근 자체가 되는걸까요? 제가 이 글에 첨부한 사진처럼은 잘 나타나는 것이고 스크롤만 안되는거라면 매직 키보드를 제외한 다른 블루투스 마우스나 허브가 있다면 유선 마우스도 될 수 있고, 집에 사용하시는 트랙패드가 있다면 그걸 사용해보셨을 때 스크롤이 여전히 안되는지 확인해보세요. 사파리에서 홈에 앱을 만들기 전에 브라우저 안에서도 안되는지를 확인해보시고 다른 사이트에서는 잘 되는지를 확인해보세요. 최근 code-server 버전을 사용해보지 않아서 알 수는 없지만 만약 해당 code-server 웹 접근에서만 스크롤이 연결된 모든 트래팩드, 마우스와 손가락으로 스크롤 했을 때도 안되는거라면 code-server 문제일 가능성도 있습니다. code-server 공식 깃허브에 관련된 이슈가 없는지 확인해보시고 사용하고 있는 code-server 버전이 최신인지 이런 버그를 픽스된 업데이트된 버전이 있는지 확인해보는 것도 방법일 수 있습니다. 또 간단한 방법이지만 아이패드에서 사파리를 리프레쉬 해보거나, 아이패드를 껐다가 켜는 등의 방법으로도 매직키보드 문제를 해결할 수도 있습니다.

제가 제안드리는 방법이 조금이라도 도움이 되었으면 좋겠습니다. 제가 알고 있는 선에서 해결 방법은 이 정도일 것 같네요. 감사합니다.

zzipper21 commented 1 year ago

답변 감사합니다 ! 말씀하신사항들 전부 확인하고 조금더 여쭤봐도될까요! 첫번째 문제에서 1.aws ec2 인스턴스 보안그룹에 설정된 code-server 포트는8080,8000두가지 추가해놨고 vim ~/.config/code-server/config.yaml 에서 x.x.x.x:8080 으로 되어있습니다 2.정확히 말씀드리자면 pc에서 code-server 접속해서 LIive-server 실행해도 새창열리면서 Not found. 라고만 뜨게됩니다. pc로컬로 vscode 킬땐 라이브가 잘되는데 PC에서나 ipad에서나 aws 인스턴스에 설치한 code-server 접속해서 라이브 실행하면 Not found. 라고 뜹니다. live-server는 http://x.x.x.x:8080/proxy/5500/ 이렇게 나와있습니다 !

화면이 좁다보니 live-server처럼 바로바로 보여지고 확인되는게 필수인듯한데, 답답하네요ㅎ

두번째 문제에서 pc에서는 크롬이나 사파리모두 code-server 접속했을때 마우스로 스크롤 문제 전혀없이 잘됩니다. ipad에서는 크롬으로 code-server 접속시 사파리로 code-server접속시 두손가락 스크롤은 잘됩니다. 문제는 매직키보드를 장착했을때인데, 매직키보드를 장착하고

아 어제부터 계속하다보니 사파리에서 스크롤이 어쩌다가 한번씩 될때는 있는데 그게 다른창으로 멀티태스킹을 갔다오면 다시 안됩니다. 말씀하신데로 맥북에 연결된 마우스를 유니버셜 컨트롤로 아이패드랑 공유한후 마우스 스크롤해봤는데 크롬은 스크롤이 되고 사파리에서나 홈스크린설치한앱에서나 둘다 스크롤이 안됩니다ㅜ 눈으로 상황보시는게 아니라서 최대한 자세하게 적었는데 해결방안이 있으면 좋겠습니다 그리고 다시한번 감사드립니다 ! 그리고

donghL-dev commented 1 year ago

@zzipper21 님, 추가적인 답변 드립니다.

일단 2번 질문부터 말씀드리면, 사실 이 부분은 code-server 문제일 확률이 큽니다. 멀티태스킹으로 다른 화면으로 다녀오셔서 새로고침을 해주거나 사파리를 새로 키거나 하는 등으로 해결하시거나 그게 너무 불편하다면 크롬에서 매직 키보드를 원할하게 사용하면서 code-server를 이용하는게 방법일 수 있습니다. 특정 하드웨어나 특정 프로그램에서 일어나는 케이스는 사실 그걸 이용하는 입장에서는 문제를 해결하기가 쉽지 않습니다. 직접 코드를 고치는 디버깅이 아니라면요. 안타깝지만 2번 문제에 대해서는 뚜렷한 해결방안을 드리기는 어려울 수 있습니다.

1번 문제는 조금 더 설명을 해주셔서 제가 위 댓글에서 말했던 것처럼 동일한 문제를 가지고 계신 것 같습니다. code-server 와 live-server는 각 서버입니다. 서버라는 개념이 아직 익숙치 않을 수 있는데, 서버로 올려서 무언가 작업하는 상황에서 한 컴퓨터 내에서 같은 포트로 그 서버를 한 대 이상 구동시킬 수 없습니다. 말씀해주신 것처럼 code-server도 8080 포트로 구동되고 있고, live-server 도 8080으로 구동된다면 먼저 구동 시킨 곳만 동작할 겁니다. 로컬에서 동작이 가능했던건 로컬에서 code-server로 VS Code를 서버로 띄운것이 아니라 VS Code를 직접 이용했기에 포트가 겹치지 않아서 live-server를 구동시킬 수 있었던 것으로 보이네요. 설정 파일에서 code-server의 포트를 8080이 아닌 다른 포트로 변경해서 띄운다음 그 포트로 접속을 해서 live-server 를 띄우면 구동될 수도 있습니다. 제가 예시에 8080 포트를 사용하셨다고 해서 무조건 8080 포트를 사용하실 필요는 없습니다. 설정파일에서 다른 포트를 사용하셔도 됩니다. 제 답변이 조금이나마 도움이 되길 바래봅니다.

theangkko commented 1 year ago

@zzipper21 예전에 제가 이 글을 보고 많은 도움을 받아 알람 설정을 해두었더니 위에 주고 받으시는 댓글들이 알람이 와서 오랜만에 다시 들어오게 되었습니다.

사용자마다 환경은 달라 제가 이해를 적절히 하고 있는지 모르겠습니다만, 간단히 읽어보면 꼭 aws나 code server를 활용해야 할 환경이 아니라면 조금 더 편한 방법으로 사용하는 것이 좋아보이기도 합니다.

codespace의 어떤 점이 부족하다고 느끼신지 모르겠지만 저는 어떻게 하다보니 web환경에서 사용해야 한다면 gitpod.io 를 최근에는 가장 많이 사용합니다. Github > codepsace보다 편하고 github / gitlab / bitbucket 등 다양한 repo 서비스를 활용할 수 있어서 좋았습니다.

서버의 좋은 컴퓨팅 파워를 활용하거나 민감한 내용의 노출이 꺼려진다면 개인서버를 활용하셨을 듯 한데, 어디에서나! 사용가능한 환경이 더 목적인 듯해서 그동안 Nas, 개인노트북, 회사HPC, OracleVM 등... 삽질한? 시간이 아까워 지나가던 길에 조심스레 댓글을 달아봅니다.

참고로 제 경험을 회사 동료들에게 나누니 대부분 이런저런 고민 끝에 10명 중에 5~6명은 간편한 설정으로 선택을 했었던 것 같습니다.