분류 전체보기 (25) 리스트형 Node.js 와 puppetter를 이용한 네이버 쇼핑 매크로 만들기 #1 네이버 쇼핑 매크로를 만들어 보자. 구글 크롬 브라우저의 헤드리스 버전인 Puppeteer를 이용하여 네이버 쇼핑 매크로를 만드는 과정을 공유해 보려 합니다. 네이버 쇼핑 매크로의 동작은 단순합니다. 네이버에 자동으로 로그인해서 원하는 상품 판매 페이지로 이동하여 재고 확인 후 상품 주문창으로 이동합니다. 결제수단을 선택하고 주문을 완료하는 것 까지가 매크로의 동작입니다. 네이버 로그인 상품 상세페이지 이동 재고확인 후 구매하기 클릭 결제수단 지정 후 결제하기 Puppeteer Puppeteer는 Node.js 환경에서 구동되는 백그라운드 작업용 크롬 브라우저 API입니다. 일반 브라우저와 다른 점은 화면을 제공하지 않고 프로그램 API로 동작을 제어할 수 있다는 점입니다. Puppeteer를 이용하면 .. 화면 동영상 캡쳐 프로그램 칼무리 3.0 다운로드 & 사용방법 필수 유틸리티 칼무리 블로그 포스트 작성뿐 아니라 화면 도움말이나 개발 가이드 문서 작성 시에 본문에 삽입할 예시 이미지 작성을 위해 화면 캡쳐 프로그램을 자주 사용하게 됩니다. 전에는 Snagit이라는 유료 소프트웨어를 주로 사용했었던 것 같습니다. 강력한 기능을 가진 완벽한 프로그램으로 기억하는데 유료였습니다. 물론 당시에는 삐리리로 사용했었죠. 칼무리를 알고 난 이후에는 더 이상 다른 화면 캡쳐 프로그램은 검색도 하지 않고 있습니다. 새로운 PC환경 설정 시 칼무리와 Zoomit 그리고 7zip 은 필수로 설치하고 있습니다. 칼무리 3.0 다운로드 칼무리는 오길호 라는 분이 만드신 완전 무료 PC 화면 캡쳐 프로그램입니다. 글 작성을 하고 있는 오늘(7월 23일)에 칼무리가 3.0 버전으로 업데이트.. 티스토리 블로그 발행일자를 과거일자로 수정하기 / 발행시각 감추는 방법 발행일을 과거로 돌릴 수 없다? 티스토리 블로그에서 글 등록 시 발행일을 과거 일자로 설정할 수는 없습니다. 그 이유는 납득이 갑니다. 만약 발행일자를 과거로 설정할 수 있다면 하루 만에 역사와 전통을 자랑하는 블로그를 뚝딱 만들어 낼 수 도 있을 테니까요. 정말 안될까? 과거에 발행했던 글을 수정하다가 잘못해서 현재일자로 발행을 눌러버렸습니다. 최초 발행일로 돌리고 싶었는데 방법이 없더라고요. 진짜로 발행일자 수정이 불가능한지 확인해 보았습니다. 먼저 티스토리 글 발행 시 서버로 전송되는 JSON 패킷을 확인해 봅니다. 티스토리는 글 발행 시 발행일자를 Epoch Time 형태로 변경하여 published 라는 키를 이용하여 전송합니다. 발행 시에 전송되는 데이터에서 published의 값을 과거 날짜.. ES6에 새롭게 추가된 자바스크립트 문법 톺아보기 #1 ECMAScript, ES6 그리고 Babel ES (ECMAScript) ECMAScript(줄여서 ES)는 ECMA International이라는 정보화 관련 국제 표준화 기구에서 정의한 자바스크립트 언어에 대한 표준화 명세입니다. ECMA International 이 매년 자바스크립트의 신규 문법이나 기능 명세(Spec)를 추가하면 구글, 마이크로소프트, 모질라 등의 브라우저 제조사에서 자사의 자바스크립트 엔진에 새로운 기능을 추가해서 배포합니다. 넷스케이프에서 최초로 자바스크립트를 자사의 브라우저에 탑재한 것이 1996년 이었고 ECMA Internaional 은 이듬해인 1997년 자바스크립트 표준화를 위해 ECMAScript 초판을 발행합니다. 2015년에 6판을 발행한 이후로는 매년 개정된 명세를 꾸준히 발행하고 있습니다. 가장 최근인 .. 인텔리제이(IntelliJ IDEA) 유용한 키보드 단축키 32가지 (PC) IntelliJ IDEA 올해 초 까지만 해도 저는 Eclipse 만 사용했습니다. IntelliJ 가 생산성 향상에 월등하다는 이야기를 주위에서 많이 듣긴 했지만, 익숙한 툴을 바꾸기도 쉽지가 않았고 뭔가 겉멋(?)이 드는 것 같아서 애써 외면해 왔습니다. 그러던 와중에 IntelliJ를 함 익혀보자 해서 몇 달간 사용해 보니... 역시나 과연 신천지 새로운 세상에 눈을 뜬 기분이 들었습니다. 물론 지금도 SI 프로젝트에서는 표준 개발도구로 Eclipse와 VS Code를 주로 사용합니다. 아마도 앞으로도 당분간은 SI 개발환경이 IntelliJ로 가기는 쉽지 않을 것으로 예상합니다. IntelliJ IDEA Community 에디션의 경우는 Apache 2.0 라이선스라서 상업용 개발에도 전혀 문제가.. 화면 확대 프로그램 ZoomIt 다운로드 & 사용법 필수 유틸리티 ZoomIt 직장생활을 하다 보면 프레젠테이션 스크린뿐 아니라 모니터 화면을 동료와 함께 보면서 이야기를 나눠야 하는 경우가 많습니다. 이때마다 꼭 사용하게 되는 화면 확대 유틸리티 프로그램이 ZoomIt입니다. 설치도 간편하고 사용법도 직관적이어서 저는 노트북을 교체할 때마다 일단 깔아놓고 시작하는 필수 유틸리티 중 하나입니다. ZoomIt 다운로드 ZoomIt 프로그램은 무려 마이크로소프트 공식 사이트에서 Windows 유틸리티로 배포되고 있습니다. 아래 마이크로소프트 사이트로 이동하시면 ZoomIt 설치 파일을 다운로드할 수 있고, 간단한 사용법도 익힐 수 있습니다. https://docs.microsoft.com/ko-kr/sysinternals/downloads/zoomit Zoo.. 티스토리 카테고리 링크 구글 애드센스 에러 해결하기 (광고 안보이는 현상) 애드센스 광고가 나왔다 안 나왔다 한다? 티스토리 블로그에 글을 꾸준히 작성해서 그 어렵다는 애드센스 고시를 어렵게 어렵게 통과했습니다. 이제 애드센스 사이트에서 광고 단위를 생성하고 어떻게 광고를 달아야 돈이 벌릴까를 고민하며 이리저리 만져보게 됩니다. 그런데 가끔씩 애드센스 광고가 나왔다 안 나왔다 하는 현상이 발견됩니다. 카테고리 목록에서 선택한 경우에 광고가 안나온다. 관련 카테고리 글 목록에서 클릭하여 본문을 열 경우에 애드센스 광고가 안 나오는 현상이 목격됩니다. 본문 하단의 카테고리의 다른 글 목록에서 클릭하여 오픈된 페이지에서도 광고가 나오지 않습니다. 저 말고 다른 티스토리 블로거의 사이트에서도 동일한 현상을 목격했습니다. 페이지 URL 이 오염되면 안 나온다? 검색엔진에서 유입되거나 블.. Git commit 되돌리기 명령어 Reset 과 Revert Git 커밋(commit) 이력 되돌리기 이미 커밋(commit)된 작업 이력을 이전으로 되돌려야 하는 상황은 항상 발생합니다. 작업중에 실수로 올라간 커밋일 수 도 있고 버그나 오류가 포함된 커밋 일수도 있습니다. Git 에서는 이러한 상황에서 reset 이나 revert 명령을 사용하여 과거로 되돌아 갈 수 있습니다. Git reset Git reset 명령어는 현재 작업중인 브랜치의 HEAD 포인터를 과거의 특정 시점을 가르키도록 되돌립니다. 이 때 변경된 파일들을 스테이지 영역에 보존 시킬 수 도 있고 아예 깨끗하게 지워버릴 수 도 있습니다. git reset reset --soft 소프트 리셋은 과거의 커밋으로 인해 발생한 변경 사항을 제거하지 않고 과거의 커밋으로 HEAD 포인터를 이동시킵니다.. 티스토리 블로그 본문 중간에 구글 애드센스 광고 자동으로 삽입하기 블로그 글 본문에 삽입된 애드센스 광고 글의 전체 맥락을 해치지 않는다면 블로그 글 본문에 구글 애드센스 광고를 삽입해도 무방하다고 생각하는 편입니다. 글의 길이가 충분히 길고 제공하는 콘텐츠의 내용이 풍부하다면 본문 중간에 삽입된 광고는 블로그 운영자와 방문자 모두에게 도움이 될 거라 생각합니다. 애드센스 광고 삽입 방법 블로그 글 본문에 애드센스 광고를 삽입하는 방법은 여러가지가 있습니다. 1) 티스토리 구글 애드센스 플러그인을 활용하는 방법도 있고, 2) 서식이나 외부 콘텐츠를 이용해서 직접 광고 코드를 본문 내에 삽입하는 방법도 있습니다. 두 가지 방법 모두 맘에 안 드는 부분이 있습니다. 구글 애드센스 플러그인의 경우 광고 삽입 위치를 내 마음대로 선택하는 것이 불가능 합니다. 광고 재게 위치를.. 티스토리 블로그 이미지 그림자 효과 주기 이미지 그림자 효과 이미지에 box-shadow CSS 속성을 적용하여 테두리에 그림자 효과를 줄 수 있습니다. 티스토리 블로그 에디터에서 이미지에 효과를 줄 수는 없기 때문에 스킨의 CSS를 수정하거나 스킨에 Javascript 코드를 삽입하는 방법으로 이미지에 그림자 효과를 줄 수 있습니다. CSS box-shadow 속성 CSS box-shadow 속성의 문법은 다음과 같습니다. box-shadow: h-offset v-offset blur spread color h-offset 과 v-offset 은 필수로 지정해야 하는 속성 값이고 나머지 속성 값은 생략이 가능합니다. Value Description h-offset 그림자의 수평 위치 설정. 음수로 설정하면 왼쪽으로 이동시킵니다. (필수) v-.. 이전 1 2 3 다음
