PYRASIS.COM: 이재홍의 GitHub 탐험기 2014/08/02

책 또는 웹사이트의 내용을 복제하여 다른 곳에 게시하는 것을 금지합니다.
책 또는 웹사이트의 내용을 발췌, 요약하여 강의 자료, 발표 자료, 블로그 포스팅 등으로 만드는 것을 금지합니다.

peco - Simplistic interactive filtering tool

peco는 콘솔에서 사용할 수 있는 강력한 필터링 툴입니다. 콘솔 출력 결과를 파이프(|)로 넘기면 프롬프트가 나오고 내용을 필터링 할 수 있습니다. 윈도우에서도 쓸 수 있군요. 마음에 듭니다.

ps aux로 프로세스를 확인할 때 항상 grep을 썼는데요. 이게 훨씬 편하군요.

설치. 일단 Go를 먼저 설치합니다. go_work 디렉터리를 생성하고 GOPATH 변수를 설정합니다.

$ sudo apt-get install golang-go
$ mkdir go_work
$ export GOPATH=~/go_work

이제 peco를 설치합니다.

$ go get github.com/peco/peco/cmd/peco

설치가 끝나면 ~/go_work/bin에 peco 실행파일이 생깁니다.

store.js - localStorage wrapper for all browsers without using cookies or flash

https://github.com/marcuswestin/store.js

store.js는 웹 브라우저에서 쿠키나 플래시를 사용하지 않고 로컬에 데이터를 저장합니다. 쿠키는 HTTP 헤더에 항상 포함되어 있어서 패킷 크기가 커지고, 데이터 유출의 위험이 있습니다(뭐 보통 암호화해서 저장하지만...). Node.js에서도 사용할 수 있군요.

사용방법은 간단합니다.

<script src="store.min.js"></script>
<script>
    store.set('username', 'George Walker Bush');

    var username = store.get('username');
</script>

animate.css - A cross-browser library of CSS animations

https://github.com/daneden/animate.css

CSS 애니메이션 라이브러리입니다. 다양한 효과를 지원하는군요.

간단한 예제를 만들어봤습니다.

<div className="btn btn-primary" id="animate">애니메이션 시작</div>
<span style="display: block; font-size: 30px; text-align: center;" id="bounce">심장이 바운스 바운스</span>
<script src="/assets/themes/twitter/js/jquery-1.11.1.min.js"></script>

<script>
  function loadcss(url) {
   var head = document.getElementsByTagName('head')[0];
   link = document.createElement('link');
   link.type = 'text/css';
   link.rel = 'stylesheet';
   link.href = url;
   head.appendChild(link);
   return link;
 }
 loadcss('/assets/files/2014-08-02-github-expedition-log/animate.min.css');
 
 $('#animate').click(function () {
   $('#bounce').addClass('animated bounceIn');
   
   $('#bounce').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function () {
     $('#bounce').removeClass('animated bounceIn');
   });
 });
</script>

<head> 태그에서 animate.min.css를 로드하고, jQuery로 animated와 애니메이션 키(bounceIn)를 클래스에 넣어주면 됩니다. 애니메이션 효과를 없애고 싶으면 설정했던 클래스를 삭제하면 됩니다.

<head>
  <link rel="stylesheet" href="/animate.min.css">
  <link rel="stylesheet" href="/bootstrap.min.css">
</head>
<body>
  <div className="btn btn-primary" id="animate">애니메이션 시작</div>
  <span style="display: block; font-size: 30px; text-align: center;" id="bounce">심장이 바운스 바운스</span>
  <script src="/jquery-1.11.1.min.js"></script>

  <script>
    $('#animate').click(function () {
      $('#bounce').addClass('animated bounceIn');
   
      $('#bounce').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function () {
        $('#bounce').removeClass('animated bounceIn');
      });
    });
  </script>
</body>

goquery - A little like that j-thing, only in Go.

https://github.com/PuerkitoBio/goquery

jQuery 스타일 셀렉터를 Go에서 사용할 수 있도록 구현한 라이브러리입니다. Go에서 HTML을 조작할 때 유용하겠습니다.

import (
    "fmt"
    "log"
    "github.com/PuerkitoBio/goquery"
)

func ExampleScrape_MetalSucks() {
    var doc *Document
    var e error
    
    if doc, e = NewDocument("http://metalsucks.net"); e != nil {
        log.Fatal(e)
    }
    
    doc.Find(".reviews-wrap article .review-rhs").Each(func(i int, s *Selection) {
        // For each item found, get the band and title
        band := s.Find("h3").Text()
        title := s.Find("i").Text()
        fmt.Printf("Review %d: %s - %s\n", i, band, title)
    })
}