Archiva

A note of notions. On web, tech, and others.



Web屋のためのHow to Vim (チラ裏)

Vim Advent Calendar 2011 43日目の記事です。というかもう2012年ですね! あけましておめでとうございます。この度は前回の続き。本当は翌日にでも書くつもりだったけど伸ばしに伸びたWeb屋のためのVim特集をお送りします。初めに言っときますが、3部作です。つまりこの記事は2/3。どうしてこうなった。

Web屋のための Vim-Starter-kit

Demo: Vim Starter-Kit from sigwyg on Vimeo.

はい、けっきょく作ってしまったんですよ。初心者導入キット。黒い画面恐怖症の方々のためにGit依存しないように作ったらNeoBundleでもVundleでもなくPathogen管理となり、Uniteの代わりにNERDTreeとなりました。できればUnite.vim使って欲しい。でもまずVimそのものに慣れてからのほうが良いと思うんだよね。

ファイル構成は以下のようになってます。

»続きがあります

Web屋のためのHow to Vim (表)

Vim Advent Calendar 2011 19日目。
迫り来るX'dayに有形無形の圧力を感じつつ、それでも健気に生きる紳士淑女へ捧ぐ。全ての独身貴族の味方@sigwygです。飲みに行こうぜ!

さて、今回はWeb屋に向けて「Vim使おうぜ!」て記事を書こうかと思ってました。こないだのSugamoで「どんな記事がいいkana?」と訊いてみたところ、以下3点の意見が挙がりました。

  • 初心者導入キット(汎用.vimrc)
  • 定番プラグイン
  • ファイルの開き方がそもそも判りづらい><

うん、つまらん! 初心者向け講座ってのは以前てきとーだけどやったことがあって、もっとマシに纏めればはてブ稼げるだろうってのも解ってますよ。しかし同じブログで似たような記事を連投するのも微妙なので止めときます。きっとえどさんがやってくれると信じてる。

定番プラグインってのはアレだね。良くあるネタです。
今回のVim Advent Calendarでも@__papix__さんとかが纏めてくださってますが、個人的には...

»続きがあります

LESS初心者向けのナニカ

こんにちは『Less & Sass Advent calendar 2011』4日目。Sig.@sigwygがお送りします。「ハードル下げるよ」と言っていたtacamyが文量ある良記事を上げており、高まるハードルに恐々としている今日この頃。皆さん如何お過ごしでしょうか。まあ僕はマイペースで行きます。久しぶりのBlog記事ですしね!(言い訳)

さて、小狡く予防線を張ったところでLESS紹介です。LESSはCSSに変数やら関数やらネストやらを実装します。Sassと同じようなCSS拡張とかメタ言語とか言われるモノです。この辺りの解説はdebiruくんの記事が詳しいので割愛。

要するにhoge.lessとかファイル作って、変数とか織り交ぜて書いておくと...

// ベンダープレフィックスとか書いておく
.rounded-corners (@radius: 5px) {
    -webkit-border-radius: @radius;
       -moz-border-radius: @radius;
            border-radius: @radius;
}

// 呼び出すと1行で終了
#header {
    .rounded-corners;
}

// 値も適宜に変更可能
#footer {
    .rounded-corners(10px);
}

このファイルを解析して、以下のようなCSSファイルに変換(コンパイル)してくれます。

#header {
    -webkit-border-radius: 5px;
       -moz-border-radius: 5px;
            border-radius: 5px;
    }
#footer {
    -webkit-border-radius: 10px;
       -moz-border-radius: 10px;
            border-radius: 10px;
}

変数を示す記号に@が使われている辺り、@mediaとか@importみたいな@ルールみたいで紛らわしいなとか多少は思ったりしますが、LESSファイルの記述(「LESS記法」って言って良いのかな?)そのものは慣れ親しんだCSSとほとんど同じですし、変数とか関数とかインクルードとか簡単な計算機能とか使ってすっきりと書くことができる。なんだったら、そのまま普通にCSS書いてても良いし。

»続きがあります

サーバー移転しました

お金を振り込み忘れてやんごとなき事情により、長らく利用していたXREAを締め出されたため、サーバー移転しました。直近のバックアップは3記事前だったため、幾つかの記事と画像は失われましたが、概ね回収できたかと思います。コメントは消えてしまいましたが... どっか不具合があったら、教えて頂けると助かります。ではでは。

Vim: 複数ファイル検索/置換をもうちょい詳しく

こんちわSig.です。今回は第29回Sugamo.cssで発表したネタ。スライド出せば良いや−、と思っていたのだけど@soh335がピュアな視線で訴えてくるので、重い腰を上げてBlog記事にしてみることにしました。

さて、Vimにおいて多数のファイルを対象に検索→置換する場合、だいたい2つの方法があります。

  • :argdo %s/FooBar/BarBaz/gce | update
  • :bufdo %s/warnings/warningssss/gce | update

順に、引数リストを使う方法、バッファリストを使う方法です。:bufdoの類似で:tabdoとか:windoとかもありますが、まあ使うとすればこの辺でしょう。これらに関しては、過去の記事でも書きました。複数ファイル置換の定番というか王道というか、普通は:argdo使いますよね。ただ、この方法には個人的に以下の問題点があります。

»続きがあります



Back to page-top