Stories.pe.kr
여행과 요리에 관한 이야기
반짝이는 여행의 순간과 따뜻한 한 끼의 기록
반짝이는 여행의 순간과 따뜻한 한 끼의 기록
프론트앤드 개발을 하거나 웹자동화에 관심이 있는 분이라면 PhantomJS와 CasperJS를 많이 들어봤을 것입니다. 저도 이번에 크롤링 공부를 하면서 알게되어 잊어버리지 않기위해 간단하게 정리를 하려고 합니다. PhantomJS (팬텀JS) 팬텀JS는 화면이 없는 브라우저라고 보면 됩니다. 화면이 없는 브라우저를 어따가 써먹지? 라고 생각할 수도 있겠지만 웹프로그램으로 웹자동화를 개발하기에는 더없이 편리한 기능을 제공하고 있습니다. 입력상자에 값을 입력한다던가 마우스로 버튼을 클릭한다던가 […]
윈도우즈나 리눅스(유닉스), 또는 Mac OS X 같은 시스템에는 기본적으로 정기적으로 반복작업을 처리해 주는 스케줄러 프로그램들이 내장되어 있습니다. 윈도우즈에서 작업 스케줄러가 있는것 처럼 리눅스나 Mac OS X에는 cron이라는 것이 있습니다. 윈도우즈는 GUI(Graphic User Interface)로 되어 있어 화면을 보고 마우스로 쉽게 설정을 할 수 있는 반면 리눅스는 쉘에서 텍스트 형태로 작성을 해야 하기 때문에 먼저 학습이 필요합니다. […]
윈도우를 사용할 경우는 전용에디터를 사용하면 되는데.. 리눅스나 유닉스 같은 경우 CLI환경에서 간단한 수정을 할 경우는 vi 애디터만큼 편한 것이 없습니다. 다만 vi 에디터가 사용자 친화적이 아니여서 그것을 사용하려면 별도의 학습이 필요하고 사용법을 익혔다고 하더라도 한동안 사용하지 않다가 다시 사용하려면 여간 헷갈린 것이 아닙니다. 그래서 그런 불편한 점을 해소하기 위해서 많이 사용하는 것이 nano 에디터 입니다. […]
이전 포스팅에서 VirtualBox와 Vagrant를 소개하고 설치하는 포스팅을 했었습니다. 이번에는 가상머신 위에 간단하게 Node.js를 설치하고 환경설정을 하는 방법을 포스팅하겠습니다. NVM (Node Version Manager) 설치하기 NVM은 Node.js를 버전별로 설치하고 관리할 수 있게 도와주는 툴입니다. 그래서 한 시스템 안에 기존버전의 Node.js를 삭제할 필요없이 여러 버전의 Node.js를 쉽게 설치하고 사용할 수 있게 해 줍니다. 주의 할 점은 NPM을 사용하지 […]
앞선 포스팅에서 Grunt 소개와 설치방법를 소개했었습니다. 이번에는 Grunt의 주요 플러그인들을 소개하고 간략한 설명을 포스팅 하겠습니다. 플러그인 Grunt.js에서 말하는 플러그인과 Node.js에서 말하는 패키지는 동일한 것입니다. 그래서 Grunt에서 패키지를 설치하는 방법과 Node.js에서 패키지를 설치하는 방법이 동일합니다. 플러그인 찾기 대부분의 Grunt 플러그인들은 Grunt사이트의 Plugin 메뉴에서 확인할 수 있습니다. 먼저 Grunt웹사이트의 플러그인 메뉴로 이동합니다. 원하는 기능의 플러그인을 검색창을 이용하여 […]
Gruntjs를 사용한다고 하는것은 gruntfile.js를 다룰 줄 안다고 하는 것과 마찬가지로 gruntfile.js는 중요합니다. 중요하다고 해서 배우기가 어렵다는 말은 아닙니다. 개인의 차이는 있겠지만 보통 1~2일이면 개념을 이해 할 수 있고 1주일 정도면 구글링을 하면서 Gruntjs를 사용할 수 있을 정도로 어렵지 않습니다. 이전 포스팅에서 Gruntjs의 소개와 설치법을 작성했으니 완전 초보자이시면 이전 포스팅을 먼저 보는 것이 도움이 될것 같습니다. […]
웹사이트를 개발하다 보면 이미지 영역을 잡는 경우가 있습니다. 이때 사용할 수 있는 무의미한 더미 이미지를 무료로 제공해 주는 사이트가 있어 포스팅합니다. 더미 이미지를 제공해 주는 사이트도 있고 이미지의 글자정보만 제공해 주는 사이트도 있습니다. 더미 이미지 제공 placeimg.com placeimg는 더미이미지를 크기와 카테고리만 지정하면 해당 크기와 카테고리에 해당하는 이미지를 보여줍니다. 사용법은 매우 간단합니다. 웹사이트 : placeimg.com 기본사용법은 […]
github에서 만든 무료 Atom 에디터에서 기본적으로 설치해야 할 Packages(플러그인)을 정리해 봤습니다. === Packages used Package Website 설명 O sync-settings https://atom.io/packages/sync-settings Atom에디터의 설정을 저장해서 어디에서든 동일한 환경으로 에디팅을 할 수 있게 해줌 O atom-beautify https://atom.io/packages/atom-beautify HTML, CSS, JavaScript, PHP의 코드 정렬 O color-picker https://atom.io/packages/color-picker 에디터에서 바로 컬러값을 보고 선택할 수 있음 O Remote-FTP https://atom.io/packages/Remote-FTP 서브라임텍스트의 SFTP와 […]
지금은 Opensource의 시대라고 할 수 있을 정도로 Opensource를 많이 사용하고 있는 추세입니다. 때로는 나도 모르는사이에 Opensource를 사용하고 있기도 하구요. Opensource가 자유롭게 사용할 수는 있으나 무료는 뜻은 아닙니다. 그래서 Opensource를 사용하면서 주의해야 할 점에 대해 핵심만 정리해 보도록 하겠습니다. No 라이선스 BSD MIT Apache MPL EPL LGPL2 GPL2 GPL3 AGPL3 1 수정, 배포의 권한허용 O O […]
HTML에서 iframe을 사용할 경우 XSS(Cross Site Scripting) 공격에 대한 방어의 목적으로 SOP( Same Oringin Policy) 정책을 걸어놨습니다. iframe을 이용한 XSS공격은 간단히 설명하면 해커가 어떤 게시판에 글을 작성할때 iframe으로 해킹코드가 있는 문서를 불러오도록 해 놓을 경우 해당 게시물을 열어 보는 대부분의 사용자 정보를 탈취할 수 있게 되는 해킹 기법을 말합니다. 하지만 보안이 검증된 youtube 영상을 불러온다던가 […]
