タグ

JavaScriptとlife is beautifulに関するcnomiyaのブックマーク (4)

  • Google App Engine入門:実践編

    今週に入って、Tiny Message に続く二つ目の Google App Engine ベースのサービスをリリースした。3日ぐらいで試験的に作った Tiny Message とは異なり、今回のものは、丸二ヶ月間寝る間も惜しんで作った力作である。 米国向けのサービスな上に招待制のSNSなので、ここではサービスそのものは公開しないが、いくつかこだわって作った部分があるので、それについて語ってみようかと思う。 1. 対象となるユーザーの絞り込み FacebookやTwitterのような巨人が存在している中で、それにまっこうから対抗するようなソシアル・ネットワーク・サービスを作ったところで無謀なだけである。そこで、逆に対象にするユーザー層を究極にまで絞り込んで、彼らのライススタイルに徹底的にマッチしたサービスを作ることにより差別化をはかる、という戦略を選択。対象は「LAに住む20〜30代の社交

    Google App Engine入門:実践編
    cnomiya
    cnomiya 2010/03/08
    クライアントサイドにTemplateEngine|AJAXでサーバーのAPIをたたいてデータをJSONの形で取得し、それとstatic serverから取得したHTMLテンプレートをJavaScriptで実装したテンプレート・エンジンを使って合成してから表示する
  • Life is beautiful: Javascript、クロージャを使ったプライベート関数の隠蔽について

    (このエントリーは「Javascriptクイズ:無名関数と実行効率の話」の続編。) 「???」と頭をかしげる太郎に、「じゃあ、これだったらどうかな?」と三郎はコードを書き始めます。 function code2name(code) { var mapping = { 'us': 'United States', 'ja': 'Japan', 'ko': 'Korea', 'ru': 'Russa', 'uk': 'United Kingdom', 'fr': 'France', 'cc': 'China', 'gw': 'Germany' }; return mapping[code] || '(unknown)'; } 「カントリーコードを国名に変換しているんですね。」と太郎。 「どこが問題だか分かる?」 「うーん、マッピングのためのオブジェクトを毎回作り直しているところかな。」 「そう

  • Life is beautiful: Javascriptクイズ(中級者向け):無名関数と実行効率の話

    Javascriptを使い始めたばかりの太郎君に、上司の花子さんから「スタイルシート用のスタイル名をDOMからアクセス可能なプロパティ名に変更するJavascriptのライブラリを作って欲しい」という課題が与えられました。何のことか分からずにポカンとしている太郎君に、花子さんは「"font-style" を"fontStyle"に変更する関数を作ればいいのよ」と言い残して立ち去ってしまいます。 O'ReillyのJavascriptとしばらく格闘した太郎君は、やっとライブラリを完成させます。 function capitalize(str) { return str.charAt(1).toUpperCase(); } function style2prop(str) { return str.replace(/-[a-z]/g, capitalize); } "font-style"が

  • Life is beautiful: JSONでアニメーション用のメタ言語を作ってみた

    ianime.jsもようやく安定して動き出したので、スライドショーを作ってみようと思ったのだが、通常のjavascriptのイベント処理を使って作ろうとすると、(1)最初のアニメーションの動作を指定し、(2)そのアニメーションの終了イベントを受けて次の指示を出し、...と、ものすごいスパゲッティ・コードを書かねばならなくなる。 それがどうしても耐えられなかったので、色々と試行錯誤をしているうちにたどり着いたのが、JSONを使ったアニメーション専用のメタ言語である。下の例の太字の部分がそれ。 function start() { anime.addSequence([ { duration:3000 }, { id:'pic4', effect:'fadeout', duration:3000 }, { duration:3000 }, { id:'pic3', effect:'fadeou

  • 1