タグ『
模擬ECサイト 』
今の僕にはこれが限界です。作る予定だったものはこれでほぼ全部終わりました。
昨日今日でUI周り改造。といっても会員登録ページだけだけども。この記事を参考に付けまくった。世の中にはもっと色んなスクリプトがあるのは知ってるけど、簡単なページ1つにこれだけつけるのはちょっとやりすぎじゃないかと思う。面白いの見つけたらまたくっつけるけど。住所→郵便番号の逆引きは実現出来ませんでした。そういうスクリプトは見つけられなかった。自分でPHP組んでJSONで渡せば良いんだけどまだ僕には無理と冷静に判断しました。だって順引きの実現のために、たった7文字のインプットのために、JSONファイル900本以上使ってるんだよ！っていっても今回はダウンロードしただけだけど。作者さんに感謝！
以下備忘のために列挙すると、
記事にあった：Input Hint Overlay、Text input field filter、jQuery Validation、Simplest Twitter-like dynamic character count、jQuery-narrative-select
と、郵便番号→住所のためにajaxzip2（これだけ国産）（当たり前か）。過去エントリに書いていたIME制御はCSS（ime-mode)でやりました。なのでfor IE,FireFox onlyです。JSで頑張って何か作ろうかな。スクリプト同士がバッティングしないか怖々で、一つ一つ動作確認しながら付けて行きました。やっぱりバッティングは起きるんだけど、一つ一つ解消して行って、最後にselect部分のエフェクト(jQuery-narrative-select)だけは解消できなくて、都道府県選択部分は外しました。ajaxzip2とbindの熾烈な攻防をしてるんじゃないかと推察。あ、そうか。どっちかbindじゃなくすれば良いのか。明日見てみよう。
改造の結果W3C先生から怒られまくり。今までPHP組んでた時は全部直してきたけど、今回のは難しい。中でもautocomplete属性なんて、代替策を探してたら「HTML5では非推奨では無くなります」だって。じゃあW3C勧告が決まったら怒られなくなるのか。なんか変。まぁ、少しづつインラインからJSとかに書き換えて直していきます。
このECサイトの改善について思いついているのは後は細かい修正ばかり。次は何組もうかな。
今日で職業訓練の授業は終了で、明日が修了式なんだけど、今度こそ本当の卒業制作を一人でやろうかなと思ってます。もともと訓練が始まったころは業務用のWEBアプリを作ってみたいと思ってたので、それを今度はゼロから自分で創る。
とはいえ、訓練終了で本気で職探し始めなきゃいけないんですが、それも資格試験の（不？）合格発表を待って本格化する予定ですので、少しは時間があります。
ECサイトのようにある程度出来たらUPしますのでまたご意見下さい。
最後に改めて、上記スクリプトの作者の皆様に心より感謝します。いつか、恩返しとして、僕も色んな人に使ってもらえるようなコードが書けるように頑張ります。
(12/8追記)
残文字数カウンターの挙動がおかしかったのを修正。
入力し始めはちゃんと機能しているんだけど、Validationのエラーが表示されて以降は死んじゃう。ドキュメントを色々読んでもわからないので、スクリプト本体を読む。function calculateってのがthisを引数にしてるのにピンと来て、FireBugで変更後のHTMLを見ると、inputとカウンター用のspanの間にエラー表示labelが挿入されてる。これでターゲットが移っちゃうのね。このページ(jQuery Validationの日本語解説としてはこの方のページが一番判りやすいと思います。感謝！)を参考にValidationのエラー表示を後ろに移す。正解！JSも挙動が面白いなー。やんちゃなくせにDOMにだけは忠実、って感じ。
10年12月7日(火)‡23時19分13秒 ‡
未分類
ようやく予定していたものが全部完成。残すはUI周りの改善のみ。
PHPコードとしては最後に残ってた「著者詳細」「出版社詳細」ページは制作中止しました。ページ作っても、項目少なくてスカスカになっちゃうので商品検索にリダイレクトしました。
言い訳すると、Amazonでも著者ページはあまり充実しているとは言い難い状況なのだから模擬サイトで無理する必要はないかなと。これ以上の検討は実際のサイトとして運用する時の姿勢によると思います。それこそファン向けコンテンツを組み込むとかの選択肢があると思う。または公式リンクを別窓で開くとか。あ、そうか。wikiかグーグルの検索結果にリンクするってのもある。あほか。
ひと月前に作り始めた時はPHPコードを理解するのに必死で、参考書の通りテーブルレイアウトで打って行ったんだけど、大分理解の進んだ今ではそれが気持ち悪くなってきた。
最後のほうに作った「注文履歴」周りはゼロから作ったってのもあって意味のないテーブル要素は入れず、文脈に沿ったマークアップになってるんじゃないかと思います。最初のほうに打ちこんだページで酷いのは少しづつ手直ししてるんだけど時間かかりそうです。最初のほうにサイトに入ってまず触れるページを作っていったので困っちゃう。
もしこのサイトで遊んでやろうと思って下さった方は是非登録して奥のほうまで見てやってください。
UIについては、DOJOに挑戦しようと思ってすでにヘッダーには記述入れてたんだけど、jQueryのUI周りのテクニック解説を見つけたので、一旦は全部jQueryで組んでみるつもりです。
明日から2日間は細かい手直しは我慢して、UI改造に専念します。
10年12月5日(日)‡23時45分26秒 ‡
未分類
注文履歴周りの改造をするって昨日書いたのに、気が付いたら「おすすめ商品」の仕組みが出来あがってた。なんだそりゃ。
「カートへ投入」「カート確認」「購入完了」の三つの画面に付けたんだけど、ログインできないと見れないことに気づいてトップページにも付ける。
しかしまたまた大変でした。まるっきり参考にするものがなくて一から作るのは初めてだったので、どうでも良いミスでエラー続出。
さすがに全部書くほど恥知らずではないので、1個だけ備忘録として書きます。
というかforeachとmysql_fetch_arrayの使い方がごっちゃになってて無茶苦茶になったっていうだけの話なんですけど、例えば「foreach($hoge as $key =>$value)」って条件付けしたらループ処理内では$key、$valueを代入して行くのが基本なんだけど、それを「while($value=mysql_fetch_array)」の時も$valueだけ代入してエラー続出。この場合の$valueは配列になってるから（というかここで$value使うからまちがえるのか）添え字が必要。気がついて直しても次にまた同じエラー。癖になっている。気をつけよう。配列の扱いがまだ良く身に付いていないんだよなー。
Amazonと比べたら失礼だけど、自分で「おすすめ商品」の仕組みを一から作ってみて、改めてAmazonのすごいところが良く判った。
うちの「なんちゃって」では、カートの商品と同じものを買った人達が他に買ってる商品を全部集計して出現頻度で順位付けして上位を表示してるだけなんだけど、こんな簡単な仕組みでも、もしAmazon並みの圧倒的な商品数と会員数があれば思いもよらない結果がでるだろうなと想像できる。リアルタイムに膨大な情報（履歴）を収集し続けて、それを個人の購買行動に直接フィードバックし続ける仕組み。マーケティング理論とか不要になっちゃうよね。すごく僕が憧れたインターネットの可能性を体現していると思う。なんというか、まず最初に堅牢かつ簡素な仕組みを構築して、そこに自他の物量や資源を集中させる。その圧倒的な「モノ」の洪水の中で生き残っていくものには自然と価値が伴っていく、ってやり方。アメリカ式。「健全な弱肉強食」。僕はインターネットの良さってそういうものだと思ってる。
急にいつもの失敗話と違う感じのエントリを書いてしまったけど、今日のコーディングが僕がweb構築スキルを身に付けたいと思ったきっかけを思い出させてくれたので書いちゃいました。ほんとはこういうことは文章で書くべきものでなくて、スキルの成果物として公開すべきものだと思ってます。
まぁ、まだ陸サーファーならぬ「陸アーキテクト」ということで一つ。
10年12月2日(木)‡23時51分08秒 ‡
未分類