Junk code in March 2015

Blog

今年は、GitHub の Contributions Calendar に、緑色のタイルをたくさん並べるのが目標です。3月は、今まで触れたことのない分野を勉強できたから、この記事ではメモがてら作ったものを紹介していきます。

contributions

memol

Polymer という Google が作っている Web Components のフレームワークで付箋メモアプリを作った。

memol

Memol-iOS

久しぶりに、iOS アプリ開発をしようと思い、どうせならと Swift を触ることにした。練習としてマークダウンが書けるエディタアプリを作ることにした。とりあえず動くものは作れた。Objective-C で書くのと比べて、簡潔に書ける印象だった。ただ、Swift の言語仕様については、全然理解していないから、仕事で使うならがっつり勉強する必要があると思った。

まだ実装していない機能:

undercoat

仕事でサイトを作る時に、だいたい似たようなグリッドとか、汎用コンポーネントを使いまわしているから、Boilerplate 的なものを作ってみた。機能としては、以下のような感じです:

今までは、サイトを作るたびに、過去に自分が書いたコードからコピペしていたのだけれど、一点にまとまったから、とても(コピペが)楽である。

jquery-responsive-image

画面幅に応じて画像を出し分けるのを簡単にする jQuery プラグインを書いた。似たようなプラグインがどこかに転がっていると思うけれど、探せる範囲では使い勝手の良いものがなかった。カスタムデータ属性 data-* に、端末ごとに異なる画像パスを指定して使える。

<img src="images/mobile.png"
     data-mobile="images/mobile.png"
     data-phablet="images/phablet.png"
     data-tablet="images/tablet.png"
     data-desktop="images/desktop.png"/>

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="../jquery.responsive-image.js"></script>
<script type="text/javascript">
  $("body").responsiveImage({
    mobile : 400,
    phablet: 550,
    tablet : 750,
    desktop: 1000,
  });
</script>