明けましたね。今頃ですがおめでとうございます。
今年もそんなに更新頑張りませんがよろしくお願いします。

牧野工房さんの「XHTML&CSS超高速コーディング術」を読んだので感想を。

1. 第1章 コーディング専門サービス 牧野工房
2. 第2章 ムダな作業は可能な限り発生させない
3. 第3章 サイトの設計と情報の管理
4. 第4章 コーディングの基本と作業の順序
5. 第5章 例題で学ぶコーディング作業の流れとポイント
6. 第6章 実戦向けコーディング・テクニック
7. 第7章 ツールの活用
8. 付録

この本を読んで、一番スッキリしてある意味ホッとしたのは、牧野工房さんのコーディングの速さと値段の安さの秘密？がわかった点です。まぁ、中身は読んでくださいとしか言えないのですが、超高速コーディングのきっかけになりそうなものは正直少なかったです。牧野工房さんの仕事を受けるスタンスが速さの鍵なのかなと。同じスタンスで仕事できればいいのですが、自分が求められているものとは大きく違うしそういうコーダーになりたいかと言われると違うとしか言えませんね。ただ仕事を受ける際の意識や工程管理には素晴らしいと思うものがたくさんありました。あと中の人は仕事しやすいだろうなぁと感じました。

今後の仕事で1〜3章の内容は意識して行きたいところです。僕がやってる仕事ってデザインは小出しにしか来ないし、色々と「出戻り作業」だらけって感じで悩ましいです！たまにはデザイン一式まとめて欲しいなぁ。あと出戻りも少ないと良いなぁ。おっと愚痴じゃないですよ。「そうして頂けると速い・安い・綺麗をご提供出来ますよ」という提案です。

この本を読んで良かったと思える対象は、コーディング愛に溢れる実務経験2年未満までの人かな。コーディングのスケジュールを短く、金額は安くしたいというディレクターさんなんかも読めば良いキッカケが掴めるかもですね。

hetemlかつWordPressなひと向けの話です。WordPress2.9にアップグレードしようと思って自動アップグレードのボタンをポチっとすると見慣れない以下の画面が。

「馬鹿野郎、MySQL4.12以上でないとWordPress2.9にアップグレードできねぇよ！」ってことらしいのです。データベースアレルギーな僕は早速ググったわけです。すると参考になりそうな2つのブログを見つけ無事完了しましたよ。ま、以下のブログを見ればわかるしココで終わっても良いんだけど。

• MySQLを4から5へ（さくら+WPの場合） « Waviaei
• 馬鹿ラッチ2.0 — WordPress2.9のシステム要件がMySQL4.12以上になった為、慌ててデータベース移行。

でもね。キャプチャーないとやる気しないよね？そこで僕の登場です。
以下に書くけど自己責任でお願いします。

1. データベースのエクスポート

heteml管理画面の「データベース」からPHPMｙAdminへログインし、データベースをエクスポート。注意すべき点として「言語 – Language」の項目をutf-8としてログインすること（文字化けするらしいっす）。

ログインしたら該当のデータベースを選択し、エクスポートをクリック。上記の「構造」欄の「DROP TABLE / DROP VIEWを追加」と「IF NOT EXISTSを追加」にチェックを入れ、圧縮無しで「ファイルに保存する」→「実行する」。ここまで出来たらPHPMyAdminは閉じてね。

2. MySQL4のデータベースの削除とMySQQL5のデータベースの作成

heteml管理画面の「データベース」に戻ります。今まで使っていたデータベースの削除を削除。ここまで来ると後戻り出来ないらしいです。人生と一緒ですね。hetemlでは新規作成したデータベースはすべて 「MySQL5」 となるらしいので、「データベース作成画面へ」ボタンを。データベース名とかパスワードとか忘れないでね。サーバー名も変わってるからね。

3.データベースをインポートする前のMySQLの設定

僕の場合デフォルトでutf8_general_ciになっていたのでこれについてはよくわからんのですが、MySQLを4から5へ（さくら+WPの場合） « Waviaeiの「5. DBをインポートする前のMySQLの設定」を見てね。要はエクスポートした時のデータベースの照合順序に合わせてあげる作業ですね。

4. データベースをインポート

新しく作ったデータベースのPHPMｙAdminにログインして「インポート」タブをクリック。「インポートするファイル」の「参照」から、先ほどエクスポートしたファイルを選択。「実行する」をクリックして問題なければよかったね。問題あっても僕はなかったのでわかんないよっと。エクスポートしたデータベースの容量が大きくてインポート出来ない方はheteml管理画面の「php.ini 設定」の中にupload_max_filesizeってのがあるからサイズを大きくしてあげれば出来るんじゃないかな？違うのかな？僕は軽すぎるぐらい軽いので問題なかったっす。

5. wp-config.phpの編集

この時点でブログをブラウザで開くとおぞましいメッセージの画面があらわれます。
データベースが変わったから当然っちゃ当然なんですけどね。

上記のキャプチャー画像はサーバにアップしているwp-config.phpです。「DB_NAME」や「DB_USER」、「DB_PASSWORD」、「DB_HOST」のhogeとなっているところを2の項目で設定した内容に書き換えてあげます。編集したwp-config.phpファイルをアップロードし再度ブログにアクセスするといつも通りのブログが見れるはずです。見れなくても僕はわかんないや。

6. チェック

チェックして問題なければMySQLは大丈夫ですね。後は自動アップグレードのボタンをポチっとすればWordPress2.9の世界が広がってるはずさ！

テキトーでごめんなさい。

追記

inkdesign：Wordpress2.9へのアップグレードメモ（hetemlでのお話）にも素敵な記事がありましたよ。

Demoを見る

大分前にやったやつだけど、ネタが無いので書いておきます（以下に紹介するフィルタリングはfactory.yusukenakanishi.comでも使ってます）。元ネタはこちらにQuick and Easy Filtering with jQuery – Nettuts+。そのままやっても勉強にならないので自分なりに改良を。

HTML

<ul id="list">
    <li><a href="hoge" title="PHP HTML">PHP and HTML/XHTML</a></li>
    <li><a href="hoge" title="PHP">PHP</a></li>
    <li><a href="hoge" title="JavaScript HTML">JavaScript and HTML/XHTML</a></li>
    <li><a href="hoge" title="JavaScript">JavaScript and jQuery</a></li>
    <li><a href="hoge" title="JavaScript CSS">javascript and CSS</a></li>

    // 中略

</ul>

JavaScript

$(function(){
    // フィルタリングのメニュー
    var filteringMenu = '<ul id="filtering"> <li class="selected"><a href="#New">最新の10件<\/a><\/li> <li><a href="#ALL">ALL<\/a><\/li> <li><a href="#HTML">HTML/XHTML<\/a><\/li> <li><a href="#CSS">CSS<\/a><\/li> <li><a href="#JavaScript">JavaScript<\/a><\/li> <li><a href="#jQuery">jQuery<\/a><\/li> <li><a href="#PHP">PHP<\/a><\/li> <\/ul>'
    $('#list').before(filteringMenu);

    // #list liのtitle属性にALLを追加
    $('#list li a').each(function(){
        $(this).attr('title',$(this).attr('title')+' ALL');
    });

    // 最初に10件のみ表示させる
    $('#list li').hide();
    $('#list li:lt(10)').fadeIn('slow').removeClass('odd').filter(':odd').addClass('odd');

    // フィルタリング
    $('#filtering li a').click(function() {
        $('#filtering li').removeClass('selected');
        $(this).parent('li').addClass('selected');
        $('p.notes').remove();

        var filterTitle = $(this).attr('href').replace(/#/, '');

        // Newの場合は最新の10件だけを表示
        if (filterTitle == 'New') {
            $('#list li').hide();
            $('#list li:lt(10)').fadeIn().removeClass('odd').filter(':odd').addClass('odd');
        }
        else {
            // この条件に合うものを表示する
            $('#list li').hide().filter(function () {
                var listTitle = $(this).children('a').attr('title');
                var filterList = listTitle.indexOf(filterTitle);
                if (filterList >= 0) {
                    return filterTitle;
                }
            }).fadeIn().removeClass('odd').filter(':odd').addClass('odd');
            // 該当するものが何も無いときにメッセージを表示する
            if (filterList = $('#list li:visible').length == 0) {
                $('#list').before('<p class="notes">0件：該当するものがありません。<\/p>');
                $('p.notes').hide().fadeIn();
            }
        }
        return false;
    });
});

JavaScriptがOFF環境の時フィルタリングするメニューがあっても何の意味もなさないため、わざとJavaScriptで書き出すようにしています。元ネタではclass属性をフィルタリングしてるんだけど僕は何となくtitle属性に変えました。そして該当するものが無いときは何も無いとメッセージを表示させてます。

ここの書き方ダサいよとかあったら教えてくださいな。