ブックマーク / dev.classmethod.jp (8)

  • Backbone.jsにおけるModel-View-Presenterアーキテクチャパターン | DevelopersIO

    クライアントサイドJavaScriptのフレームワークとして人気のBackbone.jsが採用している Model–View–Presenter (MVP) というアーキテクチャパターン(以下MPVパターン)について考察してみます。 Model-View-Controllerなら聞いたことあるけど? 僕もそうでした。初めて知ったのはRuby on Railsを触った時です。 Modelはデータと手続きを担当し、ViewはUIを、Controllerは入力イベントを受付けてModelとView操作する…とまぁざっくり言うとこんな感じですよね。 MVPパターンも凄く似ていて、どうもMVCパターンから派生したものみたいです。以下が各パターンの図です。 Model-View-Controller Model-View-Presenter PresenterがModelとViewを操作しているところ

    yuupl
    yuupl 2013/02/27
  • プログラマがデザインをはじめるとっかかり | DevelopersIO

    目的に到達するのは得意(各技術を用いて目的に到達する) 絵を描くのがあまり得意でない(クリエイティブという言葉が出てくると抵抗を感じる) デザインスキルを身につけたいと考えるプログラマのそのとっかかりを考えたいと思います。 高度なデザインではなく、あくまでもとっかかりの話です。 デザインというとアーティスティックな側面がありモヤモヤしている、掴みどころがないという要素がある故に敷居が高そうな印象がありますが、 デザインには答えがある。その答えはロジックにより導かれる、とひとまず考えてみてはいかがでしょうか。 プログラムを書く人は論理的思考力が優れているように思いますが、これをデザインにも適応するとイイかと思います。 論理的に考える 例えば既存のシステムにボタンを配置するときです。 ほかのボタンの形状はどうなってる? → 角丸で統一されている → 同じように角丸で描画する 色はどうする? →

    yuupl
    yuupl 2012/12/27
  • 【クリスマスだし】Internet Explorerとうまく付き合う方法【IE対応まとめ】【25日目の6】 | DevelopersIO

    IE6はタヒぬDeath! こんばんは、クラスメソッドWebマスターの野中です。 今日はクリスマスですね、社内には独り身の負のオーラが満ちてます(既婚者が多いので残っている人は少ない)。 ところで、最近はCSS3もすこしずつ使えるようになってきていて、IE6からIE8の対応を蔑ろにしてしまっている自分がいます。 Web制作に携わってから6年、常に付きまとう古いIEは腐れ縁というか、ある意味青春ですね。 とっても今さら感たっぷりなお題目ですが、ここでIE対応のポイントを自分のために総浚いして青春に決着をつけたいと思います。 過去の経験と情報収集をもとにまとめているので実際にテストしたものではありません。 解決のきっかけ程度になれば良いと思いまとめています。 IEの現状 一般的なブラウザと先進的なブラウザに対する手法と考え方 ドキュメントタイプ:文書型定義 IE向け条件付きコメントで分岐処理

    【クリスマスだし】Internet Explorerとうまく付き合う方法【IE対応まとめ】【25日目の6】 | DevelopersIO
    yuupl
    yuupl 2012/12/26
  • BootstrapのCSSを簡単にいい感じにカスタマイズできる厳選サービス2+1つ紹介 | DevelopersIO

    Bootstrapいいよね Bootstrapです。大人気の見た目系フレームワークですね。いろんなサイトで見かけます。 自分もそうなのですが、エンジニアでコードは書くけどデザインの事はよく知らない。だけど「使いやすくて、いい感じにしたい」という欲求を満たしてくれてます。ただ、デフォルトは見やすいんだけど、ちょっとカスタマイズしたいなとか、色指定があった場合など困りますね。例えばありそうなのが「コンテンツ管理画面を作りたい、デザインは特にこだわらない、けど使いやすいのがいいな。」とかさらに「イメージカラーが青だからそれベースで」とか。 そんなあなたにぴったりな厳選ツールを紹介しちゃいまっくすぅ〜! Lavish 〜 画像から配色を生成してくれます 〜 このサービスは画像を解析してBootstrapの配色を捻り出します。 何処かの企業向けに作る場合に企業のロゴなどから配色してみるといい感じにな

    yuupl
    yuupl 2012/12/06
  • Amazon VPCでELBとNATを使ってよりセキュアな環境を作る【5日目】 | DevelopersIO

    公開するサーバはセキュリティを特に強化する ELBを介してEC2インスタンスのWebアプリにアクセスするとき、ELB以外からのアクセスを拒否したくなります。また、公開IPアドレス自体も持ちたくありません。公開IPを持たせたくないということでVPCを前提に考えます。そして、ELBをパブリックサブネットに置いて、EC2をプライベートサブネットにすることで実現できます。今回は、VPCを使ってELBとNATインスタンスを使ったセキュアな環境を構築したいと思います。 VPCとELB ELBとAutoScalingが連携できることは知られていますが、VPC内でも使うことができます。 VPC内のELBのテクニックとして、ELB自体をパブリックサブネットに置いてEC2をプライベートサブネットにおくことがあります。ELBがリバースプロキシとして働いて、EC2はELBからのHTTPインバウンドのみ受け付けるの

    yuupl
    yuupl 2012/12/06
  • お手軽高機能!Closure UI【goog.ui.Checkbox】 | DevelopersIO

    Closure Libraryに用意されている「goog.ui.Checkbox」は、3値(true, false, null)からなる状態(checked, unchecked, undetermined)を持つチェックボックスコンポーネントです。 デモ Checkboxの持つ三種の状態が確認できるデモです。全てではないいくつかの「選択項目」がチェックされていると「全選択」チェックボックスが第三の状態「UNDETERMINED」となります。 デモコード index.html <!DOCTYPE html> <html> <head> <title>goog.ui.Checkbox</title> <meta charset=utf-8> <script src="http://closure-library.googlecode.com/svn/trunk/closure/goog/ba

    yuupl
    yuupl 2012/11/26
    チェックボックスの制御だけであれば、いささか重すぎる実装のようにも思える。
  • [Adobe Edge Inspect]モバイル向けウェブサイト/ウェブアプリを実機でデバッグ | DevelopersIO

    モバイルサイトやモバイル向けウェブアプリを開発している方はデバイスでの動作検証等が面倒に感じたことがあるかと思います。 テストサーバーに修正したファイルを何度もアップするのは面倒ですし、実機でデバッグできないのは不自由です。 そういった面倒や不具合を解消し、デバイスでのブラウジングやデバッグを簡単に行うことができる「Adobe Edge Inspect」の機能を紹介したいと思います。 今回使用する環境 今回は下記の環境で検証しています。 MacBook Air( MacOS X 10.7.4) iPhone4(iOS 6.0.1) インストールまでの流れ 1.サイトにアクセスしてGet startedボタンを選択します。 http://html.adobe.com/edge/inspect/ 2.サインインします。(Adobe IDを持っていない場合は作成します) 3.画面上部の「アプリケ

    yuupl
    yuupl 2012/11/26
    無償だとデバイス1台制限があるが、有償で対価を払ってまでこの機能が必要かと言われると「う〜ん」と唸ってしまう。
  • Backbone.js -JavaScriptのMVCフレームワーク- | DevelopersIO

    Backbone.jsとは? Backbone.jsは、JavaScriptによる大規模なアプリケーション開発を行う際に力を発揮するMVCフレームワークです。データバインディングとカスタムイベントを備えたModel、配列情報を表すCollection、イベントをハンドリングするView、サーバーサイドのアプリケーションと連携するためのRESTful JSONなどをフレームワークとして備えています。 大規模な業務アプリケーションのユーザーインタフェースをJavaScriptでゴリゴリと作ろうとした場合、100%に近い確率で失敗するかと思います。これは、Flexのようなビルド時のコンパイラエラーを検出できないこと、存在するフレームワークがインタラクションやビジュアルに特化していること、ブラウザーやOSの組合せでAPIレベルの仕様が異なる事、同じブラウザーでもバージョンの違いにより挙動が異なる事

    yuupl
    yuupl 2012/11/26
    Backbone.jsの初心者向けのまとめ。
  • 1