GoでEnd To End Testingフレームワーク書いた - Webtech Walker
SeleniumラッパーなテストフレームワークをGoで書いてみた。初Go。 https://github.com/hokaccha/sprinkler GoのコードでE2Eテストのコード書けてもあんまり嬉しくないのでYAMLで書けるようにした。 scenarios: - name: Hello sprinkler! actions: - visit: http://www.google.com - assert_title: Google - wait_for: input[type="text"] - input: element: input[type="text"] value: Hello - submit: form[name="f"] - wait: 1000 - assert_text: element: "#main" contain: Hello こんな感じのYAMLを以
peco、ghq、gh-openの組み合わせが捗る - Webtech Walker
それぞれのツールは以下を見ればどんなのかわかると思う。 peco（Simplistic interactive filtering tool）を作った話 : D-7 ghq: リモートリポジトリのローカルクローンをシンプルに管理する - 詩と創作・思索のひろば (Poetry, Writing and Contemplation) GitHubのレポジトリURLを開くgh-openコマンド - unknownplace.org pecoとghqを組み合わせる例はpecoのREADMEにあるようにかなり強力で、ghqで管理しているリポジトリのディレクトリにcdしたりするのに便利。 こんな感じ。 $ cd $(ghq list -p | peco) また、typester先生作のgh-openは指定したディレクトリのリポジトリをGitHubで開けるので、同じように使えばpecoでGitHubの
ブログをJekyllからmiddlemanに移行してTravis CIでGitHub Pagesにデプロイするようにした - Webtech Walker
ちょうど一年くらい前にWordPressからJekyllに移行したんだけど、今回middlemanで作りなおしてみた。 hokaccha/webtech-walker - GitHub 特にJekyllに不満があったわけでもなく単に技術的興味によるもの。 middleman Middleman: Hand-crafted frontend development middlemanはほぼJekyllのようなものなんだけど、Asset Pipelineが使えたり、テンプレートがerbとかhaml、Slimなどで書けたり、helperが充実してたりする。 RailsのViewまわりの機能をそのまま持ってきたような感じなので、普段Rails使ってる人にとってはJekyllよりも使いやすいかもしれない。個人的にもJekyllよりはmiddlemanのほうが好みだった。 調べた時にでてくる情報量など
「ノンプログラマのためのJavaScriptはじめの一歩」の1章が公開されました - Webtech Walker
11/7発売予定の書籍「ノンプログラマのためのJavaScriptはじめの一歩」のはじめにと1章が先行して技評のWebサイトで公開されました。 はじめに 1章 1章はイントロ的なところで、JavaScriptを学ぶ前にJavaScriptの動かし方やデバッグツールの使い方について解説しています。 また、本書籍の2章以降で解説するスライドショーのサンプルプログラムも1章で登場するため公開されています。次のようにボタンを押すと次の画像に行くというだけの、簡単なサンプルプログラムです。 {::nomarkdown} {:/nomarkdown} 技評のWebサイトからも実際に試すことができます。 JavaScriptのソースはこんなかんじです。全体で90行程度、コメントや空行を除くと40行程度です。 /** * 簡易スライドショー * * nextボタンを押したときに画像を切り替える簡単な *
history.pushStateでページ遷移するjQueryプラグイン書いた - Webtech Walker
history.pushStateでのページ遷移をやりやすくするためにjQueryのプラグインとしてjquery.smarthistory.jsというのを書いてみました。 jquery.smarthistory.js history.pushStateをサポートしてるブラウザではhistory.pushStateを使って、サポートしてないブラウザでは何もしません（普通に遷移する）。今だとchrome、safari、iOS、Firefox4で動くと思います。 こんな感じで使います。 $('a').smarthistory({ defaultData: $('html').html(), target: function() { return $(this).attr('href') }, before: function() { // ajax前の処理 }, change: function
補足：githubのアレ(history.replaceStateとかhistory.pushStateの話) - Webtech Walker
以下の記事にgithubのhistory.replaceStateについて書かれてるのですが、一点補足しておきます。 githubのアレ(history.replaceStateとかhistory.pushStateの話) - 愛と勇気と缶ビール 補足の前に。 さらに、この記事を読んだ時「ChromeやSafariやFirefox4でパンくずリストやプロジェクトに含まれるファイル名をクリックするとズビビッとスライドしてDOMが置き換わるアレがreplaceStateを使っているのだろう」と思っていたけどそれも違った。replaceStateが使われているのは別の場所。 たしかにDOMの更新につかってるのはreplaceStateじゃなくてpushStateのほうなので僕の以前のエントリーが間違ってますね。すいません。 本題の補足は以下。 pushStateでhistoryにリンクのURLを
githubがhistory.replaceState使ってた - Webtech Walker
JavaScriptでhistory.pushStateとhistory.replaceStateっていう履歴管理のための仕様があるんですけど、これを使うとlocation.hashを使って実装しているような、ページ遷移をしないでコンテンツを入れ替える（Twitterの新UIみたいな）ものを実現できます。 5.4 Session history and navigation — HTML5 Manipulating the browser history - MDC Doc Center で、これを実際使ってるところは見たことなかったんですけど、githubがいつの間にか使ってました。適当なリポジトリに入ってhistory.replaceStateをサポートしてるブラウザ（現時点ではchromeかsafari）で見るとページ遷移なしで動いて、切り替わるときにURLが書き換わってるのがわかる
Python初心者によるPythonのいいところ、はまりどころのまとめ - Webtech Walker
Python勉強し始めて一ヶ月くらいたったんで一度復習を兼ねてまとめてみようと思います。僕が今までPHPとかPerlとかJavaScriptを使っていて、Pythonはこうやるのかーとか、これは便利だなーと思ったところ、開発していてはまったところなどピックアップしてみました。 初めてのPythonを読んで初心者向け勉強会に参加した程度の知識です。とりあえず初めてのPythonがかなりいいのでこれ読むだけで大体基礎は習得できた気がします。基本的な文法の説明だけでなく、大事なことは何回も繰り返し書いてあったり、Pythonの思想などにも触れているのでなぜこういう実装になっているかということも理解できます。これオススメ。 尚、このエントリーではPythonのバージョンは2.5をベースにしてます（主にGoogleAppEngineで使ってるので）。間違えなどあったらツッコミお待ちしてます。 文法、
vimからsassをコンパイルする - Webtech Walker
sassは全然使ったことないんですけどkotarok先生の啓蒙活動で最近ブームがきてるみたいです。僕はまったく使ったことなかったんですけど、vimからコンパイルするのを書いてみました。 function! Sass_convert() let scss = expand('%:p') let css = substitute(scss, 'scss$', 'css', '') let cmd = printf('sass %s %s', scss, css) let res = system(cmd) if res != '' echo res endif endfunction au! BufWritePost *.scss call Sass_convert() 保存するときに自動でコンパイルします。同期実行の重さが気になるならvimprocにしたほうがいいのかも。もしくはパースエラー
はてブのWeb HookでDeliciousと同期する - Webtech Walker
というのを今更ながらやろうとしてHookHubにそれくらいあるだろうと思って久しぶりにみたら、まさかのまじぽかさんだったので自分で書いた。 # hatebu_hook_post_delicious.psgi # はてブのwebhookでdeliciousにPOSTして同期する use strict; use warnings; use Plack::Request; use Config::Pit; use Net::Delicious; my $conf = pit_get('hatena_hook', require => { key => '', delicious_user => '', delicious_password => '', }); my $app = sub { my $env = shift; my $req = Plack::Request->new($env)
CSSセレクタの高速化の話し - Webtech Walker
続・ハイパフォーマンスWebサイトを読んでCSSセレクタの高速化の話しが面白かった（というか全然知らなくてちょっとびびった）ので紹介します。 セレクタは右から左に解釈される これは正直知らなくて、結構衝撃でした。 #foo .bar {} これはなんとなく#fooを探して、その中の.barを探している気がしてたんですけど、実は.barを探して、その親要素に#fooがあるかを探すそうです。なので特に#fooが必要なければ .bar {} と書いたほうが高速だということ。 また、以下の様に要素名で指定すると、その要素を全て探します。 #foo a {} これは一度a要素を全て探すので、できればaにclassをふって #foo .anchor {} とするほうが高速のようです。（#fooをとるとより高速） 特にユニバーサルセレクタなどは、 #foo * {} とすると、全ての要素の親要素に対して
vimでコマンドの出力をキャプチャする - Webtech Walker
vimで:mapとかしたとき、その出力を検索したかったんですけど、やりかたがわからなかったのでtwitterで聞いたら解決方法を教えていただきました。ありがとうございました。 https://twitter.com/kana1/status/12874074721 :redirで出力をリダイレクトできるんですね。知らんかった。詳しくは:help redirしてもらうとわかると思うんですが、以下の様な感じでキャプチャを取れます。 :redir > file :silent map :redir END 他にも変数とかレジスタにもリダイレクトできます。でもまあこれだといろいろとめんどいので一発でキャプチャとれるような設定書こうと思ってたら以下の設定を教えてもらいました。 Shougo's gist: 369112 — Gist これで :Capture map でキャプチャとれるようになりまし
ターミナルからMacVimでファイルを開く - Webtech Walker
ずっとやりたいと思って放置してたのを勉強会で教えてもらってできるようになった。 教えてもらったのはこれ。 MacVim起動コマンド完成版 - namutakaの日記 僕の環境にはなぜかmvimというコマンドが入ってなくて、MacVimのソースの中に入ってるからそこからとってきて使おうと思ったけどソースみてみたらインストールされてるMacVim探してコマンド実行してるだけなんでエイリアスだけで済ませた。 alias macvim="/Applications/MacVim.app/Contents/MacOS/Vim -g --remote-tab-silent" 特にエラーもでないし引数指定しないというのは特に想定しなくてもいいので僕の場合はこれで事足りる。
macportsのscreenを諦めてGNU screenをコンパイルした - Webtech Walker
macportsのscreenからmvimコマンドでMacVimを開こうとすると固まってしまうのがscreenのせいじゃないかということで、macportsのscreenを諦めてGNU screenをコンパイルしてみました。 $ git clone git://git.sv.gnu.org/screen.git $ cd screen/src $ ./autogen.sh $ ./configure --enable-colors256 --disable-telnet --prefix=$HOME/local $ make $ make install pbcopyもまともにうごくようになってハッピーです :)
git-svnでリモートブランチをmergeするときは–no-ffをつけるべし - Webtech Walker
git-svnでリモートブランチをきって作業しててtrunkにmergeしようと思ったら、mergeした先のローカルブランチの向き先がリモートブランチになる現象ではまった。またしてもtypester++であります。インクリメントされすぎてそろそろ2147483647超えるんじゃないと心配です。 # 今masterブランチにいる $ git branch * master # リモートブランチはtrunkを見てる $ git svn info URL: http://path/to/trunk ... # リモートブランチtopicを作成してローカルブランチtopic_localにコピー $ git svn branch topic $ git checkout -b topic_local topic # ローカルブランチはtopic_local $ git branch master *
vimのsyntax/perl.vimをちょっと直す - Webtech Walker
追記: mattnさんに教えてもらったsyntax使えばよさげです！ → perl-mauke.vim - improved perl syntax highlighting : vim online 前々からperlのsyntaxがおかしいところがあるのには気付いてたけど、見て見ぬふりをしていたのを直した。 m!hoge$!とかqq[hoge'fuga]とかがあるとその後のsyntaxがおかしくなってた。 こんな感じでおかしくなってたのを直した。diffはこんな感じ。 Commit 2df207ed667cb632aba394e28c9e5f9f2793ceaa to hokaccha’s dotfiles - GitHub $VIMRUNTIME/syntax/perl.vimからうまく差分だけ上書きする方法がわからんかったのでとりあえず~/.vimrc/syntax/perl.vim
irssiをインストールしてからやったことのまとめ - Webtech Walker
IRCのクライアントをLimeChatからirssiに乗り換えたのでやったことをまとめときます。最初はtiarraも導入しようと思ったんですけどSSLの設定がわからなくてできなかったので断念しました。 インストールと起動 インストールはyumで一撃でした（CentOS 5.4） $ yum install irssi 起動は $ irssi でOK。起動すると~/.irssi/configという設定ファイルができます。 サーバーとかチャンネルの追加 サーバーの追加は /server add -auto -network freenode irc.freenode.net 6667 でチャンネルの追加は /channel add -auto #チャンネル名 freenode こんな感じ。チャンネルに入るときはサーバーにconnectしてjoinします。 /connect freenode /
im.kayac.comでiPhoneにtwitterのリプライを通知する - Webtech Walker
im.kayac.comというカヤックのサービスがあるんですが、これを使うとIMとかにHTTPとかメール経由で通知することができて、iPhoneにも対応したのでtwitterでリプライがあったら通知するスクリプト書いてみました。 #!/usr/bin/env perl use strict; use warnings; use AnyEvent::Twitter::Stream; use AnyEvent::HTTP; use HTTP::Request::Common; my $done = AnyEvent->condvar; my $streamer = AnyEvent::Twitter::Stream->new( username => 'twitter_username', password => 'twitter_password', method => 'filter',
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Chromeの等幅フォントがOsakaになってる件 - Webtech Walker
gitで過去のリビジョンとか別のbranchのファイルを見る - Webtech Walker