ページ

2012/08/26

[書評]リーダブルコード The Art of Readable Code

リーダブルコード ―より良いコードを書くためのシンプルで実践的なテクニック
Dustin Boswell
オライリージャパン
発売日:2012-06-23
ブクログでレビューを見る»
コードは理解しやすくなければならないという考えのもと、
理解するための時間を最短にするための実践的なテクニック集を解説している本。
アーキテクチャとかデザインパターンとかではなく、
もっと基本的なことについて書かれているので
この本の内容を当たり前だと思えるようなプログラマーになろう!

目次と訳者の解説が公開されているので気になったら読んでほしい。
O'Reilly Japan - リーダブルコード http://www.oreilly.co.jp/books/9784873115658/
リーダブルコードの解説 http://www.clear-code.com/blog/2012/6/11.html
個々の内容について書いたらリーダブルコードの内容をリライトしてしまうのでそれ以外について書く。
この本の原典は以下の書籍だろうか。
あわせて読みたいで高品質なコードを書くための書籍として紹介されていた書籍だ。
Code Complete第2版〈上〉―完全なプログラミングを目指して
Code Complete第2版〈下〉―完全なプログラミングを目指して
リファクタリング―プログラムの体質改善テクニック
プログラミング作法
達人プログラマー―システム開発の職人から名匠への道
Clean Code アジャイルソフトウェア達人の技
これらをいくつか読んでいる人にはおそらく必要のない本だろう。
どれも名著と呼ばれ、内容的にも値段的にも重量級の書籍ばかりだ。
プログラミングに関して意欲と費やせるお金と時間があるのならば原典を読んだほうがいいと思う。
それらを持ち合わせていない人や手っ取り早くテクニックを知りたい人には最適の本だ。
あとは他人のケツを拭きたくない人は教育用に読ませればいい。230ページ程度だからすぐに読める。
読み終わったら(本の内容に理解してくれたら)すぐにコードはマシなものになるだろう。

リファクタリングやTDDが一人前のプログラマーならできて当たり前みたいな雰囲気が最近あるけど
リーダブルコードを書くことも当たり前な雰囲気ができて欲しいですね。当たり前すぎて言われてないだけかな?

追記: 良い名前をつけるためのWebサイト

リーダブルコードでは良い名前をつけろと言われるが日本人に英語の細かいニュアンスの違いを把握して
命名するのはなかなか大変だと思うので類義語・対義語を調べるには以下のサイトがいいと思う。
Thesaurus.com | Find Synonyms and Antonyms of Words at Thesaurus.com
フォームから検索すれば定義や類義語・対義語がわかる。Synonymsが類義語で、Antonymsが対義語だ。
適切な意味の単語を選ぶことに時間をかけるプログラマーはブックマーク必須だ!

リーダブルコード ―より良いコードを書くためのシンプルで実践的なテクニック (Theory in practice)
リーダブルコード ―より良いコードを書くためのシンプルで実践的なテクニック (Theory in practice)

HTML5で追加されたinput要素のtype属性の属性値dateを使ってみた

日付をフォームに入力させてJavaScriptでゴニョゴニョすることがあったのだけど
JavaScriptでnew Date()に渡すことのできる日付のフォーマットが
ブラウザごとに異なっていたのでサンプルページ作って試してみたら全部普通に動いた。

YYYY/MM/DD hh:mm:ss形式でDate生成できたのはChromeだけで
FirefoxはYYYY/MM/DD形式、IEはYYYY-MM-DD形式だった。ここまでは許せる。
Safariはアメリカ方式でMM/DD/YYYY形式じゃないとダメだったから
ガガッとサンプル作ったのに…。どういうことなの…。
参考:JavaScript new Date() Returning NaN in IE or Invalid Date in Safari | BIOSTALL

違いといえばその現象が起きたのでXHTMLで、サンプルはHTML5で作ったってことくらい。関係無さそう。謎。

ってことでブラウザ毎の差異は忘れて入力用に作ったフォームで使った<input type="date" (...) />について書く。
W3C:4.10.7.1 States of the type attribute — HTML5
WHATWG:4.10.7.1 States of the type attribute — HTML Standard
<input type="date">-HTML5タグリファレンス
仕様をちゃんと見なきゃと思うけどもなかなかきついのでHTML5リファレンスにお世話になる。

見てるとHTML5から追加されたアレコレが魅力的すぎて早く全部のブラウザで使えるようになって、
サイト制作に使えるようになってほしい。
type="date"は現在ChromeとOperaでしか使えないけど
他のブラウザではおそらくtype="text"を指定したとみなされて?普通のテキストフォームになるので
プログレッシブ・エンハンスメントとして使っちゃうこともできる。

少しショボイ方がOperaで、リッチな方がChrome。
年、月を変えるボタンとドロップダウンになってる年月表示。
自動で入るプレースホルダー(薄い字のヒント)もある。
いい加減コードとサンプルサイト晒します。HTML5 input date sample page
<section class="row center">
  <table class="center" role="presentation">
   <tr>
    <td><label for="begin">開始日</label></td>
    <td><input type="date" id="begin" name="begin" value="" /></td>
   </tr>
   <tr>
    <td><label for="end">終了日</label></td>
    <td><input type="date" id="end" name="end" value="" /></td>
   </tr>
   <tr>
    <td colspan="2">
     <input type="button" class="btn btn-primary" value="jQueryで計算" onclick="getPeriod_jQuery()" />
     <input type="button" class="btn btn-primary" value="JavaScriptで計算" onclick="getPeriod_JavaScript()" />
    </td>
   </tr>
   <tr>
    <td><label for="period">期間(日)</label></td>
    <td><input type="text" id="period" name="period" value="" /></td>
   </tr>
  </table>
  <script><!--
   function getPeriod_jQuery(){
    var begin = $('#begin').val();
    var end = $('#end').val();
    var beginDate = new Date(begin);
    var endDate = new Date(end);
    var period = ( endDate.getTime() - beginDate.getTime() ) / ( 1000 * 60 * 60 * 24 );
    $('#period').val(period);
   }
   function getPeriod_JavaScript(){
    var begin = document.getElementById('begin').value;
    var end = document.getElementById('end').value;
    var beginDate = new Date(begin);
    var endDate = new Date(end);
    var period = ( endDate.getTime() - beginDate.getTime() ) / ( 1000 * 60 * 60 * 24 );
    document.getElementById('period').value = period;
   }
  --></script>
 </section>
適当に日付を入力させて期間をJavaScriptで計算して出すだけの簡単なもの。
このときのnew Dateがブラウザ毎に受け取れる値が異なるから作ったのに普通にYYYY/MM/DDで全部できた。
動きが見たい人はサンプルページへどうぞ

tableタグのrole="presentation"という見慣れない文字列について

tableタグは表以外に(レイアウト目的で)使ってはいけないと思われているが別に禁止されていない(らしい)。
本当はCSSでレイアウトを調整することが推奨されているのだけど面倒なのでtableタグで実装した。
普通に組んだんじゃ良くないのでWAI-ARIAのrole="presentation"つけた。アクセシビリティ的にも良いらしい。
WAI-ARIA(ウェイ・アリア:Web Accessibility Initiative-Accessible Rich Internet Applications)って
流行らなそうだけど必要な人にはとことん必要なものなので知っておきたいですね。
4.9 Tabular data — HTML Standard
The Roles Model | Accessible Rich Internet Applications (WAI-ARIA) 1.0
HTML5のtable要素が表なのかレイアウト目的なのかを示す属性やら要素について調べてみた。
role="presentation"の役割は凄い。【WAI-ARIA】 - E-riverstyle Vanguard
レイアウトテーブルの使用は禁止されていない。 - E-riverstyle Vanguard
WAI-ARIA(日本語訳):日立のユニバーサルデザイン
HTML5 + WAI-ARIA: 入門篇 – terkel.jp
アクセシビリティを加速するWAI-ARIA

jQuery版とJavaScript版の日付差分取得

jQueryはいいね。ジョンの生み出した文化の極みだよ。
document.getElementByIdなんて長い文を書かなくていいんだ。
あとはJavaScript標準のDateオブジェクトを生成してgetTime()でUNIXTIMEからの経過時間をミリ秒を取得して
差分を日単位になるまで割ればオッケー☆フォームに代入しちゃおう♡

フォームにidを指定しなくてもいいんだ。そう、jQueryならね。

function getPeriod(){
 var begin = $('input[name="begin"]').val();
 var end = $('input[name="end"]').val();
 var beginDate = new Date(begin);
 var endDate = new Date(end);
 var period = ( endDate.getTime() - beginDate.getTime() ) / ( 1000 * 60 * 60 * 24 );
 $('input[name="period"]').val(period);
}
$('input[name="begin"]')はinput要素のname属性がbeginな要素を指定している。
だいたい同じ値をidとnameに指定していて、重複した感じが嫌だったのでこれは嬉しいね。

長々書いたけどサンプルページは試してみてくれたかな?大したものじゃないけどまだの人はぜひ!
HTML5 input date sample page

2012/08/25

クロスブラウザ対応!jQueryのアニメーションスクロール

追記: 2013/03/24

jQuery.browser が jQuery v1.9 で廃止されたので対応版の記事を書きました。
jQuery1.9以上対応版クロスブラウザ対応アニメーションスクロール | DevAchieve

元の本文はココから

OSBrowserVersion
WindowsInternet Explorer9
WindowsGoogle Chrome22
WindowsMozilla Firefox14
WindowsOpera12
MacSafari6
MacGoogle Chrome21
MacMozilla Firefox14
スムーズなスクロールを行うには
jQueryを使うのが一番楽でしょう。
地味にブラウザ毎に動きが異なったので
実際に右のブラウザでテストしてみました。
jQuery アニメーションスクロールサンプルページへ
function animatedScroll(selector, speed, animation, complete) {
    $($.browser.msie || $.browser.mozilla || $.browser.opera ? 'html' : 'body')
        .animate(
            {scrollTop: $(selector).offset().top},
            speed,
            animation,
            complete
        );
}
スクロールはブラウザ毎に少し異なっていて$.browserで判別している。
jQuery 1.3で廃止予定でプラグインでサポートされるようになるかもとか書かれているので
$.browserについての情報収集は欠かさないようにしといたほうがいいかもしれない。
IE, Firefox, Operaはhtmlでスクロールするが、Chrome, Safariはbodyでスクロールする。
変数渡せる値デフォルト値
(nullを渡した時)
説明
selectorjQueryの要素取得の記法なし(動かない)関数内で要素の取得を行なっている。
speedslow | fast | 任意の数値 | null400msslow: 600ms, fast: 200ms
animationlinear | swing | nulllinearlinearは等速、swingは加速して減速する。
complete(function) | nullなし(何も行わない)スクロール完了のコールバック関数。
<input type="button" class="btn btn-primary" value="Slow Linear Scroll" onclick="animatedScroll('#invite', 'slow', 'linear', onScrolled)" />
<input type="button" class="btn btn-info" value="Fast Linear Scroll" onclick="animatedScroll('#invite', 'fast', 'linear', onScrolled)" />
<input type="button" class="btn btn-success" value="3000ms Linear Scroll" onclick="animatedScroll('#invite', 3000, 'linear', onScrolled)" />
<input type="button" class="btn btn-warning" value="Slow Swing Scroll" onclick="animatedScroll('#invite', 'slow', 'swing', onScrolled)" />
<input type="button" class="btn btn-danger" value="Fast Swing Scroll" onclick="animatedScroll('#invite', 'fast', 'swing', onScrolled)" />
<input type="button" class="btn btn-inverse" value="3000ms Swing Scroll" onclick="animatedScroll('#invite', 3000, 'swing', onScrolled)" />
<script><!--
    var onScrolled = function onScrolled(){
        if(!confirm('お分かりいただけただろうか?')){
            animatedScroll('body', 'fast', 'swing', null);
        }
    };
    function animatedScroll(selector, speed, animation, complete) {
        $($.browser.msie || $.browser.mozilla || $.browser.opera ? 'html' : 'body').animate({scrollTop: $(selector).offset().top}, speed, animation, complete);
    }
--></script>
関連
jQuery.browser – jQuery API
.animate() – jQuery API
.offset() – jQuery API

2012/08/24

[書評]必ず結果が出るブログ運営テクニック100 プロ・ブロガーが教える“俺メディア”の極意

必ず結果が出るブログ運営テクニック100 プロ・ブロガーが教える“俺メディア”の極意
コグレマサト
インプレスジャパン
発売日:2012-03-23
ブクログでレビューを見る»
ブログで稼ぎたい人のためのテクニック集。
ネット上でよくブログ論、ブログテクニックの記事を読んでいたので目新しいことはなかった。

逆にそういうのを読んでいない人は本書を読んでおくと良い。
ブロガーは二つのタイプに分けられる。
時間をかけ、濃い内容の記事を書くタイプと、一本の記事は軽く短く、それを量産するタイプ。
著者の二人は後者で、僕は前者のブロガー(のつもり)だ。
後者は記事を量産してPV稼いで広告などでマネタイズをはかる戦略で
この本でもそのためのテクニックなどが載っている。
僕自身はブログ自体をマネタイズというのは熱心にやってはいないが
ブログ論とかブログテクニックなどの記事は読んでいたのでそれほど目新しいことはなかった。
だが、ブログで稼ぎたい人などはネットでそういう記事を探しまわるよりはこの本を買うと手っ取り早いかと思う。

時は金なりですよ。記事を読んだって、やってみなきゃわからないことがあるんだから行動を起こさないとね。
たくさん記事書いてみて自分のブログスタイルを確立できたらでもいいかもしれないけどね。
肩肘張って稼ぐためとか考えると続かなそうだし、まずは適当に100記事くらい書けばいいんじゃないですかね。
100記事も書き続けられたら書くこと自体が苦にならないと思う。
むしろちょっとくらいお小遣い稼ぐようにしないともったいないと思うようになったら
この本買って色々やればいいんじゃないかな?

本より著者の二人のブログ([N]ネタフル和洋風KAI)の広告の貼り方のほうが参考になりそう。
月にチューハイ一本飲めるかぐらいしか稼げてない(しかも換金できてない…)から参考にしたい。
必ず結果が出るブログ運営テクニック100 プロ・ブロガーが教える“俺メディア”の極意
必ず結果が出るブログ運営テクニック100 プロ・ブロガーが教える“俺メディア”の極意

2012/08/20

[書評]日経ソフトウエア 2012年 03月号

日経ソフトウエア 2012年 03月号 [雑誌]
日経BP社
発売日:2012-01-24
ブクログでレビューを見る»
言語に共通するプログラミングの真実、Facebookアプリ開発、
Android4.0プログラミング入門、Xcode4.2使い方入門。
付録は「OS根本から理解する」という冊子。
日経ソフトウエア ダウンロード - 2012年:ITpro

言語に共通するプログラミングの真実

割とタイトルが大げさだけどプログラミング言語について普通に勉強になる。基礎知識として知っておきたい。

Android4.0の新機能を学ぶ FragmentとActionProviderを使って機能の部品化を進めよう

Android4.0からはメニューをActionProviderで表示させるのでサンプルとして良さそう。
AsyncTaskLoaderでアプリ名やアイコンを取得しているのでそれらも参考になる。
最後にアイコンとアプリ名をListFragmentで表示して終わり。Android4.0以上で作るときに参考にしたい。

Xcode4.2使い方入門

Interface Builderを使いこなすということで、わかりやすい説明がいっぱい。
この連載があれば超入門的な本が要らないかと思う。

おまけ

「インターン女子C#を学ぶ」で型について書かれていてボクシングが理解できた。
付録の「OS根本から理解する」は付録だけど意外とガッツリ書かれていたように思う。

日経 ソフトウエア 2012年 03月号 [雑誌]
日経 ソフトウエア 2012年 03月号 [雑誌]

2012/08/19

Twitter API v1.1 変更点まとめ

2012/08/17(金)にTwitter API v1.1についてTwitter開発ブログの記事などが公開されました。
Changes coming in Version 1.1 of the Twitter API | Twitter Developers
Twitterブログ: Twitter API v1.1でのAPI利用ルールの変更について
誤解した人が多かったのか悲観的な声をよく聞いたような気がします。
誤解のないようにまとめておきたいと思います。間違いのないように努めますが本家の情報も見ておいたほうがいいと思います。

大きな変更点は3つ

  1. 全てのAPIエンドポイントに認証が必要になる
  2. 新しいエンドポイント毎のレートリミット方式
  3. デベロッパールールの変更(特に従来のTwitterクライアントのアプリ周り)
※エンドポイント: 簡単に言えばAPIの種類…だと思います。

1.認証が必須に

今までTwitter APIにはSearch APIなど認証が必要でないものがありましたが
v1.1からは全APIエンドポイントが認証必須になります。
認証なしのAPIは誰にでも使えていましたが、
そのため非常に高いレートでAPIを叩くなどAPIの不正利用があったようです。
それを防止し、開発者のニーズを満たすよう進化するためには
どのようなAPIにアクセスしてるかを明確にすることが重要なため認証が必要だそうです。

既にOAuthを使用している開発者のために認証トークンはv1.1への移行でもシームレスに引き継がれます。
認証の必要のないAPIを使用している場合は2013年3月前までにOAuth認証するように更新が必要になります。

2.エンドポイント毎のレートリミット

TwitterのREST APIは現在APIの種類に関係なく350回/時でしたが、v1.1ではエンドポイント毎に60回/時になります。
数字上減ったように見えますが、APIエンドポイント(種類)毎のレートリミットになっているため
ツイートしすぎてふぁぼれないということなどがないので改良だと思います。
60回/時はTwitter APIの利用状況を分析して設定されたもので、ほとんどのアプリケーションのニースを超えるそうです。

また、ツイート表示、プロフィール表示、ユーザーの検索などの大量のエンドポイントを必要とするアプリケーションは
720回/時までのレートリミットが適用されるようです。
詳しくはv1.1のリリースで公開されるドキュメントに記載されるようです。

3.デベロッパールールの変更

  1. Display Guidelinesが表示の必要条件に
  2. プリインストールのクライアントアプリケーションはTwitterによる認定が必要に
  3. 大量のユーザートークンを必要とする場合は開発者は直接Twitterに連絡が必要に

3-1.Display Guidelinesを守る

ツイートについて同一のユーザー体験(@usernameをクリックしたらプロフィールが表示されるなど)が大切だということです。
まともな開発者ならユーザーが期待する動作を作ると思うので問題ないでしょう。

3-2.プリインストールのクライアントアプリケーションはTwitterによる認定が必要

モバイルデバイスやSIMカード、チップセットなどにプリインストールするの場合は、Twitterの承認が必要となります。

3-3.大量のユーザートークンを必要とする場合は開発者は直接Twitterに連絡が必要に

One of the key things we've learned over the past few years is that when developers begin to demand an increasingly high volume of API calls, we can guide them toward areas of value for users and their businesses.
ちょっと意味が良くかわからなかったんだけども連絡してくれたら良い感じにしてくれるのでしょうか。
ユーザートークン数が10万になったら許可が必要になるようです。
もう既に10万ユーザーに達している場合は現在のユーザートークン数の200%までの増加が認められています。
それに達した場合もTwitterに許可が必要になります。

詳しいことが書かれていないので連絡をとったら許可が貰えるのかなどはよくわかりません。
取らぬ狸の皮算用で騒いでも仕方ないので詳しい情報が出るまで静観しておくのが良さそうです。

Twitter API v1.1への移行期間

v1.1がリリースされると同時にv1.0の廃止がアナウンスされます。
リリース後6ヶ月は移行期間となります。
OAuth認証が必須になるので認証するようにアップデートし、
新しいレートリミットでのアプリケーションの挙動をテストするだけの比較的簡単な移行になるでしょう。

今日のTwitterのエコシステム

Twitter Ecosystem
今回のAPIの変更は左上、左下、右下の活動を推奨し、右上の特定のユースケースの制限をしようとするものです。

右上にはツイートキュレーションサービスやツイート発見サイトfavstar.fmなどがありますが、
制限の対象となるのは単に模倣や再現をした従来のツイッタークライアントのようです。
18ヶ月前にもアナウンスしているようですし、新しい価値を提供できないTwitterクライアントはもういらないということでしょう。

近く、v1.1に関する追加情報があるようですのでTwitter開発者ブログをチェックしておいた方が良さそうです。

おまけ

Twitter API ポケットリファレンス (POCKET REFERENCE)Twitter API ポケットリファレンス (POCKET REFERENCE)
今回のAPIのバージョンアップはそれほど影響のあるものではないので
Twitter API ポケットリファレンスはまだまだ使えそうです!
Twitter APIを叩くなら持っておきたいですね。

2012/08/12

[書評]日経ソフトウエア 2012年 02月号

日経ソフトウエア 2012年 02月号 [雑誌]
日経BP社
発売日:2011-12-24
ブクログでレビューを見る»
iOS & Android 同時アプリ開発入門、Androidアプリ設定法、Xcode4.2使い方入門など。
付録はゲームプログラミング入門的な冊子。
日経ソフトウエア ダウンロード - 2012年:ITpro

iOS & Android 同時アプリ開発入門

ゲームとかでC/C++で共通化とか他のSDK使ったり、ちょっとしたアプリにHTML5やTitanium MobileでJavascriptとか。
重い処理をC/C++に投げるんじゃなければネイティブが良いと思っているのでやらないだろうけど概要が知れて良かった。

Androidアプリ設計法

TODOリストを作るという設定で色々解説してくれる。
ListViewの再利用のためのViewHolderのサンプルとかあって良い感じ。
Androidでやってる時はなんか難しそうな気がしてたけど
iPhoneでUITableViewを使って再利用が理解できたのでAndroidでもできる気がする。
データベースとかも扱ってるし、似たようなことをやる時はサンプルコードを参考にしたい。

Xcode4.2使い方入門

エディタ周りの使い方やコードスニペット登録や使い方、Class Referenceの見方、リファクタリングのための機能解説など。
すごく参考になる!やはりキーボードショートカットがないのは惜しい。キー操作で息をするようにXcodeを使いこなしたい。
連載まとめてキーボードショートカットつけたら電子書籍で売れるんじゃないかなーてか買う。出して!

サンプル作成で学ぶAndroidプログラミング ライブ壁紙

ライブ壁紙アプリの開発方法の解説。
設定に表示させるAndroidManifest.xmlの書き方からライブ壁紙として画像を動かす方法など。
作るときにはサンプルコードが参考になりそう。

おまけ

インターン女子C#を学ぶという一時話題になっていた漫画が始まるのがこの号から。
付録はゲームプログラミングを始めようという薄い冊子。ゲーム作るのは大変そうだからあんまり読んでない。

日経ソフトウエアを読んでるとAndroidやりたくなってくる。時間取ってやりたい。
日経 ソフトウエア 2012年 02月号 [雑誌]

2012/08/09

[書評]日経ソフトウエア 2012年 01月号

日経ソフトウエア 2012年 01月号 [雑誌]
日経BP社
発売日:2011-11-24
ブクログでレビューを見る»
Android4.0の注目機能の解説、Java7とJava8の新機能の解説、
Androidアプリ設計法、Windows 8のMetroスタイルアプリ、Xcode4使い方入門など。
付録はWindows 7のガイドブック。

凄い今更感あるけど今年から日経ソフトウエアを購読することにしたので
チマチマ読んで記事書いとくことにした。まずは1月号から。

日経ソフトウエア ダウンロード - 2012年:ITpro

@vvakameさんのAndroidAndroid4.0特別レポート

Fragmentについて。Android4.0でPhoneとTabletの両対応が楽になってるらしい。そのうち本気出して対応する。
Android Beamについて。NFC(近距離無線通信)による端末間のやり取りを簡素化したものらしい。
NFCはAndroid2.3からあるからAndroid2.3 Only Hacksを読むといいよ!ってステマが見えた。
ソフトウエアキーについて。ハードウエアキーが廃止された。ソフトウエアキーの入った部分をシステムバーという。
メニューキーは廃止され、アクションバーという画面上部のところに吸収された。メニューがあったら表示される。
他にも色々書いてあった。個人的にカレンダーAPI使って何か作りたいから気になってる。

Java新時代へ Java7, 8の新機能

Java7はswicth文の条件にString型が使用可能になっていたり、
複数例外のマルチキャッチやクローズ処理の自動実行など便利そうな進化をするらしい。
ファイルのコピーや移動なども簡単になるみたい。
Java8はクロージャが目玉かも?マルチコアで並列処理するのにクロージャを利用するのだとか。

Androidアプリ設計法

Galleryの使い方と画像の扱いが参考になりそうだった。結構コード載ってて良い感じ。

Windows 8 と Visual Studio 11 Metroアプリ開発

商標獲得で初歩的なミス? マイクロソフト、Windows 8から「Metro」の名称を排除へ|Microsoftウォッチ|トピックス|Computerworld
こんなことがあってもはやMetroじゃなくなるらしいけども。
簡単にWindows 8の使い方を説明したあと、Visual Studio 11でMetroアプリを開発の流れ。
HTML +Javascriptで作れるということで、僕がJavascriptを学びたい理由の一つである。

Xcode 4.2の使い方入門

結構詳しく書いてあって参考になる。できればキーボードショートカットも欲しかったけど以下があるので大丈夫だった。
好評のXcodeチートシート、MacBook Air 11サイズを作成しました | DOTAPON Blog

付録: Windows 7ガイドブック

う~ん、って感じの設定があってどうも。対象読者のレベルが高いのか低いのかよくわからない。
付録レベルだし期待するほどのものでもないような気がする。

新しさを軸に話題を知るというのもいいな。雑多な感じの記事も書きやすい。
日経 ソフトウエア 2012年 01月号 [雑誌]
日経 ソフトウエア 2012年 01月号 [雑誌]

2012/08/07

[競技プログラミング][PHP][天下一プログラマーコンテスト2012]分類たん

B - 分類たん

時間制限 : 2sec / スタック制限 : 10MB / メモリ制限 : 64MB

問題文

分類たんは、スペースをカンマ区切りにするのが大好き。
でも、スペースが続いたときは、カンマ 1 つで書きたい。

文字列が与えられるので、与えられた文字列のスペースをカンマ区切りにした文字列を出力してください。

入力

入力は以下の形式で標準入力から与えられる。
c1c2…cN
入力として文字列が 1 行で与えられる。
入力の文字列長 N は、 1≤N≤2000 を満たす。
i 文字目の文字 ci は大文字のアルファベット (A, …, Z) 、カンマ (,) 、スペース( ) のいずれかである。
文字列の最初の文字 c1 と最後の文字 cN はスペースではない。

出力

入力として与えられた文字列のスペースをカンマ区切りにした文字列を標準出力に 1 行で出力せよ。
ただし、複数の連続したスペースは 1 つのカンマにする。
なお、行の終端には改行が必要である。

出典

B: 分類たん - 天下一プログラマーコンテスト2012 予選A | AtCoder

回答

AtCoder/tenka1_2012_A_2.php at master · wada811/AtCoder · GitHub
<?php
$str = rtrim(fgets(STDIN));
do{
    $str = str_replace('  ', ' ', $str);
}while(strpos($str, '  '));
$str = str_replace(' ', ',', $str);
echo $str.PHP_EOL;
?>
ねずみ算より簡単だったので難易度設定に違和感。
スペース二つがなくなるまでスペース一つに圧縮して最後にカンマに置換するだけ。
strposは見つからないとFALSEを返すけど一文字目で0を返すから判定には注意。
今回は最初の文字にスペースが入らないと定義されているので安心して使える。

2012/08/06

[競技プログラミング][PHP][天下一プログラマーコンテスト2012]算盤の書

A - 算盤の書

時間制限 : 2sec / スタック制限 : 10MB / メモリ制限 : 64MB

問題文

ある数学者は次の問題を考案したという。

1 つがいの兎は、産まれて 2 か月後から毎月 1 つがいずつの兎を産む。
兎が死ぬことはない。
この条件のもとで、産まれたばかりの 1 つがいの兎は 1 年の間に何つがいの兎になるか?
※つがい:オスとメスの一組


この問題は上の問題をもとにした問題です。
今、 1 つがいの産まれたばかりの兎がいるとします。
上の問題の条件と同様に兎が増えるとすると、 n ヶ月後に何つがいの兎がいるでしょう?
このとき、 n ヶ月後ちょうどに産まれた兎のつがいも数に含めます。

入力

入力は以下の形式で標準入力から与えられる。
n
何ヶ月後かを表す整数 n (0≤n≤45) が 1 行で与えられる。

出力

n ヶ月後の兎のつがいの数を標準出力に 1 行で出力せよ。
なお、行の終端には改行が必要である。

出典

A: 算盤の書 - 天下一プログラマーコンテスト2012 予選A | AtCoder

回答

AtCoder/tenka1_2012_A_1.php at master · wada811/AtCoder · GitHub
<?php
fscanf(STDIN, "%d", $n);
$usage   = 1;
$usagee  = 0;
$usageee = 0;
for($i = 0; $i < $n; $i++){
    $usageee += $usagee;
    $usagee   = $usage;
    $usage    = $usageee;
}
$count = $usage + $usagee + $usageee;
echo $count.PHP_EOL;
?>
有名なねずみ算をウサギに置き換えた問題。
なんでウサギなんだろうと思っていたらTwitterで話題のUsagee Inc.が思い浮かんだので
変数名が自動的に決まりました。
リーダブルコードが似たものは縦を揃ええて似せて書くとか言っていたらしいので
そう書いたら美しくなった。持ってないから読みたいなぁ。

2012/08/05

[競技プログラミング][PHP][AtCoder]積み重ね

C - 積み重ね

時間制限 : 2sec / スタック制限 : 10MB / メモリ制限 : 64MB

問題文

高橋君はもう大人なので、親元を離れて一人暮らしをすることにしました。
トラックから引越し先の部屋へと荷物のダンボールを運びたいのですが、
部屋の床がダンボールで埋まってしまうと、今日高橋君が寝るための布団がひけません。
そこで、1 箱ずつ広げて置くのではなく、ある程度ダンボールを積み重ねた山を作ることにしました。
しかし、ダンボールには重さが決まっており、
下にあるダンボールよりも重いダンボールを上に積み重ねると下のダンボールが潰れてしまいます。

図(※略):下にあるダンボールは上にあるダンボール以上の重さでなければならない

トラックから運ぶ順にダンボールの重さが与えられるので、ダンボールを潰さないような積み重ね方を考えなさい。
そして、その積み重ねた山の個数が最小となる場合の山の個数を求めなさい。

入力

入力は以下の形式で標準入力から与えられる。
N
w1
w2
:
:
wN
入力は N+1 行ある。
1 行目には、ダンボールの個数を表す整数 N(1≦N≦50) が与えられる。
2 行目からの N 行には、i+1(1≦i≦N) 行目に i 番目に運ぶダンボールの重さを表す整数 wi(1≦wi≦100,000) が与えられる。

出力

ダンボールを順番に運び、上のダンボールが下のダンボールと同じ重さまたはそれよりも軽くなるように積み重ねたときに、
できるダンボールの山の数の最小値を標準出力に 1 行で出力せよ。
なお、最後には改行を出力せよ。

出典

C: 積み重ね - AtCoder Regular Contest #006 | AtCoder

回答

AtCoder/arc006_3.php at master · wada811/AtCoder · GitHub
<?php
fscanf(STDIN, "%d", $n);
for($i = 0; $i < $n; $i++){
    fscanf(STDIN, "%d", $inputs[]);
}
$Mt = array();
for($i = 0; $i < $n; $i++){
    $pos = 0;
    for($j = 0; $j < count($Mt); $j++){
        $pop = $Mt[$pos][count($Mt[$pos])-1];
        if($pop < $inputs[$i]){
            $pos = $j;
        }
    }
    if($Mt[$pos][count($Mt[$pos])-1] >= $inputs[$i]){
            $Mt[$pos][] = $inputs[$i];
    }else{
            $Mt[][] = $inputs[$i];
    }
}
echo count($Mt).PHP_EOL;
?>
山のてっぺんのダンボールの最大重量が入力より軽い場合は載せられないので$posを変える。
後ろの山の方は積めなかったダンボールを積んだ山なので
基本的に後ろの山が重くなっているのでできるだけ重いダンボールに重い荷物を載せる。
最後まで走査して載せられるかをチェックしたら載せ、載せられなかったら新たに山を作る。

動きを忘れていたけどIdeone.comでログ出力したら思い出した。

2012/08/04

[競技プログラミング][PHP][AtCoder]あみだくじ

B - あみだくじ

時間制限 : 2sec / スタック制限 : 10MB / メモリ制限 : 64MB

問題文

高橋君は学校で班のリーダーを決めなければいけなくなったので、あみだくじを用いて決めることにしました。
あみだくじとは、複数の縦線から 1 本を選び、その上端から下端へと辿っていき、
途中で横線があれば、その横線を通り繋がっている隣接する縦線へと移動し、また下へと進みます。
今日はたまたま手元に紙がなかったので、パソコン上で |、-、o を用いて以下のようなあみだくじを作りました。
| | | | | | | | |
|-| | |-| | |-| |
| | |-| | |-| | |
| |-| | | | | |-|
| | | |-| | | |-|
| | |-| |-| | | |
|-| | |-| | |-| |
| | | | | |-| | |
            o
o がある位置に到達した人がリーダーになります。
実は高橋君はリーダーになりたかったので、どの縦線を選べば o に辿り着くのか知りたいです。

左から何番目の縦線を選べばリーダーになれるのかを求めなさい。

入力

入力は以下の形式で標準入力から与えられる。
N L
|x|x|‥‥|
|x|x|‥‥|
|x|x|‥‥|
: : :  :
: : :  :
|  |  |‥‥|
y y y‥‥y
入力は L+2 行ある。
1 行目には、あみだくじの縦線の本数を表す整数 N(1≦N≦10) と
あみたくじの長さを表す整数 L(1≦L≦20)が与えられる。
2 行目からの L 行には、あみたくじの形が与えられる。
i 行目 (2≦i≦L+1) には 2N−1 文字の記号が与えられる。
各行の j 番目の記号は、以下のようになっている。
j が奇数の時:|
j が偶数の時(上記のxの位置):- または (空白)
| はあみだくじの縦線を表し、-はその両端の縦線を繋ぐ横線であることを表す。
また、空白はその位置に横線が無いことを表す。
| を 1 つ挟んで左右に隣り合ったxの位置の両方が - という入力は存在しない。
L+2 行目には 2N−1 文字の記号が与えられる。
各行の j 番目の記号は、以下のようになっている。
j が奇数の時(上記のyの位置):o または (空白)
j が偶数の時: (空白)
o は L+2 行目にただ 1 つのみ与えられる。

出力

あみだくじを辿って o に到達するために選ぶべき縦線は左から何番目か 1 行で出力せよ。
なお、最後には改行を出力せよ。

出典

B: あみだくじ - AtCoder Regular Contest #006 | AtCoder

回答

AtCoder/arc006_2.php at master · wada811/AtCoder · GitHub
<?php
fscanf(STDIN, "%d %d", $col, $row);
for($i = 0; $i < $row; $i++){
    for($j = 0; $j < 2 * $col - 1; $j++){
        $amida[$i][$j] = fgetc(STDIN);
    }
    fgetc(STDIN); // throw line feed code
}
$goal = fgets(STDIN);
$pos = strpos($goal, 'o');

for($i = $row - 1; $i >= 0; $i--){
    if($pos - 2 >= 0 && $amida[$i][$pos - 1] === '-'){
        $pos -= 2;
    }elseif($pos + 2 < count($amida[$i]) &&  $amida[$i][$pos + 1] === '-'){
        $pos += 2;
    }
}
$pos /= 2;
echo ++$pos.PHP_EOL;
?>
1文字ずつ配列に代入する。7行目で改行文字を投げ捨てるのを忘れない。
当たりから探すほうが簡単なので当たりの位置を取得したら左右を確認しつつ上に遡る。
もちろん境界条件も忘れない。
文字列の位置から何本目のアミダかに変換して出力するだけ。
今見直すと出力と演算を同時に行なっているのは筋が悪いな…。次回から気をつける。



2012/08/03

Twitter 勉強会 #twtr_hack に行ってきた ~ 懇親会なんてなかった

ReverseAuthとサーバサイドのOAuth ~ そして勉強会へ | DevAchieveで書いた通り、参加してきました。
流れとか内容とかはこっち。

今思えばフラグ



事前にGoogleMapで調べると全然違うビルに目的地マークが。正解は右。
詰んだかと思ったけど駅方向に戻りながら探したら何とか見つけて受付で参加費と懇親会費を先払い。
名刺代わりに胸にTwitterプロフィールのシール貼って近くの人と自己紹介した。名刺持ってなかったから良かった。

主にこの発表を聞きに来てたけど他の発表も良かった。色々勉強になりました。
iOSのTwitterFrameworkを使ってみたら #twtr_hack
seancook/TWiOS5ReverseAuthExample
技術的な話も良かったし、作ったアプリも良かった。Androidユーザーだけど欲しくなった。
@i2key iOSのTwitterFrameworkを 使ってみたら... #twtr_hack - YouTube
そして発表中に再生したのはわたしです/(^o^)\本当に申し訳ありませんでした\(^o^)/

勉強会も終わり、懇親会へ

初参加で知ってる人居ない&行きで迷った&ケータイの電池切れてるという
死亡フラグがビンビンの状況で一人で行動するのはさすがにヤバイと感じた子羊@wada811は
頑張ってコミュ力発揮してついていくために当たりの様子をうかがった!

後ろにフォローしている@sakura_bird1さんらしき人と愉快な仲間たち(ボクの知らない人)がいたけど
顔見知りな雰囲気のところに突っ込んでいく勇気がなかったので
懇親会に参加するという前の人に話しかけてついていくメソッドを実行することにした!

いしき たかい がくせい が あらわれた !

話しかけようかというところで話しかけられた。
流れで会場を出つつ、アプリやってるんですかー?アプリ作りたくてーTwitterでー世界の食をーとか(もはや覚えてない)
教えてくださいーとか夏に自由参加な感じの開発キャンプがあるーとか話しかけられて(勧誘されて?)
良い感じにいたいけな子羊を群れからはぐれさせておいて自分ら懇親会参加しないんでメソッドを発動された!

え?参加しないの?オレ詰みじゃね?ってソワソワしながら別れを告げたら他の参加者の姿はもう無かった…。
うろ覚えのルートで懇親会の会場へ向かうもケータイの電池切れてるしMacを開いても電波ないから辿り着くのは無理ゲー。
連絡手段すら無い状況でフラフラ夜の御茶ノ水をさまよっても無理ゲーすぎるので一旦デジハリに戻ってみることに。
あわよくば他の参加者にすれ違わないかなーとかまだデジハリに居ないかなーとか思ったけど流石にそんなことはなかった。

懇親会なんてなかったんや!そう諦めて帰路に着くことに…。
駅に向かっているとロッテリアのガラスにau Wifiのステッカーが!コレで勝つる!
とりあえず絶品チーズバーガー食べながらMacを開く。
au Wifiは鍵付き。softbankもあったけど契約者のみ…。クソ電波飛ばしてんじゃねー!
再び希望から絶望への相転移を味わいながらポテトをかじっていると
勉強会の途中で懇親会の会場のGoogleMapを開いた記憶が蘇ってきた!ブラウザのキャッシュ!コレで勝つる!
Cmd+Shift+Tで閉じたタブを復元しまくった!

拡大縮小はできなかったけど位置関係からなんとか特定できそうだったので
絶品チーズバーガーのセットでお腹いっぱいだったけど向かってみた!

ルートの周りが懇親会が行われそうな雰囲気の場所ではなかったけど目印見つけてなんとかたどり着いた!

勝った!第三部完!

諦めなければなんとかなるもんだなーと、ビルの扉を開いてみると、ゴッっと鈍い音が。鍵がかかっている…。
隣の扉を試してもダメ、押してもダメ…。張り紙を読んでみると21時で施錠…・
「…の際には右のボタンを押して開けて下さい」という文章をパッと見て、右を見るも何もなし。
よく読んでみると「退場の際には~」だった…。

もうやめて!@wada811のソウルジェムは真っ黒よ!

何か方法はないかと色々見てみるも見えたのはガラスに反射した胸のTwitterプロフィールのシールだけ…。
どうやら夜の御茶ノ水をTwitterアカウント晒しながら歩いていたらしい。なんかもうアレ。
連絡手段もなく、誰かが降りてくるまで待ち続けられるほどの元気がなくなっていたので諦めて帰宅しました…。

こうして@wada811の初めての勉強会は終わったのでした。本当にありがとうございました。
懇親会費は返金してくださるそうです。@yusukeさんにはお手数をお掛けして申し訳ありません…。