WEB개발

  • 더미 이미지를 무료로 제공해 주는 사이트를 소개합니다.

    웹사이트 개발 시 더미 이미지가 필요한 경우가 있습니다. 레이아웃을 잡는 거라 특별히 의미가 없는 이미지만 필요한 경우 어디서 구하기도 힘들고 저작권도 신경쓰이고 할때 임시로 이미지를 제공해 주는 사이트가 있습니다. 사용법도 아주 쉽게 적용이 가능 합니다. 다만 인터넷이 연결이 되어 있어야 합니다. 더미 이미지 제공 placeimg.com placeimg는 더미이미지를 크기와 카테고리만 지정하면 해당 크기와 카테고리에 해당하는 이미지를 […]

  • VirtualBox와 Vagrant의 기본 사용법

    프로그램의 개발환경을 구축할 때 이제는 VirtualBox나 VMware같은 가상머신을 사용하는 것이 보편화 되었습니다. 가상머신 위에서 개발을 할 경우 심적인 부담없이 자유롭게 개발을 할 수가 있습니다. 예를들어 여러가지 오픈소스를 설치하여 사용 하더라도 다른 프로그램과 충돌이 날 것에 대해 걱정을 하지 않아도 되고 혹시라도 시스템이 죽거나 복구가 불가능할 경우에는 가상머신을 제거하고 다시 설치하여 사용하면 되므로 안심하고 개발을 할 […]

  • 일렉트론(Electron) 소개 및 사용법

    일렉트론(Electron)은 Node.js를 기반으로 javascript, html, css를 사용하여 데스크탑 애플리케이션을 만드는 플랫폼입니다. 이것은 GitHub에서 모던 에디터인 Atom 에디터를 만들면서 공개한 오픈소스입니다. 웹개발자의 입장에서 보면 데스크탑 APP을 개발하는데 있어서 진입장벽이 낮을 뿐만아니라 크로스플렛폼까지 지원하여 윈도우즈, Mac OS X, 리눅스 등 다양한 OS에서 동일하게 사용할수 있는 장점이 있어서 인기가 많습니다. 일렉트론(Electron)은 간단하게 생각하면 웹브라우저 안에 Node.js를 포함시킨 것이라고 […]

  • PhantomJS와 CasperJS 사용법

    프론트앤드 개발을 하거나 웹자동화에 관심이 있는 분이라면 PhantomJS와 CasperJS를 많이 들어봤을 것입니다. 저도 이번에 크롤링 공부를 하면서 알게되어 잊어버리지 않기위해 간단하게 정리를 하려고 합니다. PhantomJS (팬텀JS) 팬텀JS는 화면이 없는 브라우저라고 보면 됩니다. 화면이 없는 브라우저를 어따가 써먹지? 라고 생각할 수도 있겠지만 웹프로그램으로 웹자동화를 개발하기에는 더없이 편리한 기능을 제공하고 있습니다. 입력상자에 값을 입력한다던가 마우스로 버튼을 클릭한다던가 […]

  • 정기적인 작업을 수행해 주는 스케쥴러들

    윈도우즈나 리눅스(유닉스), 또는 Mac OS X 같은 시스템에는 기본적으로 정기적으로 반복작업을 처리해 주는 스케줄러 프로그램들이 내장되어 있습니다. 윈도우즈에서 작업 스케줄러가 있는것 처럼 리눅스나 Mac OS X에는 cron이라는 것이 있습니다. 윈도우즈는 GUI(Graphic User Interface)로 되어 있어 화면을 보고 마우스로 쉽게 설정을 할 수 있는 반면 리눅스는 쉘에서 텍스트 형태로 작성을 해야 하기 때문에 먼저 학습이 필요합니다. […]

  • nano에디터 소개 및 사용법

    윈도우를 사용할 경우는 전용에디터를 사용하면 되는데.. 리눅스나 유닉스 같은 경우 CLI환경에서 간단한 수정을 할 경우는 vi 애디터만큼 편한 것이 없습니다. 다만 vi 에디터가 사용자 친화적이 아니여서 그것을 사용하려면 별도의 학습이 필요하고 사용법을 익혔다고 하더라도 한동안 사용하지 않다가 다시 사용하려면 여간 헷갈린 것이 아닙니다. 그래서 그런 불편한 점을 해소하기 위해서 많이 사용하는 것이 nano 에디터 입니다. […]

  • 가상머신에 Node.js설치하고 환경설정하기

    이전 포스팅에서 VirtualBox와 Vagrant를 소개하고 설치하는 포스팅을 했었습니다. 이번에는 가상머신 위에 간단하게 Node.js를 설치하고 환경설정을 하는 방법을 포스팅하겠습니다. NVM (Node Version Manager) 설치하기 NVM은 Node.js를 버전별로 설치하고 관리할 수 있게 도와주는 툴입니다. 그래서 한 시스템 안에 기존버전의 Node.js를 삭제할 필요없이 여러 버전의 Node.js를 쉽게 설치하고 사용할 수 있게 해 줍니다. 주의 할 점은 NPM을 사용하지 […]

  • Gruntfile의 주요 플러그인들

    앞선 포스팅에서 Grunt 소개와 설치방법를 소개했었습니다. 이번에는 Grunt의 주요 플러그인들을 소개하고 간략한 설명을 포스팅 하겠습니다. 플러그인 Grunt.js에서 말하는 플러그인과 Node.js에서 말하는 패키지는 동일한 것입니다. 그래서 Grunt에서 패키지를 설치하는 방법과 Node.js에서 패키지를 설치하는 방법이 동일합니다. 플러그인 찾기 대부분의 Grunt 플러그인들은 Grunt사이트의 Plugin 메뉴에서 확인할 수 있습니다. 먼저 Grunt웹사이트의 플러그인 메뉴로 이동합니다. 원하는 기능의 플러그인을 검색창을 이용하여 […]

  • Gruntfile의 구조와 사용법

    Gruntjs를 사용한다고 하는것은 gruntfile.js를 다룰 줄 안다고 하는 것과 마찬가지로 gruntfile.js는 중요합니다. 중요하다고 해서 배우기가 어렵다는 말은 아닙니다. 개인의 차이는 있겠지만 보통 1~2일이면 개념을 이해 할 수 있고 1주일 정도면 구글링을 하면서 Gruntjs를 사용할 수 있을 정도로 어렵지 않습니다. 이전 포스팅에서 Gruntjs의 소개와 설치법을 작성했으니 완전 초보자이시면 이전 포스팅을 먼저 보는 것이 도움이 될것 같습니다. […]

  • 웹프로그램 개발 시 필요한 샘플 이미지를 무료로 제공해 주는 사이트

    웹사이트를 개발하다 보면 이미지 영역을 잡는 경우가 있습니다. 이때 사용할 수 있는 무의미한 더미 이미지를 무료로 제공해 주는 사이트가 있어 포스팅합니다. 더미 이미지를 제공해 주는 사이트도 있고 이미지의 글자정보만 제공해 주는 사이트도 있습니다. 더미 이미지 제공 placeimg.com placeimg는 더미이미지를 크기와 카테고리만 지정하면 해당 크기와 카테고리에 해당하는 이미지를 보여줍니다. 사용법은 매우 간단합니다. 웹사이트 : placeimg.com 기본사용법은 […]