비쥬얼 스튜디오 코드 내에 확장 버전이 업데이트되면서 본인이 작업한 HTMP, CSS 코드가 보이지 않는 현상이 발생했습니다. HMTL 수업을 들으면서, 현재 FTP-SIMPLE 개발자도 오류 건 현상에 대해서 해결하지 못한 상황입니다. 대체안으로 사용할 수 있는 익스텐션은 Ftp-sync로 확인되었습니다. 다만, FTP-Simple 보다 사용 방법이 조금 어렵기 때문에, 설정 방법에 대해서 자세하게 알아보겠습니다.
비쥬얼 스튜디오 코드
FTP-SYNC 설치 방법 1
VS code 아이콘을 재실행하게 되면 업데이트가 되었다는 표시가 나타나게 되고, 비쥬얼 스튜디오 코드 하단 내에 보라색 창이 뜨게 되면 정상적으로 설치할 수 있는 환경이 만들어집니다. 아래의 화면 같이 FTP-Simple를 disable 클릭하고 uninstall을 순서대로 진행합니다. 마지막으로 익스텐션 FTP-Sync 익스텐션 설치하고 VS Code 종료합니다.
FTP-SYNC 설치 방법 2
C드라이브를 제외하고 나머지 외장하드 파일 내에 본인과 같은 도메인 파일을 생성하고 파일질라 접속합니다. 파일질라 접속 후, 본인의 HMTL 디렉토리를 도메인 파일 내에 다운로드합니다.(파일이 날아가는 것을 방지하기 위해서 하는 작업입니다.)
FTP-SYNC 설치 방법 3
왼쪽 아이콘 상단을 클릭하면, 바로 옆에 OPEN Folder가 생성합니다. 오픈 폴더를 누른 후, 외장하드 파일에 저장한 HTML 디렉토리 폴더로 설정 값을 지정합니다.
FTP-SYNC 설치 방법 4
폴더를 지정하게 되면 VS Code 내의 본인이 작업한 HTML 작업한 코드를 볼 수 있습니다. Ctrl+Shift+P를 눌러서 FTP-SYNC:lint를 눌러줍니다.
FTP-SYNC 설치 방법 5
본인의 host, username, password 본인의 도메인 주소에 맞게 입력하고 저장버튼을 누릅니다. 저장이 끝났다면 VS Code를 종료하고 재실행합니다. VS Code 하단 내에 파란색 줄이 보이며 정상적으로 작동되는 것을 볼 수 있습니다.
마지막으로 ctrl+shift+p를 누르고 "ftp-sync : remote to local" 를 선택합니다. 그 이후부터는 ENTER만 입력하면, VS CODE를 사용할 수 있는 조건을 확인할 수 있습니다.
파일질라 공식 홈페이지 주소 및 다운로드 방법 정리하기
파일질라 공식 홈페이지 다운로드 신청 홈페이지 및 다운로드 방법에 대해서 한번 알아보겠습니다. 웹호스팅 또는 이미지 호스팅, 홈페이지 제작을 해야할 때, 파일 전송을 통한 작업이 FTP입니
smartkorea.tistory.com
닷홈 무료 웹호스팅 도메인 제작 방법 절차 알아보기
닷홈 내에서 무료 웹호스팅 도메인 제작 방법에 대해서 한번 알아보겠습니다. 무료 웹호스팅이기에 트래픽에 대한 부분이 제약이 될 수 있습니다. 다만, 저처럼 HTML5, CSS3에 관련된 내용을 공부
smartkorea.tistory.com
Visual Studio Code 비주얼 스튜디오 코드 다운로드 방법 알아보기
오늘은 무료 호스팅 내에서 HTML, CSS, Jqurcy를 사용하는 Visual Studio Code 다운로드 방법에 대해서 한번 알아보겠습니다. 호스팅을 제작하는 사람들에게는 간편한 프로그램입니다. 해당 프로그램을
smartkorea.tistory.com
Visual Studio Code 비주얼 스튜디오 코드 필수 Extension 5가지 추천
비주얼 스튜디오 코드 내에서 필수적으로 다운로드해야 하는 익스텐션 5가지에 대해서 한번 알아보도록 하겠습니다. HTML5, CSS3, Java Script, Jqeury를 적용하기 위해서는 Vscode를 사용하시는 분들이
smartkorea.tistory.com
'웹퍼블리싱' 카테고리의 다른 글
| HTML 3.0 태그 정리 (0) | 2021.03.11 |
|---|---|
| HTML 1.0 ~ 2.0 태그 개념 정리 (0) | 2021.03.10 |
| Visual Studio Code 비주얼 스튜디오 코드 필수 Extension 5가지 추천 (0) | 2021.02.25 |
| Visual Studio Code 비주얼 스튜디오 코드 다운로드 방법 알아보기 (0) | 2021.02.24 |
| 닷홈 무료 웹호스팅 도메인 제작 방법 절차 알아보기 (0) | 2021.02.24 |