또치의 삽질 보관함 또치의 삽질 보관함

VSCode

• [vscode.dev] 브라우저 기반 에디터 vscode.dev 소개

  ETC 2021. 10. 23. 11:58

  무료 개발 툴 중에서 가장 인기가 많다고해도 과언이 아닌 코드 에디터 vscode의 웹 브라우저 버전이 정식으로 나왔다. 최신 브라우저에서 https://vscode.dev 를 접속하면 확인할 수 있다. 브라우저에서 동작하기 때문에 갤럭시탭이나 아이패드와 같은 테블릿이나 휴대폰에서도 접속하여 사용이 가능하다. 물론 접속한 브라우저와 기기OS의 상황에 따라 로컬 프로젝트 사용가능 유무가 갈리며, 디버깅에 제약이 있다. 이번시간엔 일반적인 PC 환경 외, 테블렛에서도 적용 가능한 방법으로 vscode.dev 를 맛보기로 한다. 1. Github에서 리포지토리 만들기 기능을 제대로 사용하기위해선 Github 계정이 필요하므로 가입이 선행되어야 한다. Github에서 신규 리포지토리를 만든다. 2. vscode..

  Read More
• [WSL2] WSL Ubuntu에 실행한 Web이 host OS에서 localhost로 접속이 안되는 현상을 해결하는 무식한 방법

  ETC 2021. 4. 25. 15:28

  보다 간단한 방법을 https://ddochea.tistory.com/153 에 작성했습니다. 해당 방법을 먼저 시도해보시고, 안될경우 본 포스트 방법을 시도해보시기 바랍니다. WSL에 React 프로젝트를 생성하고 웹 접속을 테스트해보았다. 그런데 기본 접속 정보인 http://localhost:3000 로 접근이 되지 않았다. IP를 입력해서 접근할 순 있겠지만, 이렇게 되면 "Debugger for Chrome"을 통한 React 프로젝트 디버깅을 수행할 수 없다. 해결법을 찾았으나, 상당히 무식한 방법이었다. 만약 다른 네트워크 설정이 포함되어있다면 시도하지 않는 것을 추천한다. 1. 설정 이동 Windows 검색창에서 설정(Settings)를 찾아 연다. 2. 네트워크 및 인터넷(Network ..

  Read More
• [Spring Boot] VSCode를 이용한 WSL2 기반 Java 웹 개발환경 구축

  ETC 2021. 4. 10. 17:29

  지난시간엔 VSCode에 대한 자바 개발환경을 구축했었다. 콘솔개발환경이라면 그 정도로 마무리지어도 되겠지만, 국내에서 Java를 사용한다는 건 곧 Spring Framework를 쓰겠다는 말과 같으므로 Spring Framework 에 대한 세팅까지 완료되어야 진정한 개발환경 구축이라고 말할 수 있겠다. 선수되는 작업들은 아래 링크에 따라 진행한다. 1. OpenJDK 설치 : ddochea.tistory.com/129 2. VSCode Java 개발환경 준비 : ddochea.tistory.com/130 * 만약 WSL2 설정까지 진행하지 않았다면, www.44bits.io/ko/post/wsl2-install-and-basic-usage 를 참조해주기 바란다. 1. Spring Boot 관련 확장설..

  Read More
• [Java] WSL2 기반 VSCode에서 Java 개발환경 구축

  ETC 2021. 4. 10. 15:10

  전 시간에 WSL2 기반 Ubuntu에 JDK를 설치했었다. (ddochea.tistory.com/129 참조) 이젠 개발툴을 준비할 차례이다. 개발툴은 제약 없이 무료로 사용가능한 Visual Studio Code를 사용할 계획이다. 1. Remote - WSL 설치 VSCode에서 Remote - WSL 확장을 설치한다. 2. WSL 원격 연결 설치가 완료되고 나면 메뉴의 "Remote Explorer"를 선택한다. 그러면 WSL TARGETS 가 나열된 메뉴가 표시된다. Java가 설치된 WSL 환경을 선택 한뒤, 마우스 오른쪽 버튼을 눌러 "Connect to WSL" 을 선택한다. 선택하면 새로운 VSCode 창이 열리는데, 하단에 "WSL: Ubuntu-20.04" 라는 메시지가 표시된다. *..

  Read More
• [SSH] VSCode에서 SSH 연결이 안될때 known_hosts에서 해당IP를 제거해볼것

  ETC 2021. 3. 16. 00:38

  Visual Studio Code에서 Lightsail 인스턴스에 SSH를 정상적으로 연결하면, known_hosts 파일에 연결정보와 관련된 키값이 저장된다. 해당파일은 대게 User 폴더 내 .ssh 디렉토리에 위치해있다. 필요에 의해 인스턴스를 제거하고, 새로 생성한 뒤 기존 고정IP를 연결하여 사용하는데 안되서 잠깐 뻘짓을 했다.

  Read More
• [VSCode] WSL Ubuntu에서 ASP.NET Core 개발환경 세팅

  .NET/개발환경 및 Tools 2021. 2. 21. 13:41

  재미삼아 WSL Ubuntu 기반에 .NET 개발환경을 구축해보았다. 1. .NET 설치 WSL Ubuntu 에서 .NET을 설치한다. 설치는 .MS 공식문서에 잘 나와있다. docs.microsoft.com/ko-kr/dotnet/core/install/linux-ubuntu#2004- Ubuntu에 .NET 설치 - .NET Ubuntu에 .NET SDK 및 .NET 런타임을 설치하는 다양한 방법을 보여 줍니다. docs.microsoft.com 설치가 완료되면 dotnet --version 명령어로 확인할 수 있다. 2. ASP.NET 프로젝트 생성 명령어로 ASP.NET 프로젝트를 생성한다. 예시의 명령어는 react를 웹 클라이언트 프로젝트가 포함된 webAPI 생성 명령어이다. 프로젝트는 "A..

  Read More
• [VSCode] Launch Chrome 설정으로 React 디버그시 OAuth 테스트가 가능하도록 설정.

  ETC 2021. 2. 10. 18:23

  Firebase 인증기능 적용 후 디버그시 "로그인할 수 없음" 화면과 함께 제대로된 디버깅작업을 수행할 수 없는 문제가 생겼다. 이를 해결하려면 launch.json의 config값에 userDataDir 속성을 추가하고 값을 false로 설정해야한다. { "name": "Launch Chrome", "request": "launch", "type": "pwa-chrome", "url": "http://localhost:3000", "webRoot": "${workspaceFolder}", "userDataDir": false } 출처는 아래와 같다. visual studio code - Debugging a firebase auth app from vscode and chrome not working..

  Read More
• [VSCode] NodeJS, Vue등 javascript 기반 프로젝트 간단하게 디버깅 모드 실행하기

  ETC 2021. 1. 23. 21:37

  VSCode 에서 간단하게 디버깅하는 방법이다. Windows에서 테스트했다. VSCode에 한글 확장을 설치하지 않았으므로, 설명의 메뉴나 스크린샷은 모두 영어로 나온다. 1. Chrome 설치 (크로미움 엣지가 없을 경우) 크롬 기반의 브라우저로 디버깅이 되는 것 같다. 엣지만 설치된 환경에선 실패했다. lanuch.json 파일을 만들어서 적용한다면 가능할 수 있지만 "간단하게"가 주목적이므로 설정작업에 손 안대는 방법으로 진행하겠다. (님크없?) 2. 디버깅할 javacript 기반 프로젝트 열기 디버깅할 프로젝트 폴더를 VSCode로 연다. 3. javaScript Debug Terminal 실행 옆 메뉴란에 [Run] -> [javascript Debug Terminal] 을 선택하거나, VS..

  Read More