728x90
Visual Studio Code라는 솔루션을 MS에서 출시했었다.
출시 당시만 해도 주변 및 해외에서는 놀라운 솔루션이라고 했고, 많은 극찬을 받았다.
하지만, 달랑 뜨는 검은 바탕화면에 Text Editor 같은 프로그램이 떠서 많이 황당했던 기억이였다.
게다가 많은 기능을 완전히 숨긴 형태여서 어디에 무슨 기능이 있는지 확인하는 것도 무척 어려웠다.
그리고 잊혀졌다.
그러다가, PHP 관련해서 몇가지 작업할게 있어서 마땅한 에디터를 찾지 못하고 있었다.
한동안은 Editplus을 이용해서 작업을 했지만, MAC 환경에서 하려다 보니 Editplus를 쓸 수가 없었다.
그래서 잠시 유료 솔루션에 대해서 이런저런 뒤적 뒤적 했지만, 결국 독립적인 프로그램들을 연계해서 쓰는 방법이 유일했다.
그러다가 문득 Visual Studio Code라는 솔루션이 생각이 났다.
이 솔루션이 참으로 좋은것이 Windows용 뿐만 아니라, MAC 또는 Linux용 모든 OS에 아키텍처를 지원했다.
그래서 이거다 싶었고, 하나씩 기능을 탐색해보자, 생각보다 좋은 기능들이 많았다.
이 솔루션의 시작과 끝은 플러그인으로 제공되며, 플러그인을 이용하여 IDE를 구성하여 사용할 수 있게 한다.
지금 부터 아주 라이트한 PHP 개발 형태
- 직접 FTP에다 코드를 쓰는 형태 / 디버그는 웹브라우저? -를 위한 환경을 구축하는 방법을 제시한다.
Visual Studio Code 다운로드 그리고 설치.
Visual Studio Code 사이트에 접속한다. https://code.visualstudio.com/
해당 사이트에 가면 현재 플랫폼에 대해 다운로드 할 수 있다.
Windows용은 Installer 지원되는 exe 파일이고, MAC은 zip으로된 압축 파일을 다운로드 된다.
Windows에서는 그냥 실행해서 설치 마법사의 내용에 따라 진행하면 된다.
MAC의 경우에는 압축을 해제한 뒤, 압축 해제된 프로그램 파일을 Application 폴더에 옮기면 된다.
Linux용은 아직 설치해보지 않아서 잘 모르겠다.
설치는 이게 전부다. 끝이다.
이제 그냥 프로그램을 실행한다.
FTP 플러그 인 설치.
앞서 설명했듯이 서버에 FTP로 접속해서 소스를 직접 수정하는 스타일의 환경을 구축하려 한다.
이를 위해서는 이 Visual Studio Code(이하 VSC) 에 이와 같은 기능을 갖는 FTP 플러그인을 설치해야 한다.
일단 VSC를 먼저 실행한다.
그리고 왼편의 메뉴에서 맨 아래 아이콘을 클릭한다
검색 창에 @sortinstalls 라고 적힌 부분에 ftp라고 입력하면 아래와 같이 ftp 관련 플러그인이 나열된다.
.png)
플러그인이 설치되면 원래는 바로 뜨는 것 같은데, 이 플러그인은 활성화 시키려면 VSC를 재시작하는 것이 좋다.
FTP 설정하기
사실 이 부분부터 막혔었다. 대체 메뉴가 어디 있는지...
하지만, ftp-simple의 Details 내용을 읽어보다가 생각을 바꾸니 이게 생각보다 간편한 환경임을 알 수 있게 되었다. 모든 메뉴는 Context Memu 같은 구성이 아니라, 마치 Command Line 창(도스창)과 같은 명령어 체계로 접근하게 되어 있었다.
F1을 누르면 명령줄이 나오는데, 그안에 ftp 라고 입력을 하면 아래 화면 처럼 관련된 명령들이 표시된다.
.png)
이 중, ftp-simple : Config - FTP Connection setting 을 선택한다. (마우스 혹은 커서키)
그러면 설정 파일 정보를 입력하는 화면이 나온다.
각각 아래와 같이 채우도록 한다.
- name : FTP 연결 정보를 제시하기 위한 이름
- host : FTP 연결을 하기 위한 IP 혹은 도메인 주소
- port : 포트 번호
- type : FTP 연결 타입. 일반 연결은 ftp, SSH는 sftp
- username: 아이디
- password : 아이디에 해당하는 암호
- path : 루트 경로를 기준으로 최초로 연결될 때 원격 경로 ( 리눅스 서버의 경우 대개 /home/xxxxx/www 이런 식으로 되어 있다. )
- autosave : VSC에서 파일을 저장하면 자동으로 업로드 하는 기능. 만일 false로 하면 다른 FTP 프로그램을 사용하는 것과 별반 다르지 않음.
- confirm : 저장할 때, 확인 창이 뜰 지 여부.
.png)
모두 입력이 완료되었으면 저장을 한다. (저장은 Ctrl + S / Command Key + S 를 입력하면 된다. )
만일 여러개의 Server 정보가 있다면 다음과 같이 {} , {} 형식으로 Json 포멧에 맞게 추가하면 된다.
.png)
서버 열기.
사실 VSC에서는 서버를 연다는 기능이 자체적으로 있지 않지만, 이 플러그인을 이용하면 로컬 파일을 연결하듯 처리할 수 있게 된다.다시 F1을 눌러 ftp 항목들을 띄운 뒤, ftp-simple : remote directory open to workspace 를 선택한다.
.png)
정상적으로 연결되면, 원격 경로가 표시된다.
원하는 경로에서 ". Current directory : xxxx " 를 선택한다. 아니면 원하는 경로가 나올때 까지 다른 디렉토리를 선택해서 이동하면 된다.
이제 편집을 원하는 파일을 선택하면 편집 창이 뜨고, 작업을 수행하면 된다.
작업한 뒤, Ctrl + S를 누르면 바로 서버에 적용된다.
즐거운 프로그래밍!!!
728x90
-
dd 2017.11.27 10:30
안녕하세요
위 글 써주신대로 했는데요,
연결까지 되고 파일생성이나 폴더생성하면 적용이 되는데
저장하면 저장이 안됩니다..
왜그럴까요?
autosave true로 설정하였고
편집하여 ctrl+s 누르면 Already exist file '/html/ttt1.html'. Overwrite? 이런 창이 떠서 OK눌렀는데..
끄고 다시 켜보면 수정 전 파일 그대로 입니다ㅜㅜ-
지금 확인해봤는데, 정상적으로 Write되는데요. 일단 Already exist file ... 이 메시지는 설정에 있는 "confirm": true 라서 발생되는 것이여서 false로 하면 안 뜹니다.
만일 Ctrl + S나 저장을 했는데도 적용이 안되었다면, 혹시 FTP로 Write가 되지 않는 경우가 아닐까 싶습니다.
어딘가에 이 FTP 동작에 대한 로그를 볼 수 있으면 좋겠는데, 전혀 나오지가 않네요.. 에러가 나도 내용이 안나오니....
여튼 지금 수정 전과 동일하다면 현재 FTP에 대해서 권한이 충분한지 확인이 필요합니다.
-
