보관물

작성자 보관물

vs code에서 원격 서버(aws)파일 수정하기

최근에 개발을 파이썬 위주로 하게되면서 마이크로소프트의 공개 에디터인 Visual Studio Code( 이하 vs code) 주로 많이 사용한다. 아직 매우 익숙하지는 않지만 지원이 잘되는 매우 깔끔한 에디터로 기존의 sublime이나 atom보다 괜찮게 생각하고 있다.

이 vs code에서는 플러그인을 통해서 원격서버에 접근하여 원격 서버의 파일을 직접 에디팅하는 기능을 제공하는데, 해당 기능을 이용해서 aws ec2의 서버 파일을 수정하는 방법을 step by step으로 알아보자.

Step 1. vs code가 설치가 되어 있어야 한다. (참고, https://code.visualstudio.com/)

Step 2. 두번째는 vs code에 remote vscode를 설치해야 한다. vs code가 실행된 상태에서 cmd+p를 누르고 ‘ext install remote-vscode를 입력하자. (이외에 확장 아이콘을 클릭해서 마켓플레이스에서 Remote VSCode를 검색하는 방법도 있다.)

Step 3. 이제 remote vscode의 설정 값을 일부 수정한다. 메뉴에서 상단 메뉴바에서 Code>기본설정>설정으로 들어간다. (단축키로 cammand+, 를 이용할 수 있다.) 설정 정보에서 remote로 검색하여 remote.onstartup을 true로 변경한다. 변경 시에는 왼쪽의 펜모양을 이용하거나 오른쪽으로 옮겨진 화면에서 수정해야 한다.

Step 4. 이제 서버(필자는 Ubuntu를 사용중이다.)에서 작업이 필요하다. 커맨드로 연결하여 rmate를 설치한다. 설치 파일 다운 등 여러 방법이 있지만 pip를 이용해서 간단하게 설치 가능하다. (* pip install rmate)

Step 5. rmate를 실행하기 위해서는 local의 연결 포트를 지정해야 하므로 ssh의 -R 옵션을 이용해서 포트를 고정한다. 기본 설정값인 52698 포트를 사용하도록 하자. (설정에서 변경했다면 변경된 포트를 사용해야 한다.)

ssh -R 52698:localhost:52698 -i “xxxx.pem” ec2-user@[aws url 또는 ip주소]

Step 6. 이제 연결된 터미널에서 아래 명령을 입력하면 vs code에 해당 파일이 열리는 것을 볼 수 있다.

rmate -p 52698 [파일경로/파일명]

이상 내용은 맥을 기준으로 작성했다. 간단하게 터미널 접속해서 vs code를 통해 편리하게 수정하고 바로 터미널에서 결과를 실행해 볼 수 있는 remote vscode 기능이 매우 편리할 것으로 생각된다.

 

Advertisements
카테고리:Programming 태그:,

너무 편해 무서운 모바일 송금 – 토스

오늘 페북을 보던 중 아래와 같은 피드를 보고 무심코 링크를 눌려보았습니다. 우산이 약간 필요하기도 했습니다. (요즘 가뭄인데!)

스크린샷 2016-02-16 오후 7.00.56.png

링크(https://toss.im/to/tossmall)을 누르고 나니, 바로 금액과 전화번호 입력 창이 나오네요.

스크린샷 2016-02-16 오후 7.00.25.png

내용을 입력하고, 확인을 누르면 다음 단계로 넘어갑니다.

스크린샷 2016-02-16 오후 7.00.19.png

ARS 전화요청 버튼 클릭하니, 전화 와서 위 인증 번호를 눌러주었습니다.

아래 창에서 보내기 누르고, 나의 통장에서 돈이 빠져 나갔습니다.

스크린샷 2016-02-16 오후 7.00.13.png

이미 토스에 가입되어 있었다는 전제가 있지만, 통장번호/인증서 등등 아무 것도 없이 구매 진행을 완료할 수 있겠구나라는 생각이 드네요. (토스도 그걸 테스트 하려던 거겠죠.)

 

카테고리:Programming

url에서 페이지 정보 가져오기.

페이스북에서 링크를 삽입하면 아래 이미지처럼 자동으로 썸네일과 타이틀, 설명 등을 읽어 들이는 기능이 있다.

스크린샷 2016-02-04 오후 3.11.19.png

이와 유사한 기능을 하기 위해 여러가지 방법을 고민해 볼 수 있는데, 이도 역시 누군가 친절하게 만들어둔 jQuery plugin이 있다.

사용 방법과 소개는 아래 링크를 참고.

http://embedly.github.io/jquery-preview/demo/index.html

스크린샷 2016-02-04 오후 3.15.59.png

 

사진으로 홍보하기

요즘 회사에서 이런 저런 마케팅 테스트를 많이 합니다. 그런 테스트 과정에서 주로 많이 사용하는 것은 ‘이미지’와 ‘홍보문구’ 인데요. 이미지 같은 경우는 매우 주관적이라 어느게 좋다고 하기가 애매한 경우가 많죠.

이럴 때 사용하면 좋은 내용이 있습니다. 바로~ LaMem (Large-scale Image memorability) (

동작 방식 까지는 정확하게 모르겠지만 (사이트에 논문이 첨부되어 있어보면 좋을 듯!), 일단 사람이 기억하기 좋은 이미지를 찾아 볼 수 있다는 매우 흥미로운 내용입니다.

관련 사이트 : http://memorability.csail.mit.edu/demo.html

스크린샷 2016-01-26 오후 3.03.27

카테고리:Programming

깔끔한 자바 프레임워크 중 하나 – Material Design Lite!

UI를 구현하기 좋은 다양한 프레임워크가 많이 있습니다.

그런 프레임워크 중에서 최근에 눈에 띈 프레임워크가 있어 Material Design Lite(http://www.getmdl.io)를 소개합니다.

Material Design Lite Homepage   Meterial Design Lite Components

위에 링크된 사이트에 들어가서 쭉 훓터 보면 알 수 있습니다. 매우 다양한 컴포넌트도 제공하고 있습니다.

그 중에서 특히 텍스트박스의 Placeholder가 제목으로 변하는 것은 정말 좋은 UX인 것 같습니다.

Material Design Lite's TextBox Component

카테고리:Programming

개발노트 11/24 (2014)

* 주요 24개의 프로그래밍 언어를 지원하며 웹에서 바로 결과를 확인할 수 있는 온라인 코딩 환경를 제공해 주는 사이트가 있네요. 학습용이나 간단한 코드 테스트 용도로 사용할 수 있을 것 같아요. – https://paiza.io

paiza.IO

카테고리:Programming

개발노트 9/25 (2014)

* 반응형 웹사이트의 속도를 빠르게 하는 7가지 팁 – http://goo.gl/Sla1te

* 리모트 도입기 (과연, 원격에서 개발을 할 수 있을까?) – http://goo.gl/Vbm5i9

* 비동기 프로그래밍 이해하기 – http://goo.gl/QWCwzD

* PHP에서 autoload 사용하기 – http://goo.gl/R6k2zD

%d 블로거가 이것을 좋아합니다: