スキップしてメイン コンテンツに移動

第55回CLR/H勉強会に参加してきた

2011/2/5はCLR/Hの第55回勉強会が開催されたので参加してきた。

午前の部

 

ASP.NET MVC 3 & jQuery "超" 入門 ハンズオン

今回は午前中にハンズオンもあるのでそれも参加してきたが、会場についてVisual Web Developer 2010がインストールされていないことに気がついた。2008がインストールされている事で油断していた。結局インストール作業だけで終わってしまった。

ハンズオンの中でVisual Studioの便利な機能をいくつか知ったのでメモ

  • コントロールクラスのアクションメソッドの右クリックから「ビューを追加」でビューのファイルが生成される
  • エクスプローラからフォルダごとソリューションエクスプローラへドラッグすると、プロジェクトに追加できる（ファイルができるのは知っていたけどフォルダも追加できるのは知らなかった）

デザイナーって普段何やってるの？

  • UXデザイナ
  • イメージスケッチをもらって、それを基に具体的なイメージを作る。パーツを作る
  • 使用不可のイメージは、通常の上に半透明の灰色を乗っける
  • パーツ作成はベースを作ってしまえば、あとはひたすらコピペ
  • サイズの変更作業は面倒
  • デザインはセンスがあればいいわけではない
  • セオリーを掴めばある程度なんとかなる
  • 「良い作品」をたくさん見ることでセンスは養われる
  • 配色の参考になるサイト：kuler
  • 業務アプリのデザインでは、OSのデザインを踏襲する。逸脱しすぎると使いにくい

「良い作品」を多く見るとセンスが養われる、というのはプログラムにも通じる話。

午後の部

 

SP.NET MVC3とその周辺テクノロジ

  • ASP.NETとは、Web開発のフレームワーク
  • 動的データ（Dynamic Data）：データの場所を指定するだけで簡単なデータ参照サイトが作られる
    →マスタメンテナンス画面に便利
    →スタイルシートである程度見た目をカスタマイズすることもできる
  • ASP.NET MVCのメリット
      HTMLベースのUI開発
      UIとロジックが疎結合
      単体テスト
      URLルーティング
  • jQueryでDOM操作・CSS操作・Ajax処理を容易に
  • jQueryはVisualStudioにも搭載されている
  • 今後は、jQuery Template・jQuery Data Linking・jQuery Globalizationに注目
  • WebForm or MVC：チームのスキル・コスト・納期などによって選択
  • @ITでチャックさんの連載記事がある
  • MVC 3の新機能
      ViewBag
      AllowHTML属性：クロスサイト
      HTML.Rawメソッド
      グローバルアクションフィルター
  • Razor：HTML生成エンジン
  • Webパーツ（ヘルパーライブラリ）：@twitter,@facebook,@Bingなど
  • 独自に開発・公開（NuGet）できる

Windows Phone 7 は Silverlight 4 の夢を見るか

  • iPhone使っている人の横でつかっても気がつかれず
  • 最初はアプリ開発する気はなかったが、実機を持つとアプリを作りたくなった
  • スマートフォンでのアプリ開発イメージ
      iOS：ジョブスの箱庭
      Android；Googleの公園
      Windows Phone：戦場
  • 日本語に対応していない
  • .NET Compact Framework 3.7が搭載されているらしい
  • アプリケーションから使えるセンサーはGPSと加速度センサーのみ
  • 電子コンパスはどこからも使われていない？（マップにも使われていない）

ボタンがフラットなデザインというのは面白い

Internet Explorer 9 + HTML5

Internet Explorer 9

  • JavaScriptとHTML5だけでいいぞ、という時代
  • IE9の売り：高速・洗練・信頼・互換
  • レンダリングの高速化：Direct2D、DirectWrite
  • JacaScriptの高速化：JavaScriptエンジン内臓してDOMを共有
  • FireFoxもDirect2Dに対応したためレンダリングが速い
  • 戻るボタンは進むボタンより大きい
  • ファイルダウンロードのモーダルダイアログ廃止
  • アドレスバーと検索バーを統合
  • ジャンプリスト・ピン止め・オーバーレイアイコンなどWindows7との連携
  • スタートメニューに追加
  • HTML5対応（canvasも対応）
  • ついにSVG対応

HTML5

  • DOCTYPE宣言はシンプル
  • inputのTypeが増加（IE9はまだ実装していない）
  • プログレスバー
  • multiple属性、ファイル選択
  • video、audioタグ
  • ソースタグで複数フォーマットを指定すると、上から対応するフォーマットが自動に選択され再生される
  • poster属性でロード中の画像
  • canvas
  • GDIの描画方法と似たようなコーディング

CSS3

  • 丸角
  • シャドウ
  • メディア
  • WebOpenFontFormat
  • セレクター：行ごとに色がかえることが簡単に

とある普通のHTML5を使ったサイトを作ったおはなし

  • とあるサイト「The Shodo」
  • IE9のWeb標準的な技術
  • 日本らしいもの
  • 構築は1ヵ月半でできた
  • クライアント
      HTML5
      CSS3
      Web Font（type kit）
      SVG
  • サーバー
      Windows Azure
      ASP.NET MVC3
  • 事前に技術検証を行った
  • ビデオと画像が違和感無く混在できるか
  • ギャラリーでいくつまで表示速度が耐えられるか（パフォーマンス）
  • 非対応ブラウザでもみせらるところは見せる

Writeページ

  • 最初の墨を磨るビデオを再生するかどうかの判定は、セッションストレージで
  • 半紙の部分はcanvas要素
  • 筆で書いた部分は、画像を重ねて描画している
  • お手本の字はSVG画像
  • 背景のグラデーションをSVGで描画することで、いろんな大きさに対応

非対応ブラウザでもはじくのではなく、見せられるところまでは見せる、というポリシーは大賛成

Azure開発の極意（に至るまでの道のり）

  • フォーラムの回答は異常に早い
  • 良書「Windows Azure 実践クラウドプログラミング」
  • こういうこと格好しないとMVPになれない
  • 他のクラウドベンダーもPaaSに進出してきた
  • 「windows azure」を「Googleで」検索したトラフィック、アメリカレドモンドからが1位
  • JAZ：日本のAzureユーザー会 http://r.jazug.jp/

じゃんけん大会で「JavaScript本格入門」山田 祥寛(著)があたった。後日レビューを書く

送信者 Chuta Blog
ラベル:

コメント

コメントを投稿

このブログの人気の投稿

VirtualBoxのUbuntu 18.04でNAT + ホストオンリーアダプター

VirtualBoxのVMにインストールしたUbuntu Server 18.04で、ネットワーク割当を「NAT」+「ホストオンリーアダプター」にする場合の設定についてメモ。 VMを作るとき、ゲストOSからインターネットに繋がって、かつホスト-ゲスト間でもつながる環境にしたいとき、VMのネットワーク割当は手っ取り早いのは「ブリッジアダプター」なんだけど、会社のネットワークでは都合がわるかったりするので「NAT」+「ホストオンリーアダプター」にしている。 アダプター1は「NAT」を選択 アダプター2は「ホストオンリーアダプター」を選択 ゲストOSであるUbuntuのネットワーク設定は、NATに該当するNICはDHPCで、ホストオンリーアダプターに該当するNICは固定IPとする。 Ubuntu 18.04ではネットワーク設定はNetplanで行う（Ubuntu 17.10から変わったようだ）。編集する設定ファイルは「/etc/netplan/50-cloud-init.yaml」 network: ethernets: {NATのNIC}: addresses: [] dhcp4: true optional: true {ホストオンリーアダプターのNIC}: addresses: [{固定IPアドレス}] dhcp4: no version: 2 ポイントは、ホストオンリーアダプターに該当するNICの固定アドレスを設定するときに、 ゲートウェイを設定しない こと。 以前に QiitaのVirtualBoxでNAT + Host-Only Network環境を構築する を参考にしていたのに、今回18.04で設定する際にすっかり忘れてはまってしまった。 IPアドレスは「192.168.0.2/24」のようにサブネットマスクも指定する。 NICに指定するデバイス名は以下コマンドで表示されるlogical nameが該当する。 > lshw -class network たいていは「enp0s3」「enp0s8」となるようだ。 設定ファイルを保存したら
コメントを投稿
続きを読む

画像を切り取って保存する

画像処理において、画像の一部を切り出すことをトリミングというらしい。画像編集ソフトなんかにも大抵「トリミング」機能が実装されているだろう。 そんな画像を切り取る処理を.NETでやってみる。 .NETでは画像を扱う際にはBitmapクラスを使用する。BitmapクラスのCloneメソッドでサイズを指定すれば、そのサイズのBitmapオブジェクトができるので、それを保存すればよい。Cloneメソッドの引数はRectangle構造体とPixelFormat列挙体。 Rectangle構造体とは四角形の位置とサイズを表したもの。元画像の左上を（0, 0）として（X座標, Y座標, 幅, 高さ）の値でRectangle構造体を作成して渡す。PixelFormat列挙体はヘルプを見てもよくわからなかった。とりあえずは元画像の値をそのまま渡す。 例えば photo by tsukacyi のようなユッケの画像をトリミングするプログラムは以下のように書ける '元画像 Dim source As Bitmap source = New Bitmap("source.jpg") '切り取るサイズ Dim rect As Rectangle rect = New Rectangle(30, 80, 400, 320) '切り取り後の画像 Dim trimed As Bitmap trimed = source.Clone(rect, source.PixelFormat) '保存 trimed.Save("trimed.jpg") source.Dispose() trimed.Dispose() トリミング後の画像は以下の通り。
コメントを投稿
続きを読む

「Lively」ベータ開始

Googleが3D仮想空間 「Lively」 のベータ版を開始したらしいので、試しにやってみた。 グラフィックボードを搭載していない、オンボードなPCなのだが、それなりに動作するのが驚いた。比較されるであろう「Second Life」はやったことなく、3D仮想空間とやらは初めてなのだが、なかなか面白い。 試しに 「Chuta's Room」 を作ってみた。中にいくつかこのエントリへのリンクも仕込んでおいた。もしLivelyから来られた方は、コメントでも残していただけると有難い。
コメントを投稿
続きを読む