VSCode(비주얼스튜디오코드)에서 SFTP에 직접 붙어 작업하기(부제 : 안녕, Editplus)

VSCode(비주얼스튜디오코드)에서 SFTP에 직접 붙어 작업하기 (부제 : 안녕, Editplus)

---

아마 웹개발자라면 누구나 Editplus를 써보았을 것이다. 아니, 지금도 사용하고 있는 웹개발자도 많을 거라 생각된다. FTP에 직접 붙어서 서버에 있는 파일을 직접 열어 작업하고 저장하는데는 Editplus만한 툴이 없다고 생각된다. 허나 나는 FTP에 직접 붙어서 작업할 일도 없어지기도 하고 서버에 직접 붙어서 작업하다보면 다수의 개발자가 존재할 경우 충돌이슈나 버전관리도 안되기때문에 사용한지는 꽤 됐다. 아예 Editplus는 설치도 안되어있다. 최근에는 주로 VSCode나 Eclipse를 주로 사용하는 편인데 얼마전 회사 업무 중 직접 FTP에 붙어서 작업해야하는 이슈가 생겨 VSCode에서 직접 서버에 붙어 작업할 수 있나 검색해보니 역시 누군가 개발해두었다. (짱짱)

 

한때 전성기를 누렸던 Editplus!

---

먼저 SFTP사용을 위해 Extensions (확장툴)을 다운받아야 한다. 좌측의 Extensions 탭을 클릭하거나 단축키 "Ctrl+Shift+X" 키를 눌러 검색창에 "sftp"라고 검색하여 많은 검색 결과 중 "SFTP"를 설치한다.

 

vscode의 sftp확장툴 설치

설치가 완료되면 키보드 "F1"를 눌러 뜨는 상단 검색창에 "sftp"라고 검색 후 뜨는 결과 중 "SFTP : config" 를 선택한다.

 

서버 정보 입력을 위해 sftp:config를 실행한다.

"SFTP : Config"를 선택하면 아래와 같이 "sftp.json"파일이 열린다. 해당 프로젝트의 서버정보를 입력해준다.

 

sftp.json파일이 열리면 서버정보를 입력한다.

서버정보 입력이 완료되면 저장 후 다시 "F1"키를 눌러 "sftp"라고 검색 후 뜨는 결과 중 "SFTP : Download Project" 를 선택한다.

 

SFTP : Download Project 선택

"SFTP : Download Project" 를 선택한 후 프로젝트를 다운받을 폴더를 선택하면 프로젝트 다운로드가 시작되고 프로젝트 다운로드가 완료되면 좌측 WORKSPACE에 프로젝트가 뜨게된다.

 

WORKSPACE에 프로젝트 다운로드가 완료되었다.

코드 수정 후 서버 적용은 마우스 우클릭 하여 "SFTP : Upload"메뉴를 선택 하면 된다. 

 

SFTP : Upload 기능으로 서버에 업로드한다.

솔직한 후기는 서버에 붙어서 작업하는 행위 자체는 에디트플러스만큼 편하진 않다. (그만큼 안전하진 않겠지만..) 그래도 완전히 에디트플러스에 의존하진 않아도 되는게 어딘가.

---

2020/01/29 - [업무 도움되는] - 무료 온라인 이미지 최적화 서비스 - Optimizilla

무료 온라인 이미지 최적화 서비스 - Optimizilla

2019/09/02 - [CSS] - CSS 구글 스타일가이드 자세히보기 #3 CSS 메타 규칙

CSS 구글 스타일가이드 자세히보기 #3 CSS 메타 규칙

2019/08/28 - [업무 도움되는] - 작업 샘플(임시) 이미지 자동 생성 placeholder.com / picsum.photos

작업 샘플(임시) 이미지 자동 생성 placeholder.com / picsum.photos