Web Technology

Web関連技術(HTML5、CSS3、JavaScript、jQuery)でフィルタリングして記事一覧を表示しています。

Angular TIPS

複数のスタイルクラスをまとめて操作するには?(ngClass)

スタイルシートとして定義した複数の対象クラスのスタイルを、任意の要素のclass属性にまとめて着脱できるngClassディレクティブの基本的な使い方を説明する。

Angular TIPS

数値(単数/複数)によって表示を切り替えるには?(ngPlural)

Angularで数値によってテキスト表示内容を切り替えるための、ngPluralディレクティブの基本的な使い方を説明する。

Angular TIPS

条件式の真偽に応じて出力を切り替えるには?(ngIf/else)

与えられた条件式に基づき要素の表示/非表示を切り替えるngIfディレクティブで用いる、「さもなければ」を意味するelse句と、テンプレートとして別出しするためのthen句の、基本的な使い方を説明する。

Angular TIPS

条件式に応じて要素を表示/非表示にするには?(ngIf)

与えられた条件式に基づき要素の表示/非表示を切り替えるngIfディレクティブの基本的な使い方を説明。また、ngIfディレクティブによる表示/非表示の挙動の特性と注意点も示す。

Angular TIPS

複数の要素を繰り返し出力するには?(ngFor)

配列の内容を順に出力できるngForディレクティブ(=ngForOfディレクティブ)と、ダミーのコンテナー要素(<ng-container>)を使うことで、複数の要素群をまとめて繰り返し出力する方法を説明する。

Angular TIPS

配列の内容を順に出力するには?(ngFor)

配列の内容を順に出力できるngForディレクティブ(=ngForOfディレクティブ)の基本的な使い方を説明。また、ngForディレクティブで利用できる特殊変数についてまとめる。

Angular TIPS

要素に適用するスタイルクラスを操作するには?(Class Binding)

スタイルシートとして定義した対象クラスのスタイルを、任意の要素のclass属性に簡単に着脱できるClass Bindingの基本的な使い方を説明する。

Angular TIPS

インラインフレームに外部リソースをバインドするには?(Property Binding)

セキュリティの観点からデフォルトではiframeのsrc属性やobjectのdata属性にはプロパティバインディングできない。これを回避して信頼できる値としてバインディングする方法を説明する。

Angular TIPS

スタイルプロパティに単位付きの値を設定するには?(Style Binding)

Style Bindingの「[style.スタイルプロパティ名.単位] = "式"」というバインディング構文によって、要素に対する任意のCSSスタイルプロパティに単位付きで値をバインドする方法を説明する。

Angular TIPS

要素のスタイルプロパティを操作するには?(Style Binding)

「[style.スタイルプロパティ名] = "式"」というバインディング構文により、要素に対する任意のCSSスタイルプロパティに値をバインドできるStyle Bindingの、基本的な使い方を説明する。

jQuery逆引きリファレンス

親要素を削除するには?(unwrap)

現在の要素の親に当たる要素を削除するunwrapメソッドの基本的な使い方を説明。これ以外の要素削除系メソッドとの違いも簡単にまとめる。

Angular TIPS

数値を通貨記号付きの値に整形するには?(currency)

Angularで数値を通貨記号付きのテキスト表示に整形するための、currencyパイプの基本的な使い方を説明する。

jQuery逆引きリファレンス

要素セットに、指定された条件に合致する要素が含まれるかを判定するには?(is)

isメソッドを使って、指定した条件に合致する要素が、現在の要素セットに1つ以上含まれているかどうかを判定する方法を説明。また、jQuery 1.7前後で発生した挙動の変化についても言及する。

Angular TIPS

数値をパーセント形式に整形するには?(percent)

Angularで数値を%(パーセント)形式のテキスト表示に整形するための、percentパイプの基本的な使い方を説明する。

jQuery逆引きリファレンス

現在利用しているjQueryのバージョンを確認するには?

現在利用しているjQueryライブラリのバージョンを、JavaScriptコードから実行中に確認する方法を説明する。また、ライブラリのバージョンの使い分けや、旧バージョンの入手方法も紹介。

Angular TIPS

数値(単数/複数)によって表示を切り替えるには?(i18nPlural)

Angularで数値によってテキスト表示内容を切り替えるための、i18nPluralパイプの基本的な使い方を説明する。

jQuery逆引きリファレンス

要素セットから特定の子要素を持つ要素だけを取得するには?(has)

jQueryオブジェクトで保持している要素セットから、特定の子要素を持つ要素のみを取得できるhasメソッドの基本的な使い方を説明する。

Angular TIPS

フォームへの入力値をイベントハンドラーで受け取るには?(テンプレート参照変数)

フォーム要素への入力値をイベントとして受け取る方法として、テンプレート参照変数を利用する方法を説明する。

jQuery逆引きリファレンス

要素セットからn番目の要素を取得するには?(eq)

jQueryオブジェクトで保持している要素セットから、指定したインデックス番号の要素のみを取得できるeqメソッドの基本的な使い方を説明する。

Microsoft Edge最新情報

Windows 10 Creators UpdateのJavaScript/CSS関連の新機能

Windows 10 Creators UpdateでEdgeはどのように進化したのか? CSS/JavaScriptに関する新機能や新搭載のAPIを、開発者目線で紹介する。

Angular TIPS

イベントハンドラーでイベント情報を参照するには?($event)

要素にイベントハンドラーをバインドするEvent Bindingで、その引数で得られるイベントオブジェクト「$event」から、イベントに関する詳細情報を取得する方法を説明する。

jQuery逆引きリファレンス

現在の要素セットからm~n番目の要素を取得するには?(slice)

jQueryオブジェクトで保持している要素セットから、指定したm~n番目の要素のみを取得できるsliceメソッドの基本的な使い方を説明する。

Angular TIPS

フォームの入力値をコンポーネントと同期するには?(双方向バインディング)

テンプレート上のフォーム入力値とコンポーネントのプロパティ値を双方向にバインドするTwo-way Bindingのバインディング構文を説明し、その仕組みを紹介する。

jQuery逆引きリファレンス

要素セットから指定の条件に合致したものを取り除くには?(not)

jQueryオブジェクトで保持している要素セットから、指定条件に合致しない要素のみを取得できるnotメソッドの基本的な使い方を説明する。

Angular TIPS

イベントハンドラーを登録するには?(Event Binding)

要素にイベントハンドラーをバインドするEvent Bindingについて、2つのバインディング構文を説明する。

jQuery逆引きリファレンス

要素セットの内容を順に処理するには?(map)

jQueryオブジェクトで保持している要素セットを、1つずつ順番に処理し、その処理結果をjQueryオブジェクトとして取得できるmapメソッドの基本的な使い方を説明する。

Angular TIPS

Angular CLIで、Angularアプリのコードを自動生成するには?

Angular CLIのng generateコマンドを使ってAngularアプリ用コードを自動生成してみる。また、各アプリのAngular CLI設定ファイルをエディターで編集する方法も紹介する。

jQuery逆引きリファレンス

現在の要素から指定された祖先/兄弟要素までを取得するには?(prevUntil/nextUntil/parentsUntil)

prevUntil/nextUntil/parentsUntilメソッドを使って、jQueryオブジェクトで保持している現在の要素セットから、現在の要素の直後から、ツリー構造において(指定された)兄/弟/親の関係にある要素の直前までの範囲にある全要素を取得する方法を説明する。

Angular TIPS

Angular CLIとは? ― インストール方法と、アプリの骨格生成&実行

新規Angularアプリの作成時にAngular CLIを使うと効率的だ。そのインストール方法と、コマンド1つでAngularアプリのスケルトンを作成して、そのアプリを起動する方法を説明する。

jQuery逆引きリファレンス

親子/兄弟関係にある要素を行き来するには?(parents/parent/prev/prevAll/next/nextAll/siblings/children)

parents/parent/prev/prevAll/next/nextAll/siblings/children/endメソッドを使って、jQueryオブジェクトで保持している現在の要素セットから、ツリー構造において親子/兄弟関係にある要素を取得する方法を説明する。

Angular TIPS

Angularの基本構造を理解して、アプリ開発を始めるには?

初めてのAngular開発【v4以降対応】。誤解のしようもない最も基本的な“Hello World”を作成して、Angularアプリの基本構造を理解しよう。

Angular TIPS

Angularの特徴とは? 開発環境を構築するには?

人気のJavaScriptフレームワーク「Angular」の基本機能を目的別リファレンスの形式でまとめる連載の第1回【v4以降対応】。まずはその特徴とインストール方法を説明する。

jQuery逆引きリファレンス

特定の要素を基点に別の要素を検索するには?(find)

findメソッドを使って、jQueryオブジェクトで保持している現在の要素セットの配下から、指定された条件の要素を検索する方法を説明する。

Angular TIPS

文字列/配列から部分文字列/要素を抜き出すには?(slice)

JavaScriptのString/Arrayクラスにおけるsliceメソッドと同じように、Angularで文字列から部分文字列を抽出したり配列から特定範囲の要素を取得したりできるsliceパイプの基本的な使い方を説明する。

jQuery逆引きリファレンス

要素セットを指定の条件で絞り込むには?(filter)

filterメソッドを使って、jQueryオブジェクトで保持している現在の要素セットを、指定された条件で絞り込む方法を説明する。

Angular TIPS

数値データに桁区切り文字を付与するには?(number)

Angularで数値を桁区切り文字列に整形するための、numberパイプの基本的な使い方を説明する。整数と小数点以下の桁数を指定して整形することも可能。

jQuery逆引きリファレンス

異なるバージョンのjQueryを共存させるには?(jQuery.noConflict)

jQueryが持つオブジェクト名との衝突を回避するためのjQuery.noConflictメソッドを応用して、jQueryで複数のバージョンをロードする方法を説明する。

Angular TIPS

文字列を大文字/小文字に変換するには?(lowercase/uppercase)

JavaScriptのStringクラスにおけるtoLowerCase/toUpperCaseメソッドと同じように、Angularで文字列を小文字/大文字に変換できるlowercase/uppercaseパイプの基本的な使い方を説明する。

jQuery逆引きリファレンス

jQueryを他のライブラリと共存させるには?(jQuery.noConflict)

他のライブラリ導入により「$」や「jQuery」というオブジェクト名が衝突する問題を回避する方法を紹介。別名を定義する方法を2パターン、紹介する。

Angular TIPS

JavaScriptオブジェクトをJSON形式に変換するには?(json)

JavaScriptのJSON.stringifyメソッドと同じように、AngularでJavaScriptのオブジェクトをJSON形式に変換できるjsonパイプの基本的な使い方を説明する。

jQuery逆引きリファレンス

特定のAjax通信でのみグローバルイベントを無効化するには?($.ajax[global])

Ajax通信の開始/終了/成功/失敗のタイミングで任意の処理を差し挟む際に利用するグローバルイベントを、現在の通信だけ対象外にする方法を説明する。

Angular TIPS

要素の属性に値をバインドするには?(Attribute Binding)

HTML要素の属性に対応するプロパティではなく、属性そのものにバインディングする方法を説明する。

jQuery逆引きリファレンス

イベントリスナーをそのままに、要素を削除するには?(detach)

イベントリスナーを破棄せず維持した状態で要素を削除し、再生成時に元通りにする方法を説明。削除/再生成ではなく、非表示/表示の利用推奨についても言及する。

Microsoft Azure(旧称:Windows Azure)概説(2017年2月版)

まだ知らない人のための最新Microsoft Azure入門

PaaSとIaaSの両方をサポートし、積極的に新機能・新サービスが追加されている、クラウド環境のAzure。多岐に渡る、その最新の全体像をまとめて理解しよう。2017年2月の新名称や追加サービスに対応。

Angular TIPS

ビューにHTML文書をバインドするには?(Property Binding)

プロパティバインディングでHTMLタグを含む文字列にバインドした場合、デフォルトでサニタイズされる挙動を確認。逆に意図的にサニタイズさせない方法を説明する。

jQuery逆引きリファレンス

アニメーションを一時停止するには?(delay)

実行中のアニメーションを途中で一時停止するdelayメソッドの基本的な使い方を説明。delayメソッド特有の問題点も取り上げる。

Angular TIPS

要素オブジェクトのプロパティに値をバインドするには?(Property Binding)

要素のプロパティに値をバインドするProperty Bindingについて、「[プロパティ名] = "式"」「bind-プロパティ名 = "式"」「{{プロパティ名}}」という3つのバインディング構文を説明する。

jQuery逆引きリファレンス

Ajax通信で成功/失敗コールバックに任意の値を渡すには?($.ajax[context])

主にコールバック関数に任意の値を引き渡す目的で使える「$.ajaxメソッドのcontextパラメーター」の基本的な使い方を説明する。

Angular TIPS

ビューの中で「安全に」プロパティ/メソッドにアクセスするには?(「?.」演算子)

プロパティやメソッドを呼び出す際にレシーバーオブジェクトがnullでないことを確認した上で呼び出せる「?.」演算子の基本的な使い方を解説する。

jQuery逆引きリファレンス

Ajax通信で得られたコンテンツを加工するには?($.ajax[dataFilter])

$.ajaxメソッドにより得たコンテンツをdoneメソッドで処理する前に加工/編集できる「$.ajaxメソッドのdataFilterパラメーター」の基本的な使い方を説明する。

Angular TIPS

コンポーネントの値をビューに反映させるには?({{...}})

JavaScriptのオブジェクトをHTMLテンプレートに結び付けるためのデータバインドを記述するためのInterpolation記法の基礎を解説する。

jQuery逆引きリファレンス

Ajax通信の前に処理を実行するには?($.ajax[beforeSend])

Ajax通信を送信する前に任意の処理を実行できるようになる「$.ajaxメソッドのbeforeSendパラメーター」の基本的な使い方を説明する。

Angular TIPS

コンポーネントに適用すべきテンプレートを指定するには?(template/templateUrlパラメーター)

@ComponentデコレーターのtemplateパラメーターやtemplateUrlパラメーターを使って、コンポーネントにテンプレート(ビュー)を適用する方法を説明する。

jQuery逆引きリファレンス

非同期通信のキャッシュを無効化するには?($.ajax[cache])

Ajax通信の結果をキャッシュするか否かを制御できる「$.ajaxメソッドのcacheパラメーター」の基本的な使い方を説明する。

Angular TIPS

Angular 2を利用するには?(実装編)

初めてのAngular 2開発。誤解のしようもない最も基本的な“Hello World”を作成して、Angular 2アプリの基本構造を理解しよう。

jQuery逆引きリファレンス

一般的なAjax通信を実装するには?($.ajax)

非同期通信の動作をより細かく制御したい場面で使える$.ajaxメソッドの構文と利用可能なパラメーター群の概要を紹介。簡単なサンプルで使い方を説明する。

Angular TIPS

Angular 2を利用するには?(準備編)

人気のJavaScriptフレームワーク「Angular 2」の基本機能を目的別リファレンスの形式でまとめる連載スタート。まずはその特徴とインストール方法を説明する。

jQuery逆引きリファレンス

thisキーワードの参照先を固定するには?($.proxy)

文脈により変化するthisキーワードの参照先を、$.proxyメソッドにより固定する方法を説明する。

jQuery逆引きリファレンス

既存の要素をコピーするには? ― cloneメソッド

既存の要素をjQueryオブジェクトとして複製する方法を説明。オブジェクトはappendToなどの挿入系メソッドを使ってHTMLソース内に要素として追加したりできる。

jQuery逆引きリファレンス

既存の要素を削除するには? ― remove/emptyメソッド

指定した要素そのもの/要素の中身(=子要素)を削除する方法を説明する。

jQuery逆引きリファレンス

現在の要素セットを特定の要素でラップするには? ― wrap/wrapAll/wrapInnerメソッド

現在の要素セットを新要素でラップする(=新要素の子要素にする)方法を解説。メソッドを使い分けることで、要素セットに対して個々に要素全体を/全ての要素をまとめて/個々に中身(=子要素)のみをラップできる。

Windows 10 Anniversary Updateの新機能【開発者編】

Microsoft Edge: HTML5/JavaScript最新標準仕様への新応とF12開発者ツールの新機能

Windows 10 Anniversary Updateでアップデートされた最新Edgeの「JavaScript標準仕様への対応状況/オープンソース化/追加されたHTML5標準/F12開発ツールの新機能」をWeb開発者向けに概説する。

AngularJS TIPS

AngularJSのディレクティブを単体テストするには?

テスティングフレームワーク「Karma+Jasmin」を使って、AngularJSの「ディレクティブ」の単体テストを記述し、それを実行する方法を解説する。

AngularJS TIPS

自作ディレクティブの挙動を定義するには?(controller/controllerAs/bindToControllerプロパティ)

テンプレートに基づき出力されるHTMLコードの内容を、イベントハンドラーなどを活用して動的に切り替えるために、コントローラー付きの独自ディレクティブを作成する方法を説明する。

AngularJS TIPS

自作ディレクティブの属性にAngular式や関数を設定するには?(scopeプロパティ)

自作ディレクティブ呼び出し側で指定した「属性の値(Angular式や関数)」をテンプレートに反映させることで、そのディレクティブ要素の下に埋め込まれるHTMLコードを動的に切り替える方法を説明する。

AngularJS TIPS

ディレクティブで属性を設定するには?(scopeプロパティ)

自作ディレクティブ呼び出し側で指定した「属性の値(文字列)」をテンプレートに反映させることで、そのディレクティブ要素の下に埋め込まれるHTMLコードを動的に切り替える方法を説明する。

AngularJS TIPS

ディレクティブ配下のコンテンツをテンプレートに反映させるには?(transcludeプロパティ)

自作ディレクティブ呼び出し側で指定した「配下のコンテンツ」をテンプレートに反映させることで、そのディレクティブ要素の下に埋め込まれるHTMLコードを動的に切り替える方法を説明する。

jQuery逆引きリファレンス

既存の要素を別の要素で置き換えるには? ― replaceWith/replaceAllメソッド

既存の要素を選択し、それをHTML文字列により生成した新規要素もしくはjQueryオブジェクトで置き換える方法を解説。また結果は同じになるが少し手順を変えて、HTML文字列による新規要素もしくはjQueryオブジェクトで既存の要素を置き換える方法も説明する。

AngularJS TIPS

ディレクティブで利用するテンプレートを外部ファイル化するには?(templateUrlプロパティ)

ビューの操作/生成を定義した自作ディレクティブのテンプレートを外部ファイル化して利用する方法を解説。また、ビューの中で<script>要素としてテンプレートを宣言する方法も説明する。

AngularJS TIPS

ディレクティブを自作するには?(directiveメソッド)

AngularJSで、ビューの操作/生成を独立させて独自ディレクティブを作成する基本的な定義方法と使用例を説明する。

jQuery逆引きリファレンス

既存の要素を別の場所に移動するには? ― insertBefore/insertAfter/prependTo/appendToメソッド

既存の要素を、指定した要素の直前/直後/子要素先頭/子要素末尾の位置に移動する方法を説明する。

AngularJS TIPS

AngularJSのコントローラーを単体テストするには?

テスティングフレームワーク「Karma+Jasmin」を使って、AngularJSの「コントローラー」の単体テストを記述し、それを実行する方法を解説する。

jQuery逆引きリファレンス

ページに新たな要素を挿入するには? ― insertBefore/insertAfter/prependTo/appendTo/before/after/prepend/appendメソッド

HTML文字列で要素を作成してから、指定した場所にそれを挿入する方法を解説。また結果は同じになるが少し手順を変えて、指定した場所にHTML文字列で要素を生成する方法を説明する。

AngularJS TIPS

AngularJSのサービスを単体テストするには?

テスティングフレームワーク「Karma+Jasmin」を使って、AngularJSの「サービス」の単体テストを記述し、それを実行する方法を解説する。

AngularJS TIPS

AngularJSアプリの単体テストを実施するには?(実行編)

テスティングフレームワーク「Karma+Jasmin」を使って、AngularJSアプリの単体テストを記述して、それをテスト実行するまでの手順を説明する。

jQuery逆引きリファレンス

jQuery1.x/2.xで作成したアプリをjQuery 3に対応させるには?

2016年6月、jQuery 3.0が正式リリースされた。今後は、従来バージョンのjQueryを使った既存のサイト/ページを、最新のバージョン3に徐々に移行していこう。移行ライブラリ「jQuery Migration」を使った方法を解説する。

AngularJS TIPS

AngularJSアプリの単体テストを実施するには?(準備編)

AngularJSで一般的に採用されているテスティングフレームワーク「Karma+Jasmin」による単体テスト環境を構築する手順を説明する。

Windows 10 Anniversary Updateの新機能

Microsoft Edgeの進化 ~Windows標準ブラウザーの最新機能と使い方

Windows 10 Anniversary Updateで、ようやく日常使用に耐えられる機能性と安定性が備わってきたEdge。その最新機能をパワーユーザー向けに概説する。

AngularJS TIPS

パラメーター付きのサービスを定義するには?(providerメソッド)

value/service/factoryメソッドに比べてより原始的なproviderメソッドの利用場面を紹介し、使い分け指針をまとめる。またproviderメソッドを使ってサービスを定義する方法を解説する。

jQuery逆引きリファレンス

フォーム要素に対して値を設定するには?(val)

valメソッドを使ってフォーム要素の値を設定する方法を説明。また、利用上の注意点や、値をクリアする方法、応用例として全てのチェックボックスを選択/解除する方法も示す。

AngularJS TIPS

アプリ内でよく利用するビジネスロジックを定義するには?(factoryメソッド)

より実践的なアプリ開発を行うために、アプリ固有のビジネスロジックをfactoryメソッドによりサービスとして切り出し、それを呼び出す方法を説明する。

AngularJS TIPS

アプリ内でよく利用するビジネスロジックを定義するには?(serviceメソッド)

より実践的なアプリ開発を行うために、アプリ固有のビジネスロジックをserviceメソッドによりサービスとして切り出し、それを呼び出す方法を説明する。

jQuery逆引きリファレンス

ラジオボタン/チェックボックス/選択ボックスの選択テキストを取得するには?(val)

valメソッドを使って選択テキストを取得する方法を、ラジオボタン/チェックボックス/選択ボックス/リストボックスなどフォーム要素ごとに説明する。

AngularJS TIPS

複数のコントローラー間で共有すべき値を管理するには?(constantメソッド)

より実践的なアプリ開発を行うためにアプリ固有の処理ロジック(今回はconstantメソッドにより管理する「値」)をサービスとして切り出し、それを呼び出す方法を説明する。

AngularJS TIPS

複数のコントローラー間で共有すべき値を管理するには?(valueメソッド)

より実践的なアプリ開発を行うためにアプリ固有の処理ロジック(今回はvalueメソッドにより管理する「値」)をサービスとして切り出し、それを呼び出す方法を説明する。

jQuery逆引きリファレンス

フォーム要素からの入力値を取得するには?(val)

valメソッドを使って、フォーム要素の値を取得する方法を説明。また、ラジオボタン/チェックボックス/リストボックス(複数選択)の場合の注意点も示す。

AngularJS TIPS

日付/時刻値を入力する際にタイムゾーンを加味するには?(ng-model-options)

ng-model-optionsディレクティブにtimezoneパラメーターを指定することで、タイムゾーンによる時差を加味した日時を<input>要素から取得する方法を説明する。

AngularJS TIPS

モデルへの入出力に際して処理を介するには?(ng-model-options)

入力フォームとモデルをバインドした際に、独自のゲッター/セッター関数を仲介させることで、そのモデルに出し入れする値を検証/加工する方法を説明する。

jQuery逆引きリファレンス

親要素に対する相対的な表示位置を取得するには?(position)

positionメソッドを使って、要素の「親要素からの相対位置」を取得する基本的な方法を説明する。なお、設定はできない。

AngularJS TIPS

不正な入力値もモデルに反映させるには?(ng-model-options)

入力フォームに検証機能を付けた場合、デフォルトでは不正値はモデルに反映されない。この制限を回避して反映させる方法を説明する。

AngularJS TIPS

画像を動的に生成するには?(ng-src/ng-srcset)

<img>タグのng-src属性に指定する画像リソースのURLをAngularJSのスコープオブジェクト経由で完成させることで、動的に画像を表示する方法を説明する。

jQuery逆引きリファレンス

要素の表示位置を取得/設定するには?(offset)

offsetメソッドを使って、要素の「ドキュメント上の相対位置」を取得/設定する基本的な方法を説明する。

AngularJS TIPS

モデルをバインドするテンプレートを指定するには?(ng-bind-template)

AngularJSのディレクティブであるng-bind-template属性を使って、{{...}}エクスプレッションを含むテンプレートをビューにバインドする方法を説明する。

AngularJS TIPS

$injectorサービスでサービスの取得/存在確認を行うには?($injector)

AngularJSの管理外でサービスを手動でインスタンス化して利用できる$injectorサービスの応用的な活用方法として、has/get/instantiateメソッドを解説する。

jQuery逆引きリファレンス

ページのスクロール位置を設定/取得するには?(scrollTop/scrollLeft)

scrollTop/scrollLeftメソッドを使ってページスクロールの垂直位置/水平位置を設定もしくは取得するための基本的な方法を説明する。

AngularJS TIPS

AngularJSの管理外でサービスを注入するには?($injector)

AngularJSの管理外でも、$injectorサービスを使ってサービスを手動でインスタンス化することで、AngularJSが提供するサービスを利用できる。その基本的な利用方法を説明する。

AngularJS TIPS

複数のオブジェクトを結合するには?(extend/merge)

angular.extendメソッドを利用して、既存の複数のオブジェクトを結合する方法と注意事項を解説。また、入れ子になったオブジェクトを再帰的にマージする方法も説明する。

jQuery逆引きリファレンス

URLフラグメントに一致するid値を持つ要素を取得するには? ― :targetフィルター

:targetフィルターを使って、URLフラグメントに一致するid属性値の要素を取得する方法を説明する。

AngularJS TIPS

コンテンツ・セキュリティ・ポリシーを利用する(ng-csp)

セキュリティフレームワーク「CSP」による制限ポリシーを有効にした場合に、AngularJSでは特定のケースでエラーとなる。そのケースの内容と回避方法を解説する。

AngularJS TIPS

配列/オブジェクトをコピーするには?(copy)

配列のコピーで、JavaScript標準のconcatメソッドを使う場合とAngularJSのcopyメソッドを使う場合の違いを説明。シャローコピーとディープコピーとは?

jQuery逆引きリファレンス

指定された言語に対応する要素を取得するには? ― :langフィルター

:langフィルターを使って、コンテンツの言語を指定するlang属性の値に応じて要素を取得する方法を説明する。

AngularJS TIPS

ルーティングの挙動/設定をカスタマイズするには?($routeProviderプロバイダー)

「テンプレートを文字列で指定(templateパラメーター)」「リダイレクト時の規則をカスタマイズ(redirectToパラメーター)」「html5モードに切り替える」という、特によく使われる3つのカスタマイズ方法を取り上げる。

AngularJS TIPS

URL経由でパラメーター情報を引き渡すには?($routeProviderプロバイダー)

ngRouteモジュールを使ったAngularJSのルーティングで、URL経由でパラメーター情報を引き渡す方法を解説する。

jQuery逆引きリファレンス

子要素の型/順番によって取得すべき要素を絞り込むには? ― 子要素フィルター

:first-of-type/:last-of-typeフィルターにより同じ要素の中で先頭/末尾の子要素を、また:only-of-typeフィルターにより同列の子要素に同種の要素が1つしかないものを、さらに:nth-of-type/nth-last-of-typeフィルターにより同じ要素の中でn番目の要素を取得する方法を解説。

AngularJS TIPS

ルーティング機能を実装するには?($routeProviderプロバイダー)

AngularJSではngRouteモジュールを利用したルーティングが可能だ。その基本的な用法(ルーティングの定義/コントローラー/テンプレートなど)について解説する。

AngularJS TIPS

AngularJSを手動で起動するには?(bootstrap)

通常は自動起動するAngularJSを手動で起動するにはangular.bootstrapメソッドを使用する。その基本的な使い方を解説。

jQuery逆引きリファレンス

子要素の位置関係によって取得すべき要素を絞り込むには? ― 子要素フィルター

:first-child/:last-childフィルターにより先頭/末尾の子要素を、また:only-childフィルターにより唯一の子要素である要素を、さらに:nth-child/:nth-last-childフィルターにより先頭/末尾からn個おきに子要素を取得する方法を解説。

AngularJS TIPS

thisキーワードの参照先を固定するには?(bindメソッド)

分脈により変換する「this」。その問題を解消するangular.bindメソッドの基本的な使い方を解説する。

AngularJS TIPS

既存のフィルターを利用して新たなフィルターを定義するには?($filterサービス)

既存フィルターの機能を活用する独自のフィルターを作成するための基本的な手順を解説。サンプルとしてbyte単位の数値をMbyte単位に変換するmegaByteフィルターを作成する。

jQuery逆引きリファレンス

子要素/テキストによって取得すべき要素を絞り込むには? ― コンテンツフィルター

:parent/:empty/:contains()/:has()フィルターの基本的な使い方を解説。子要素やテキストを持つ要素/空の要素/特定のテキストを含む要素/指定されたセレクターに合致する子要素を持つ要素を取得できる。

AngularJS TIPS

パラメーターを持ったフィルターを定義するには?(filter/identity/noopメソッド)

独自のパラメーター付きフィルターを作成するための基本的な手順を説明。サンプルとしてmapフィルターを作成し、これを使って配列の数値の2乗を計算してみる。

AngularJS TIPS

フィルターを自作するには?(filterメソッド)

独自のフィルターを作成するための基本的な手順を説明する。サンプルとして文字列の前後にある空白を除去するtrimフィルターを作成する。

jQuery逆引きリファレンス

登場順序によって取得すべき要素を絞り込むには? ― 基本フィルター

jQueryの$()関数でフィルター構文を使い、先頭/末尾の要素や、偶数/奇数番目の要素、n番目/n番目より前や後の要素を取り出す方法を説明する。

AngularJS TIPS

AngularJSアプリでjQueryを利用するには?(element/ng-jq)

HTML DOMツリーを直接操作したい場合に、標準のjqLiteではなく、高機能なjQueryを使う方法を解説。常にjqLiteにする方法や、jQueryバージョンを固定する方法も説明する。

AngularJS TIPS

AngularJSで文書ツリーを操作するには?(element)

AngularJSでは非推奨だが、特殊な事情でHTML DOMツリーを直接操作したい場合には、angular.elementメソッドを使用する。その基本的な使い方を説明する。

jQuery逆引きリファレンス

親子/兄弟関係にある要素を取り出すには? ― 階層セレクター

jQueryの$()関数で、複数の要素から構成される階層構造において、ある要素の子要素/子孫要素/直後の要素/以降の要素などを絞り込んで取り出す方法を説明する。

AngularJS TIPS

アプリ共通の例外処理を実装するには?($exceptionHandler)

アプリ内でキャッチされなかった例外を最終的に処理するAngularJSの$exceptionHandlerサービス。その挙動を上書きして、独自の処理を実施する方法を紹介する。

AngularJS TIPS

$cookiesサービスを利用する際の注意点とは?($cookies)

AngularJSのクッキー機能は1.3から1.4で大きく変更された。具体的に何が変わったかを解説。また、アプリ全体で共通のクッキーオプションを設定する方法も説明する。

jQuery逆引きリファレンス

属性値で目的の要素を絞り込むには? ― 属性フィルター

jQueryの$()関数で、属性やその値を条件に要素を絞り込む方法を解説。条件指定には、属性名のみや、属性値の完全一致/部分一致/複数一致などが指定できる。

AngularJS TIPS

クッキーを読み書きするには?($cookies)

AngularJSが提供する機能を利用してクッキーを読み/書き/削除する方法を解説。また、登録済みの全てのクッキー情報をまとめて取得する方法も説明する。

今、人気のJSライブラリ[ジャンル別に比較]

人気上昇中のJavaScriptライブラリを調べてみた【2016年版】

新しいWeb開発フレームワークも登場! 2015年中に人気が急上昇してきており、「2016年では必須の知識」となりそうなJavaScriptライブラリをランキング形式で発表する。

AngularJS TIPS

配列/オブジェクトの内容を列挙するには?(forEach)

angular.forEachメソッドを使って、配列の要素やオブジェクトのメンバーを列挙する方法を解説する。

jQuery逆引きリファレンス

id値/タグ名/クラス名で特定の要素を取り出すには? ― 基本セレクター

jQueryプログラミングの基本である$()関数による「#id」「element」「.class」セレクターの使い方を解説する。

C#エンジニアのためのBigQuery入門(5)

BigQueryでのテーブル作成とデータ挿入

連載最終回。C#のクライアントライブラリを使ってBigQueryへデータを挿入する方法を説明。Google Cloud Storage APIの活用や、Streaming Insertについても解説する。

AngularJS TIPS

指定された時間の経過で処理を実行するには?($interval/$timeout)

ミリ秒単位で処理を実行できる、いわゆる「タイマー」である$intervalサービスの基本的な使い方を解説。また、一定時間後に処理を実行する$timeoutサービスについても説明する。

jQuery逆引きリファレンス

非同期通信の開始/終了/成功/失敗のタイミングで処理を実行するには?(ajaxXxxxx)

jQueryによるAjax通信時に発生する各種グローバルイベントを処理する基本的な方法を、具体的なサンプルを通して説明する。

AngularJS TIPS

JSON形式のWeb APIにアクセスするには?($http)

Web APIと通信する際に問題となるクロスドメイン制約を回避するために使われるテクニック「JSONP」を、AngularJSで実現するための基本的な方法を説明する。

AngularJS TIPS

サーバーサイドとHTTP POSTで非同期通信するには?($http)

AngularJSでHTTP POSTで非同期通信する方法を説明。また、送信データをJSONではなくjQuery形式にする方法や、PHPでJSONデータをデコードする方法も紹介する。

jQuery逆引きリファレンス

JSON形式のWeb APIにアクセスするには?($.getJSON)

クロスドメイン制約を回避するためのJSONPをjQueryで利用しよう。$.getJSONメソッドの基本的な使い方を解説する。

AngularJS TIPS

サーバーサイドと非同期通信するには?($http)

AngularJSでサーバーサイドのWeb APIと非同期通信する方法を説明。また、ログの種類や、ショートカットメソッドについても紹介する。

jQuery逆引きリファレンス

HTTP GET/POSTで非同期通信を実施するには?($.get/$.post)

$.get/$.postメソッドを使って取得したデータを加工して表示コンテンツを組み立てる方法を解説する。

AngularJS TIPS

ログをコンソールに出力するには?($log)

AngularJSで開発者ツールのコンソールにログを出力する方法を説明。また、ログの種類や、デバッグログの表示/非表示の切り替え方法も紹介する。

C#エンジニアのためのBigQuery入門(4)

LINQでBigQuery: データスキャン量を抑えたクエリの実行方法

膨大なデータへのクエリで、スキャン量を減らしてクエリの課金額を抑えるには? テーブルワイルドカード関数とテーブルデコレーターを説明する。

jQuery逆引きリファレンス

自作のjQueryプラグインに引数を設定するには?($.extend)

プラグイン作成の基本を理解したら、パラメーターを受け取れるようにしよう。その実装方法を解説。

AngularJS TIPS

ng-repeat要素でさまざまな繰り返しを表現するには?(ng-repeat)

ng-repeatディレクティブの応用的な使い方として、「重複した値を含んだ配列」「ハッシュ(連想配列)」「複数の要素セット」の内容を順に処理して出力する方法を説明。

Vorlon.js入門

Vorlon.jsとは? ブラウザーでWebデバッグできるお手軽な開発者ツール

Vorlon.jsという開発者ツールを知っているだろうか? このオープンソースツールを使えば、PCブラウザーで各種Webデバッグが行える。その機能概要と基本的な使い方を解説。

AngularJS TIPS

配列の内容を順に出力するには?(ng-repeat)

配列の内容を順に処理して出力できるng-repeatディレクティブの基本的な使い方を説明する。

jQuery逆引きリファレンス

jQueryプラグインを自作するには?($.fn)

何度も利用する似たコードは、ライブラリではなくプラグインにまとめよう。プラグイン作成の基本を解説。

AngularJS TIPS

交互に異なるスタイルクラスを適用するには?(ng-class-odd/ng-class-even)

ng-class-even/ng-class-oddディレクティブを使って、表の行などの繰り返しデータの偶数行もしくは奇数行に対し、スタイルを設定・変更する方法を説明する。

HTML TIPS

最新のHTML5/CSS/JavaScript API/CSS機能が使えるかを判断するには?

HTML5.1などの最新仕様を使いたい場合、それが対象ブラウザーでも使えるかどうかを判断する方法を説明。実際に試す前に「Can I use」の情報を確認しよう。

AngularJS TIPS

要素のスタイルクラスを操作するには?(ng-class)

スタイル定義をスタイルシートに分離したうえで、ng-classディレクティブを使って要素のクラス属性によりスタイルを設定・変更する方法を説明する。

jQuery逆引きリファレンス

特定の要素に関連付くデータを取得/設定するには?(data)

現在の要素に対して任意のデータを設定/取得するためのdataメソッドの基本と、利用上の注意点を解説する。

AngularJS TIPS

要素のスタイルプロパティを操作するには?(ng-style)

ng-styleディレクティブを使って、要素のスタイル(style属性)を設定・変更する方法を説明する。

AngularJS TIPS

配列からm~n件目の要素を取り出すには?(limitTo)

limitToフィルターを使って、配列の先頭から指定された件数だけ要素を取り出す方法を説明。応用例としてページング処理を実装する。

jQuery逆引きリファレンス

JavaScriptとHTMLを明確に分離するには?(data)

jQueryのdataメソッドを使って独自データ属性の値を取得することにより、「控えめなJavaScript」を実現する方法を説明する。

AngularJS TIPS

日付/時刻データを整形するには?(date)

dateフィルターを使って、日付/時刻データを任意の書式に変換する方法を説明する。ロケールの指定方法についても解説。

C#エンジニアのためのBigQuery入門(3)

LINQ to BigQueryによるクエリ実行

C#プログラマーにおなじみのLINQでBigQueryのクエリを実行するライブラリを紹介。

jQuery逆引きリファレンス

要素にフォーカスが当たった/外れた時の処理を実装するには?(focus、blur、focusin、focusout)

focus/blurもしくはfocusin/focusoutを使って、テキストボックスにフォーカスを当てた時/外した時に処理を実施する方法を説明。またそれらの挙動の違いを解説する。

AngularJS TIPS

数値(単数/複数)によって表示を切り替えるには?(ng-plurlize)

ng-plurizeディレクティブやngMessageFormatモジュールを使うことで、変数の値によってメッセージ内容を切り替える方法を説明する。

プロ生ちゃんと学ぶ! TypeScript入門(3)

TypeScriptの機能と文法、まずはこの3つを押さえよう! 構造的部分型、ジェネリクス、アロー関数式

TypeScriptには多くの機能や文法があり、最新の1.5~1.6でさらに追加された。開発の実践を始める前に、数ある機能の中から最低限、「構造的部分型」「ジェネリクス」「アロー関数式」の3つを押さえておこう。

AngularJS TIPS

式の値によって表示を切り替えるには?(ng-switch)

ng-switchディレクティブを使って、与えられた式の値に応じて、表示すべきコンテンツを切り替える方法を説明する。

jQuery逆引きリファレンス

アニメーションの細かな挙動を制御するには?(animate/show/hide/fadeIn/fadeOut/slideUp/slideDown)

各種アニメーションメソッドで、アニメーションを直列/並列に実行したり、アニメーション処理ごとに関数を実行したり、プロパティ単位でアニメーションのイージングを設定したりする方法を説明。

AngularJS TIPS

JavaScriptオブジェクトをJSON形式に変換するには?(json)

jsonフィルターを使って、JavaScriptオブジェクトをJSON形式に変換する方法を説明する。

AngularJS TIPS

自作の検索条件/比較ルールで配列を検索するには?(filter)

任意の条件で配列を絞り込むためのフィルターである「filter」の応用的な使い方として、検索条件や比較ルールをカスタマイズする方法を解説する。

jQuery逆引きリファレンス

自作のアニメーションを実行するには?(animate)

animateメソッドを使って、典型的なアニメーションではなく、カスタムのアニメーションを定義する方法を説明する。

AngularJS TIPS

配列の内容をフィルターするには?(filter)

任意の条件で配列を絞り込むためのフィルターである「filter」の基本的な使い方を解説。否定や完全一致などさまざまな条件でのフィルタリング方法も紹介する。

jQuery逆引きリファレンス

実行都度、逆のアニメーションを実行するには?(toggle/fadeToggle/slideToggle)

jQueryが提供する基本的なアニメーション機能を活用して、スライドアップ⇔スライドダウンを交互に実行する方法を説明する。

AngularJS TIPS

独自の規則で配列をソートするには?(orderBy)

独自の並べ替え規則を使って、配列の内容の並べ替える方法を解説。逆順や、複数キーの指定に独自のソートルールを使う方法も紹介する。

AngularJS TIPS

配列をソートするには?(orderBy)

配列の内容を、指定されたキーで並べ替える方法を解説。逆順や、複数のキーを指定してソートする方法も紹介する。

jQuery逆引きリファレンス

あらかじめ用意されたアニメーションを実行するには?(show/hide/fadeIn/fadeOut/slideUp/slideDown)

jQueryが提供する基本的なアニメーション機能を活用して、要素を表示/非表示、フェードイン/アウト、スライドアップ/ダウンさせる方法を説明する。

AngularJS TIPS

数値データに桁区切り文字を付けるには?(number/currency)

数値データを、ロケール別の桁区切り文字列に整形したり、ロケール別の通貨記号を付加したりして出力する方法を説明する。

AngularJS TIPS

文字列を大文字/小文字に変換するには?(lowercase/uppercase)

lowercase/uppercaseフィルターを使って文字列を大文字や小文字に変換する方法を解説。また、JavaScriptコードから変換する場合に使える$filterサービスとangular.lowercase/angular.uppercaseメソッドについても紹介する。

jQuery逆引きリファレンス

非同期通信で取得したコンテンツをページに反映させるには?(load)

loadメソッドを使って、外部のWebページを非同期に取得して、それをコンテンツ内の要素に反映させる方法を説明する。

AngularJS TIPS

入力値のモデルへの反映タイミングを変更するには?(ng-model-options)

AngularJSのデータバインディング機能により入力値がモデルに反映されるのを、指定したミリ秒数後やフォーカスが外れたときまで遅延させる方法を説明する。

C#エンジニアのためのBigQuery入門(2)

BigQuery API(Client Library)を用いたクエリ実行

BigQueryをより便利に使うために、C#プログラムからAPIを利用する方法を紹介する。

AngularJS TIPS

別ファイルやJavaScriptでメッセージを管理するには?(ng-message-include/ng-message-exp)

ng-messages属性で使用するメッセージを、ページ内でテンプレート化したり、外部ファイル化したりして効率的に管理する方法を説明する。

jQuery逆引きリファレンス

イベント処理を中断するには?(preventDefault/stopPropagation/stopImmediatePropagation)

イベントリスナーによる処理を、イベントオブジェクトの3つのメソッドを使って中断する方法を説明する。また、それぞれの使い分け方法も解説する。

AngularJS TIPS

式の真偽に応じて表示を切り替えるには?(ng-messages/ng-message)

条件式の値に応じてメッセージの表示/非表示を切り替えるために(例えばエラー時にメッセージ表示するなど)、ng-messages/ng-message属性を使用する方法を解説する。

AngularJS TIPS

入力フォームに検証機能を実装するには?(form/input)

標準的な<input>要素を拡張して入力フォームに検証機能を付ける方法を説明する。

jQuery逆引きリファレンス

イベントが発生した時のマウス情報を取得するには?(イベントオブジェクト)

クリックした位置の座標や、押されたマウスボタンの種類といったマウス情報を、イベントオブジェクトの各種プロパティを使って取得する方法を説明する。

AngularJS TIPS

URL/メールアドレスからハイパーリンクを生成するには?(linky)

URL/メールアドレスの文字列データをアンカータグによるリンクに整形できるlinkyフィルターの基本的な使い方を説明する。

AngularJS TIPS

入力された区切り文字を配列に変換するには?(ng-list)

テキストボックスへの入力値を特定の区切り文字で分割して文字列の配列に変換するために、ng-list属性を使用する方法を解説する。

jQuery逆引きリファレンス

一度だけ実行されるイベントリスナーを設置するには?(one)

登録されたイベントリスナーを最初の一度だけ実行するoneメソッドの基本的な使い方を解説する。

AngularJS TIPS

要素の表示/非表示を切り替えるには?(ng-show/ng-hide/ng-open)

真偽条件に応じて要素の表示/非表示を切り替えるために、ng-show/ng-hide属性を使用する方法を解説する。また、<details>要素の表示/非表示を切り替えるng-open属性の使い方も紹介する。

プロ生ちゃんと学ぶ! TypeScript入門(2)

TypeScriptの基本のキ。JavaScriptをベースに「TypeScriptをつまみ食い」しよう!

TypeScriptの基本中の基本である「型」「クラス」「インターフェース」をプロ生ちゃんと学ぼう。「今、TypeScriptやって損しない?」という疑問・不安についても回答する。

jQuery逆引きリファレンス

マウスポインターが要素に出入りした時の処理を実装するには?(mouseover、mouseout、mouseenter、mouseleave、hover)

違いが分かりにくい「mouseover/mouseout」と「mouseenter/mouseleave」イベントの使い分け方法を解説。また、これらに関連する「hover」イベントメソッドについても説明する。

C#エンジニアのためのBigQuery入門(番外編)

Google API Client Library for .NETの使い方

BigQueryをはじめ、GoogleのほとんどのサービスはAPIが提供されている。これを.NETから利用するためのライブラリの基本的な使用方法を解説する。

AngularJS TIPS

条件式の真偽に応じて表示を切り替えるには?(ng-if)

真偽条件に応じて要素の表示/非表示を切り替えるために、ng-if属性を使用する方法を解説する。

jQuery逆引きリファレンス

イベントリスナーを呼び出す際にパラメーターを引き渡すには?(data)

イベントメソッドやonメソッドの呼び出し時に、任意のパラメーターを引き渡す方法を解説する。

AngularJS TIPS

ハイパーリンクを動的に生成するには?(ng-href)

スコープオブジェクト経由で動的に生成したハイパーリンクのURL設定が適切に処理されるように、ng-href属性を使用する方法を解説する。

jQuery逆引きリファレンス

文書ツリー上に存在しない要素に対してイベントリスナーを追加するには?(on)

onメソッドを利用して、動的に新規追加された要素にイベントリスナーを設置する方法を解説。またjQuery 1.6以前のbind/live/delegateメソッドをonメソッドに置き換える方法も説明する。

プロ生ちゃんと学ぶ! TypeScript入門(1)

TypeScriptってどんなもの? プロ生ちゃんと始めてみよう!

TypeScriptが気になる人は、本連載で楽しく優しく学ぼう。TypeScriptの特徴から、Atomエディター開発環境の構築まで紹介。

AngularJS TIPS

イベントリスナーを登録するには?(ng-clickなど)

AngularJSで、ディレクティブを使ってイベントリスナーを設定する方法を解説。また、イベントリスナーにイベントオブジェクトを渡して参照する方法も説明する。

jQuery逆引きリファレンス

イベントメソッドで提供されないイベントを処理するには?(on)

onメソッドを利用して、jQueryが標準で対応していないJavaScriptイベントにアクセスする方法を説明する。

AngularJS TIPS

ビューにHTML文書をバインドするには?(ng-bind-html)

文字列をデータバインドした際に、標準で実施されるサニタイズ処理について紹介。また、サニタイズせずにHTMLのままのビューに反映させる方法も説明する。

C#エンジニアのためのBigQuery入門(1)

誰でも簡単に超高速なクエリができるBigQueryとは?

知らないと損! 使わないと損! これからのデータ解析に必須のBigQueryの概要を紹介。また、Webコンソールからのクエリ実行の基礎を解説する。

jQuery逆引きリファレンス

イベントに応じて処理を実行するには?(イベントメソッド)

イベントの発生に応じて呼び出されるイベントリスナーをjQueryで実装するための基本的な方法を解説する。

AngularJS TIPS

モデルをビューにバインドするには?(ng-bind/ng-cloak)

エクスプレッションが一瞬表示されてしまう不具合を解消して、AngularJSの双方向データバインディングを実現する方法を説明する。

Azure TIPS

Azure WebsitesのWebホスティングプランを変更するには?(+使い分け指針)

Azure Websitesの無料/共有/基本/標準というホスティングプランはどれを選択すればよいのか? またその選択方法を説明する。

jQuery逆引きリファレンス

配列の内容を検索するには?($.inArray)

$.inArrayメソッドを使って、配列から特定の要素を検索する方法を解説。Internet Explorer 8以前の環境ではJavaScriptのindexOfメソッドをこれで代替しよう。

AngularJS TIPS

モデルをテキストボックスなどのフォーム要素にバインドするには?(ng-model)

ビューの変更をモデルに反映させ、逆にモデルの変更をビューに反映させる、AngularJSの双方向データバインディングの基本を解説する。デフォルト値の設定方法も説明。

jQuery逆引きリファレンス

配列から特定の条件で要素を取り出すには?($.grep)

$.grepメソッドを使って、配列から条件に合致した要素だけを取り出す方法を解説。Internet Explorer 8以前の環境ではJavaScriptのfilterメソッドをこれで代替しよう。

AngularJS TIPS

AngularJSの依存性注入を利用するには?

AngularJSに標準搭載されているDIコンテナー機能を使って、依存性を注入するためのさまざまな方法を解説する。

jQuery逆引きリファレンス

配列の内容を順番に加工するには?($.map)

$.mapメソッドを使って、配列やオブジェクトの内容を順に加工する方法を解説。Internet Explorer 8以前の環境ではJavaScriptのmapメソッドをこれで代替しよう。

AngularJS TIPS

AngularJSでコントローラーを定義するには?

AngularJSアプリの最も基本的な構成要素である「コントローラー」の基礎として、コントローラー経由でスコープを準備し、テンプレートに反映させる方法を説明する。

jQuery逆引きリファレンス

配列の内容を順番に処理するには?($.each)

$.eachメソッドを使って、配列やオブジェクトの内容を順に処理する方法を解説。またJavaScriptのevery/someメソッドを、jQueryの$.eachで代替する方法も説明する。

Microsoft Edge(旧Project Spartan)概説(Windows 10 January Preview Build)

Windows 10に搭載される新ブラウザー“Microsoft Edge(旧Spartan)”とは?(Web制作者視点)

Spartanとは何か? IEはどうなるのか? Web制作への影響は? また、これらの疑問の鍵を握る「レンダリングエンジン」についてもまとめる。

AngularJS TIPS

AngularJSでモジュールを定義するには?

コード規模が大きくなればモジュール化が必要になる。AngularJS専用として提供される「モジュール」の基礎を解説する。

jQuery逆引きリファレンス

変数の型情報を判定するには?($.isXxxxx/$.type)

$.isXxxxxメソッドを使って、変数のデータ型を判定する方法を解説。また、$.typeメソッドを使って、引数で指定されたオブジェクトの型を文字列として返す方法も解説する。

今、人気のJSライブラリ[ジャンル別に比較]

人気上昇中のJavaScriptライブラリを調べてみた【2015年版】

altJSの人気が混戦で面白い! 2014年中に人気が急上昇してきており、「2015年では必須の知識」となりそうなJavaScriptライブラリをランキング形式で発表。

HTML TIPS

HTML標準仕様などを決める、W3Cによる勧告のプロセスとは?

W3Cが制定するWeb標準の技術文書では、最初の「草稿」から、最終段階の「勧告」になるまで、いくつかのステップを踏む。そのプロセスについて簡単に説明する。

AngularJS TIPS

AngularJSを利用するには?

クライアントサイド開発でも、本格的なアプリケーションフレームワークを利用しよう。世界中で人気爆発中のAngularJSの基本機能を目的別リファレンスの形式でまとめる連載スタート。

jQuery逆引きリファレンス

要素の高さ/幅を設定/取得するには?(height/width/innerHeight/innerWidth/outerHeight/outerWidth)

任意の要素に対して幅/高さを設定/取得する方法を解説。また、height/width、innerHeight/innerWidth、outerHeight/outerWidthメソッドの使い分け方法も説明する。

エッジなWebエンジニアのためのブラウザー情報源

Chrome 39で追加されたGenerators機能とは

11月18日に公開されたChrome 39安定版の新機能を紹介。C#やRubyでおなじみのyieldキーワードが使えるようになった。

jQuery逆引きリファレンス

要素のプロパティを取得/設定するには?(prop)

任意の要素に対してJavaScriptのプロパティを設定/取得する方法を解説。また、要素の属性を設定/取得できるattrメソッドと機能を比較する。

書籍転載:ASP.NET MVC 5 実践プログラミング

開発者に人気のCSSフレームワーク「Bootstrap」入門

「レスポンシブデザインに対応したグリッドシステム」などの特長で、特に開発者に人気のCSSフレームワーク「Bootstrap」について解説する。書籍転載の27本目(応用編「8-2-5」)。転載は今回で終了。

jQuery逆引きリファレンス

要素の属性を操作するには?(attr/removeAttr)

任意の要素の、任意の属性に対して値を設定/取得する方法を解説。また、複数の属性をまとめて設定する方法も説明する。

書籍転載:ASP.NET MVC 5 実践プログラミング

LINQ:エンティティ同士を結合する - join句[C#]

特定のキー列でエンティティ同士を結合し、複数のエンティティをまとめて取得するためのjoin句/Joinメソッドについて解説する。書籍転載の26本目(基礎編「5-3-9」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

LINQ:データをグループ化する - group句[C#]

特定のキー列でデータをグループ化するためのgroup句/GroupByメソッドについて解説する。書籍転載の25本目(基礎編「5-3-8」)。

Azure TIPS

Traffic Managerを利用してAzure Webサイトへの負荷を分散するには?

Traffic Managerを使えば、単体のWebサイトのインスタンス数を増やす方法よりも高度な負荷分散が実現できる。3種類の負荷分散方法のうち「パフォーマンス」の方法を説明。

jQuery逆引きリファレンス

要素にスタイルクラスを適用/除外するには?(addClass/removeClass/toggleClass/hasClass)

要素にclass属性の値を設定/削除する方法を解説。また、その設定状態を切り替えたり、確認したりする方法も説明する。

書籍転載:ASP.NET MVC 5 実践プログラミング

LINQ:先頭のデータを取得する - Firstメソッド[C#]

クエリ後の結果セットから先頭のデータを取得するためのFirstメソッドについて解説する。書籍転載の24本目(基礎編「5-3-7」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

LINQ:特定範囲のデータだけを取得する - Skip/Takeメソッド[C#]

指定された件数だけデータを読み飛ばすためのSkipメソッドと、指定された件数のデータだけを取得するためのTakeメソッドについて解説。書籍転載の23本目(基礎編「5-3-6」)。

jQuery逆引きリファレンス

要素のスタイルプロパティを変更するには?(css)

背景色を変えるなど、要素のスタイルを変更できるcssメソッドの基本的な使い方を解説。相対値の指定や複数まとめて指定、現在の値の取得なども説明する。

書籍転載:ASP.NET MVC 5 実践プログラミング

LINQ:重複のないデータを取得する - Distinctメソッド[C#]

クエリ後の結果セットから重複したデータを除去するためのDistinctメソッドについて解説する。書籍転載の22本目(基礎編「5-3-5」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

LINQ:取得列を明示的に指定する - select句/SelectManyメソッド[C#]

範囲変数(エンティティ)から特定のプロパティだけを取り出したり、プロパティ値を加工したりするためのselect句/Selectメソッドについて解説。書籍転載の21本目(基礎編「5-3-4」)。

jQuery逆引きリファレンス

要素配下のテキストを取得/設定するには?(text/html)

textメソッドやhtmlメソッドを使って要素配下のテキストやHTMLソースを取得する方法を解説。それぞれの使い分けについても説明する。

書籍転載:ASP.NET MVC 5 実践プログラミング

LINQ:データを並べ替える - orderby句[C#]

取得したデータを並べ替えるためのorderby句/OrderByメソッドについて解説する。書籍転載の20本目(基礎編「5-3-3」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

LINQ:データの検索条件を指定する - where句[C#]

クエリ後の結果セットをフィルターするためのwhere句/Whereメソッドについて解説する。書籍転載の19本目(基礎編「5-3-2」)。

jQuery逆引きリファレンス

以前のバージョンで開発したアプリを最新のjQueryで動作させるには?

基本的に旧バージョンのjQueryで作成したページは最新版でも動作するが、jQuery 1.9以前から最新化する場合には動作しない場合がある。その問題を回避できるjQuery Migrateプラグインの基本的な使い方を説明する。

書籍転載:ASP.NET MVC 5 実践プログラミング

LINQとは?[C#]

LINQ to Entitiesの説明に入る前に、まずはC#の言語機能として組み込まれたクエリ機能「LINQ」について簡単に紹介する。書籍転載の18本目(基礎編「5-3-1」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

モデル単位にテンプレートを決定する - DisplayForModel/EditorForModelメソッド[Razor]

プロパティ単位ではなくモデル単位でHTMLコードを出力するDisplayForModel/EditorForModelメソッドについて解説。また、そのテンプレートを自作する方法を説明する。書籍転載の17本目(基礎編「4-4-4」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

テンプレートのカスタマイズ|テンプレートを決定する方法[Razor]

テンプレートヘルパーでは、特定のデータ型/メタ情報に応じた独自のテンプレートを用意して、独自の出力を生成することもできる。その方法を解説する。書籍転載の16本目(基礎編「4-4-2」「4-4-3」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

テンプレート関連のビューヘルパー|テンプレートの標準の挙動[Razor]

「テンプレートヘルパー」とも呼ばれるDisplayFor/EditorForメソッドについて紹介。また、テンプレートヘルパーの標準的な挙動を確認する。書籍転載の15本目(基礎編「4-4-1」)。

jQuery逆引きリファレンス

jQueryを利用するには?

jQueryの特徴を簡単に紹介。jQueryライブラリをCDNから、もしくはローカルにダウンロードしてから利用する方法を説明する。

Google Chrome Developer Tools(DevTools)入門

Web開発でよく使う、特に使えるChromeデベロッパー・ツールの機能

Webアプリのデバッグやチューニングに役立つ、Chrome Developer Toolsの主要機能を、スクリーンキャプチャ中心で簡潔に紹介。2014年10月に最新情報に改訂。

書籍転載:ASP.NET MVC 5 実践プログラミング

HTMLエンコードを無効にする - Html.Rawメソッド[Razor]

デフォルトで実行されるHTML予約文字のエスケープ処理を無効にして生のままHTMLコードを出力するためのHtml.Rawメソッドについて解説。書籍転載の14本目(基礎編「4-3-4」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

アプリケーションルートからの絶対パスを生成する - Url.Content/Action/RouteUrlメソッド[Razor]

リソース指定は、相対パスよりも、アプリケーションルートからの絶対パスの方がよい。そのような絶対パスを生成するUrlオブジェクトの機能を解説。書籍転載の13本目(基礎編「4-3-3」)。

Azure TIPS

VM Depotを利用して素早く開発環境を構築するには?

LAMP環境やRuby Stackなどの多数のイメージが用意されている「VM Depot」を利用して、Linuxなどの仮想マシン環境を手軽に構築する方法を説明する。

書籍転載:ASP.NET MVC 5 実践プログラミング

ルート定義からハイパーリンクを生成する - RouteLinkメソッド[Razor]

リンク先のルートパラメーターを指定したアンカータグを生成できるRouteLinkメソッドの使い方を解説。書籍転載の12本目(基礎編「4-3-2」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

リンク/エンコード関連のビューヘルパー|ハイパーリンクを生成する - ActionLinkメソッド[Razor]

リンク/エンコード関連のビューヘルパー紹介の1つ目として、アンカータグを生成するためのメソッドの基本的な使い方を解説する。書籍転載の11本目(基礎編「4-3-1」)。

エッジなWebエンジニアのためのブラウザー情報源

Chrome 38で<picture>要素のメディアクエリ対応と、JavaScriptのMap/Setオブジェクト&for-ofループ機能追加

<picture>要素ではレスポンシブUIに使えるメディアクエリが記述できるようになった。JavaScriptではコレクション用のMap/Setオブジェクトや、値を受け取って順次処理できるfor-ofループが追加された。

jQuery Mobile逆引きリファレンス

モバイル端末を縦横回転させたときにレイアウトを調整するには?

端末の回転を検知できるorientationchangeイベントを説明して、端末が縦置きの場合は縦並びに、横置きの場合は横並びに表示する方法を説明する。

Internet ExplorerのF12開発者ツールの使い方

Web制作で使いこなしたいIE開発者ツールの最新機能

強化された新機能を中心に、最新のF12開発者ツールの主要機能を一通り解説。このツールを使いこなすためのポイントを取り上げる。

書籍転載:ASP.NET MVC 5 実践プログラミング

Label/TextBox/TextArea/Password/Hidden/ RadioButton/CheckBoxメソッド[Razor]

XxxxxForメソッドとは異なり、「For」なしのメソッドは、モデルから独立したフォーム要素を生成できる。その使い方を解説。書籍転載の10本目(基礎編「4-2-7」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

ASP.NET MVC 5.2: 選択ボックスの選択肢をグループ化する - SelectListクラス[Razor]

ASP.NET MVC 5.2以降。Razorで、選択肢をグルーピングした選択ボックスを生成するにはSelectListクラスを使用する。その使い方を解説。書籍転載の9本目(基礎編「4-2-6」)。

jQuery Mobile逆引きリファレンス

スクロール時に追加的にコンテンツを読み込むには?

スクロールの開始/終了のタイミングで発生するscrollstart/scrollstopイベントの基本的な使い方を説明。また、画面を縦方向にスクロールするためのsilentScrollメソッドについても紹介する。

書籍転載:ASP.NET MVC 5 実践プログラミング

ASP.NET MVC 5.1: 列挙型から選択ボックスを生成する - EnumDropDownListメソッド[Razor]

ASP.NET MVC 5.1以降。列挙型の情報をもとに選択ボックスを生成するEnumDropDownListメソッドの使い方を解説。書籍転載の8本目(基礎編「4-2-5」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

選択ボックス/リストボックスを生成する - DropDownListFor/ListBoxForメソッド[Razor]

DropDownListFor/ListBoxForメソッドを使って、単一選択式の選択ボックスや複数選択式のリストボックスを生成する方法を解説。書籍転載の7本目(基礎編「4-2-4」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

TextBoxFor/TextAreaFor/PasswordFor/ HiddenFor/RadioButtonFor/CheckBoxForメソッド[Razor]

モデル内の各プロパティのデータ型や値などの情報に基づいて、テキストボックス、ラジオボタンなどの要素を生成できるXxxxxForメソッドの使い方を解説。書籍転載の6本目(基礎編「4-2-3」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

ルート定義からフォームを生成する - BeginRouteFormメソッド[Razor]

ポスト先のルートパラメーターを指定した<form>要素を生成できるBeginRouteFormメソッドの使い方を解説。書籍転載の5本目(基礎編「4-2-2」)。

jQuery Mobile逆引きリファレンス

data-defaults/data-enhanced属性でページの描画を高速化するには?

jQuery Mobileでパフォーマンスを改善する方法を解説。ウィジェットの動作パラメーターをデフォルト設定して解釈処理をスキップする方法と、文書ツリーの一部を手書きして自動生成をスキップする方法について紹介する。

書籍転載:ASP.NET MVC 5 実践プログラミング

フォームを生成する - BeginFormメソッド[Razor]

<form>要素を生成するには、標準のビューヘルパーとして提供されているBeginFormメソッドが便利だ。その使い方を解説。書籍転載の4本目(基礎編「4-2-1」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

Razor構文

ASP.NET MVCのビュー開発では「Razor」ビューエンジンを利用するのが基本。そのRazorの基本的な文法を解説。書籍転載の3本目(導入編「4-1」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

ASP.NET MVCとは?

なぜASP.NET MVCを使うとよいのか? Webフォームの問題点を示し、ASP.NET MVCの特徴とメリットを紹介する。書籍転載の2本目(導入編「1-2」)。

書籍転載:ASP.NET MVC 5 実践プログラミング

ASP.NETの全体像

ASP.NET上で動作するWebアプリケーションフレームワーク「ASP.NET MVC」とは? その全体像と6つの構成要素について紹介する。書籍転載の1本目(導入編「1-1」)。

Azure TIPS

Azure Webサイトをバックアップするには?

Azure Webサイトでは、Webサイトとデータベースをバックアップ/復元するための機能が提供されている。その機能の基本的な使い方を解説する。

jQuery Mobile逆引きリファレンス

ページレイアウトが変更したときに処理を実行するには?

ウィジェットのレイアウト状態が変化したとき(例えば開閉パネルが開いた/閉じたときなどに)、処理を実行する方法を説明する。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

Excelファイルを作成/操作する(PHPExcel)

Excelファイルを作成/操作できるライブラリ「PHPExcel」の基本的な使い方を説明する。書籍転載の17本目(書籍内の番号は「36」)。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

ExcelファイルをHTMLとして表示する(php-excel-reader)

Excelファイルを読み込んで、HTMLのテーブルとして出力するライブラリ「php-excel-reader」の基本的な使い方を説明する。書籍転載の18本目(書籍内の番号は「67」)。

Azure TIPS

Azure Webサイトにカスタムドメインを設定するには?

Microsoft Azure Web Sitesで独自ドメイン名を適用する方法を説明する。CNAMEレコードだけでなく、wwwなしのネイキッドドメインが実現可能なAレコード(IPアドレス)も指定できる。

jQuery Mobile逆引きリファレンス

ページのロード/切り替え時に初期化/後処理を実行するには?

ページを表示/切り替えするタイミングで発生するイベントにはどのようなものがあるのか。ページイベントの基本的な利用方法を説明する。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

さまざまなグラフを動的に生成する(実行編)(JpGraph)

グラフ作成ライブラリJpGraphを使って、棒グラフ、折れ線グラフ、レーダーチャートを作成する方法を説明する。書籍転載の16本目(書籍内の番号は「25」)。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

さまざまなグラフを動的に生成する(準備編)(JpGraph)

グラフ作成ライブラリ「JpGraph」を利用するまでの準備手順を説明する。書籍転載の15本目(書籍内の番号は「24」)。

連載:コードから触るIIS 8

Webファームによる負荷分散(3):HTTPSとWebファームの関連

IISで構築したWebファーム内における複数台のサーバーでHTTPSを有効にする場合、どんな方法があるのか? 各方法によるサーバー構成を、PowerShellを用いて行う方法を解説する。連載最終回。

jQuery Mobile逆引きリファレンス

JavaScriptからjQuery Mobileページ間の移動を制御するには?

通常のページ遷移ではlocation.hrefプロパティを利用するが、jQuery Mobileのページ遷移ではchangeメソッドやloadメソッドを利用する。その基本的な使い方を説明する。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

markdown形式のテキストをHTMLに変換する(PHP Markdown)

Markdown形式のファイルをHTML形式のコードに変換するためのライブラリ「PHP Markdown」の基本的な使い方を説明する。書籍転載の14本目(書籍内の番号は「38」)。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

テンプレートでデータ加工や条件分岐/繰り返し処理を表現する(Smarty)

関数、修飾子、演算子など、Smartyで利用できるテンプレートの個別要素について詳しく解説する。書籍転載の13本目(書籍内の番号は「42」)。

jQuery Mobile逆引きリファレンス

JavaScriptからフォーム要素を操作するには?

フォーム関連を自前で記述する場合、jQueryの知識を生かせるが、jQuery Mobile固有の注意点もある。その注意点を解説する。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

テンプレートエンジンの動作パラメーターを一元管理する(Smarty)

効率化のために、Smarty派生クラスを用意して、パラメータなどの設定はそこに押し込めてしまう方法を説明する。書籍転載の12本目(書籍内の番号は「41」)。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

テンプレートエンジンでロジックとレイアウトを分離する(Smarty)

PHPで人気のテンプレートエンジン「Smarty」の基本的な使い方を説明する。書籍転載の11本目(書籍内の番号は「40」)。

Azure TIPS

Azure WebサイトのSite Extensions「DaaS」で各種ログを手軽に収集・解析するには?

“Diagnostic as a Service”(DaaS)を利用して、エラーログ、メモリダンプ、HTTPログを一括で収集し、解析を行う方法を説明する。

jQuery Mobile逆引きリファレンス

$.mobile.pathオブジェクトでパス/URLの情報を取得/操作するには?

パスやURLを取得/操作するには、$.mobile.path.xxxxxメソッドが利用できる。各メソッドの基本的な使い方を解説する。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

PDFファイルを読み込む/生成する(Zend_Pdf)

PDFファイルの読み込みや生成が容易にできるライブラリ「Zend¥Pdf」の基本的な使い方を説明する。書籍転載の10本目(書籍内の番号は「32」)。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

既存のPDF文書をもとに新たなPDF文書を生成する(FPDI)

FPDIを使って、既存のPDF文書をテンプレートとして引用する方法を説明する。書籍転載の9本目(書籍内の番号は「31」)。

jQuery Mobile逆引きリファレンス

jQuery Mobileの動作パラメーターを設定するには?

jQuery Mobileやウィジェットの動作を変更できる「動作パラメーター」の基本的な使い方を解説する。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

表組みや画像/ハイパーリンク付きのPDFを作成する(FPDF)

FPDF(PDF_Japanese)クラスのメソッドを利用したさまざまな表現――文字列の装飾や画像の貼り付け、リンクの設置、表組みなどについて説明する。書籍転載の8本目(書籍内の番号は「30」)。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

PDF文書を動的に生成する(FPDF)

PHPスクリプトからPDF文書を動的に生成できるFPDFの基本的な使い方を説明する。書籍転載の7本目(書籍内の番号は「29」)。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

FuelPHPで画面を表示する/DBを利用する

FuelPHPが提供する「HTMLを生成するのに便利なメソッド」や「DBの利用時にSQLを記述せずにCRUD操作が行えるクラス」について解説する。書籍転載の6本目(書籍内の番号は「97」)。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

高速で軽量なフレームワークFuelPHPを使う

高度なWebアプリ開発に向いている、高速で軽量なフレームワーク「FuelPHP」の基本的な使い方を説明する。書籍転載の5本目(書籍内の番号は「96」)。

jQuery Mobile逆引きリファレンス

Sliderウィジェットで、スライダーを作成するには?

つまみをスライドして値を簡単に選択できるスライダーを作成するためのSliderウィジェットの基本的な使い方を説明する。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

CakePHPのモデルとビューを利用する

CakePHPのモデルを定義して、ビューと組み合わせる方法を説明。また、Formヘルパーを使って入力チェックなどを行う方法も解説する。書籍転載の4本目(書籍内の番号は「95」)。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

MVCフレームワークを使ってアプリケーションを作成する(CakePHP)

PHPのMVCフレームワークとして人気のある「CakePHP」の基本的な使い方を説明する。書籍転載の3本目(書籍内の番号は「94」)。

jQuery Mobile逆引きリファレンス

Filterableウィジェットによる検索ルールをカスタマイズするには?

リスト/テーブルなどに検索機能を付与できるFilterableウィジェット。その検索機能をカスタマイズする方法を解説する。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

Webスクレイピングを行う(Goutte)

HTMLから必要なデータを抽出する「Webスクレイピング」を手軽に行えるライブラリ「Goutte」の基本的な使い方を説明する。書籍転載の2本目(書籍内の番号は「88」)。

書籍転載:PHPライブラリ&サンプル実践活用[厳選100]

スクレイピング/DOM操作をjQuery風に行う(phpQuery)

Webサイトから情報を抽出する「Webスクレイピング」や、HTML内の各要素にアクセス/操作する「DOM操作」を、phpQueryを使ってjQuery風に行う方法を説明する。書籍転載の1本目(書籍内の番号は「70」)。

Azure TIPS

Azure Webサイトのデプロイ・ロジックをカスタマイズするには?

Azure Webサイトでは、さまざまなWebアプリをGitでデプロイできるだけでなく、そのデプロイ・ロジックを自由にカスタマイズすることもできる。そのカスタマイズ方法を解説する。

jQuery Mobile逆引きリファレンス

Filterableウィジェットでリスト/テーブルなどに検索機能を付与するには?

リストやテーブル、ボタングループ/選択ボックスなど、任意の要素グループに対して検索機能を付与できるFilterableウィジェットの基本的な使い方を解説。

jQuery Mobile逆引きリファレンス

ListViewウィジェットで、アイコン付き、カウントバブル付きのリストビューを生成するには?

ListViewウィジェットを使って作成したリストに対して、サムネイル/アイコン画像やカウントバブル、見出し/補足情報を追加する方法を説明する。

いまさら聞けない最新Microsoft Azure

ここまで進化した、Azure Webサイトの世界観(2014年7月版)

IaaSからPaaSまで多様なサービスを提供するAzureの中でも特に重要性が増してきている「Webサイト」とは? その世界観を特徴付ける主要な機能を解説する。

連載:コードから触るIIS 8

Webファームによる負荷分散(2): IISマネージャー/コードによる操作

Webファームに備えられている機能とは? IISマネージャーによるWebファームの操作や、コードによる操作について説明する。

jQuery Mobile逆引きリファレンス

ListViewウィジェットで作成したリストに区切り線を追加するには?

リスト項目をある固まりごとに区分けして視認性を高めたい場合にはデバイダー(=区切り線)を使用する。その追加方法を説明する。

jQuery Mobile逆引きリファレンス

ListViewウィジェットで階層型リストを作成するには?

初期状態では最上位の項目だけを表示して、そこから下位階層の項目にドリルダウンできる、階層化リストを作成するには、NestedListプラグインを使う。その利用方法を解説。

jQuery Mobile逆引きリファレンス

ListViewウィジェットで、ネイティブアプリ・ライクなリストビューを作成するには?

<ul>/<li>要素や<ol>/<li>要素をネイティブアプリで見かけるようなリッチなリストに整形できるListViewウィジェットの基本的な使い方を解説。

jQuery Mobile逆引きリファレンス

Textinputウィジェットでテキスト入力ボックスを設置するには?

jQuery Mobileでテキスト入力ボックスを設置するのは通常のフォームの場合と変わらない。それだけで角丸やシャドウ効果の効いた、ネイティブアプリ・ライクなテキストボックスへと整形してくれる。その内容を解説する。

書籍転載:Ruby on Rails 4アプリケーションプログラミング

Apache+Passenger環境/Heroku環境への、Railsアプリの配置

書籍転載の最終回。開発したRailsアプリを本番環境へ配置する方法について説明する(「Part 3《応用編》 第10章 Railsの高度な機能」より)。

jQuery Mobile逆引きリファレンス

jQuery Mobileで入力フォームを設置するには?

jQuery Mobileでフォームを設置する際の、よりjQuery Mobileらしいフォームを実装するために知っておきたいポイントと特性方法を説明する。

書籍転載:Ruby on Rails 4アプリケーションプログラミング

Sass(SCSS)入門

CSSのコードを生成するための言語「Sass(SCSS)」の基礎として、基本的な使い方/スタイル定義のネスト/変数/演算子/関数/ディレクティブ/について解説。書籍転載の10本目(「Part 3《応用編》 第9章 クライアントサイド開発」より)。

jQuery Mobile逆引きリファレンス

Selectmenuウィジェットで選択メニューを作成するには?

複数の選択肢から1つもしくは複数をページ閲覧者に選択させたいときに、通常の「ラジオボタン/チェックボックス」ではなく、タップして初めて選択オプションが表示される「選択メニュー」を使いたい場合がある。これを手軽に作成する方法を説明する。

書籍転載:Ruby on Rails 4アプリケーションプログラミング

CoffeeScript入門(後編) ― 関数/オブジェクト指向構文/即時関数

CoffeeScriptの基礎を解説。今回は関数/オブジェクト指向構文/即時関数について説明する(書籍転載の9本目)。CoffeeScriptをマスターしよう。

jQuery Mobile逆引きリファレンス

Flipswitchウィジェットでオン/オフ選択のためのフリップスイッチを作成するには?

オン/オフに特化した選択ボタンを設置するには、CheckboxradioウィジェットよりもFlipswitchウィジェットが便利。その基本的な使い方を解説する。

書籍転載:Ruby on Rails 4アプリケーションプログラミング

CoffeeScript入門(前編) ― CoffeeScriptの基本構文

Rubyプログラマーの必須知識「CoffeeScript」の基礎として、基本構文/変数とリテラル表現/演算子/制御構文を解説。書籍転載の8本目(「Part 3《応用編》 第9章 クライアントサイド開発」より)。

jQuery Mobile逆引きリファレンス

Checkboxradioでラジオボタン/チェックボックスを作成するには?

標準のラジオボタン/チェックボックスをリッチな選択ボタンに整形できるCheckboxradioウィジェットの基本的な使い方を解説する。

Microsoft Azure最新機能(2014年5月)

Microsoft Azureプレビュー・ポータルの機能とは?

最近のAzureアップデートの中でもひときわインパクトのある「新しいAzure管理ポータル」。そのコンセプトや機能概要を一通り紹介する。

書籍転載:Ruby on Rails 4アプリケーションプログラミング

Railsの設定情報

「第1章 イントロダクション」~「第2章 Ruby on Railsの基本」までの転載が完了。まとめて読んでRails開発を学ぼう。

jQuery Mobile逆引きリファレンス

jQuery Mobileページで複数列からなるグリッドレイアウトを作成するには?

標準機能を使ってグリッドレイアウトを作成する方法を解説。複数行にまたがるレイアウトや、レスポンシブレイアウトへの対応も説明する。

連載:コードから触るIIS 8

Webファームによる負荷分散(1): Webファームの基本構造と構成

ASP.NETアプリをスケーリングする方法の1つとして、複数のサーバーによる水平負荷分散を実現する「Webガーデン」というIIS機能について説明する。

書籍転載:Ruby on Rails 4アプリケーションプログラミング

モデルの基本

Railsプログラミングの最大の特徴は「MVC」。ControllerとViewをマスターしたら、最後にModelの基本を習得しよう。データベースをO/Rマッパーで活用する。

jQuery Mobile逆引きリファレンス

Collapsiblesetウィジェットで開閉可能なパネルを作成するには?

コンテンツ本体の表示/非表示を切り替える「開閉可能パネル」を束ねた「アコーディオンパネル」を、Collapsiblesetウィジェットで作成する方法を解説する。

書籍転載:Ruby on Rails 4アプリケーションプログラミング

ビューの基本

Railsプログラミングの最大の特徴は「MVC」。Controllerの次はViewの基本をマスターしよう。そこで使われる「ERBテンプレート」とは?

書籍転載:Ruby on Rails 4アプリケーションプログラミング

コントローラの基本

Railsプログラミングの基点は、MVCのControllerクラス。ここから具体的なコードを記述していこう。

書籍転載:Ruby on Rails 4アプリケーションプログラミング

Ruby on Rails 4アプリケーションの作成

環境が整ったら、いよいよアプリ作成を始めよう。スケルトンコードの生成から、Webサーバー上で実際にRailsアプリを動かすところまでを説明。

jQuery Mobile逆引きリファレンス

Collapsibleウィジェットで開閉可能なパネルを作成するには?

タイトル領域をクリックすることでコンテンツ本体の表示/非表示を切り替えられる「開閉可能パネル」を、Collapsibleウィジェットで簡単に作成する方法を解説する。

書籍転載:Ruby on Rails 4アプリケーションプログラミング

Railsを利用するための環境設定

Railsプログラミングに必要なソフトウェアを紹介。WindowsおよびLinuxにおける環境設定の手順や、SQLite/DevKit/Node.js/Railsのインストール方法を説明する。書籍転載の2本目(「第1章 イントロダクション」より)。

jQuery Mobile逆引きリファレンス

Tableウィジェットでレスポンシブルなテーブルを作成するには?(Reflow編)

画面サイズに応じて表示幅を調整してくれるレスポンシブル・テーブル(テーブル/連票と表示形式そのものを切り替えるReflowモード)を、jQuery MobileのTableウィジェットで作成する方法を解説する。

書籍転載:Ruby on Rails 4アプリケーションプログラミング

Railsというフレームワーク

一般的なフレームワークについて触れた後、Railsの特徴、具体的な機能について概説。書籍転載の1本目(「第1章 イントロダクション」より)。

連載:Azureモバイルサービスで作る簡単スマートフォン・アプリ

モバイル・サービスを活用するAndroidアプリを作ってみよう

Azureモバイル・サービスを使用してAndroidのアプリを作成する方法を説明。また、CLIを実際の開発で活用する。

jQuery Mobile逆引きリファレンス

Tableウィジェットでレスポンシブルなテーブルを作成するには?(Column toggle編)

画面サイズに応じて表示幅を調整してくれるレスポンシブル・テーブル(列を選択的に表示するColumn toggleモード)を、jQuery MobileのTableウィジェットで作成する方法を解説する。

jQuery Mobile逆引きリファレンス

Popupウィジェットで画像ボックスやダイアログなどを作成するには?

ダイアログ/画像ボックス/ポップアップメニューのような複雑なポップアップを、jQuery MobileのPopupウィジェットで作成する方法を解説する。

jQuery Mobile逆引きリファレンス

Popupウィジェットでポップアップを表示するには?

ツールヒント/ダイアログ/ポップアップメニューなどのポップアップを、jQuery MobileのPopupウィジェットで手軽に作成する方法を解説する。

jQuery Mobile逆引きリファレンス

Panelウィジェットで左右からスライド表示するには?

左右からスライド表示するパネルを、jQuery MobileのPanelウィジェットで手軽に作成する方法を解説する。

jQuery Mobile逆引きリファレンス

Tabsウィジェットでタブパネルを作成するには?

パネルの端に配置されたタブをクリックするとパネル内容が切り替わるUIを、jQuery MobileのTabsウィジェットで手軽に作成する方法を解説。

連載:コードから触るIIS 8

Webガーデンによるアプリケーションプールのマルチプロセス化

ASP.NET アプリのスケーリング方法を解説。今回は、Webサイトを1つのアプリケーションプール上の複数のワーカープロセスで動かす「Webガーデン」について説明する。

jQuery Mobile逆引きリファレンス

Navbarウィジェットでナビゲーションバーを作成するには?

アプリ共通のリンクやコマンドボタンなどを配置するために使われるナビゲーションバーを、jQuery MobileのNavbarウィジェットで手軽に作成する方法を解説する。

jQuery Mobile逆引きリファレンス

jQuery Mobileページでアイコン付きのボタンを配置するには?

jQuery Mobileページでボタンを設置する方法について説明。今回は、アイコン付きのボタンをレイアウトする方法を解説する。

jQuery Mobile逆引きリファレンス

jQuery Mobileページにボタンを配置するには?

jQuery Mobileページでボタンを設置するには、<button>/<a>/<input>要素などを利用するのが一般的。これらを使ってさまざまなレイアウトを実現する方法を説明。

jQuery Mobile逆引きリファレンス

jQuery Mobileページでローディング表示をカスタマイズするには?

jQuery Mobileで、ページ読み込みに際してローディングアイコンを表示する方法と、ローディング表示を制御する基本的なテクニックを解説。

jQuery Mobile逆引きリファレンス

jQuery Mobileページでハイパーリンクを設置するには?

jQuery Mobileにおけるリンクの挙動を解説。また、ページ遷移時のエフェクトやプリフェッチ機能についても説明する。

jQuery Mobile逆引きリファレンス

jQuery Mobileページでヘッダー/フッターの表示をカスタマイズするには?

ヘッダー/フッターを作成する方法を解説。また、ヘッダー/フッターの位置を固定したり、タップで非表示にしたりする方法なども紹介。

連載:コードから触るIIS 8

RedisをBackplaneとしたSignalRのスケールアウト

SignalRアプリをスケールアウトする際の注意点と、それを回避するためのBackplane機構について説明。さらにRedisをBackplaneとして活用する方法を解説する。

jQuery Mobile逆引きリファレンス

jQuery Mobileのテーマを設定(&ThemeRollerによる自作テーマ作成)するには?

サイトデザインを管理できる「テーマ」と「スウォッチ」の基本的な利用法を解説。

jQuery Mobile逆引きリファレンス

jQuery Mobileで基本的なページを定義するには?

基本的なページを作成する方法を解説。要素のid値を振る際の注意点と、1つのファイルで複数ページを管理する方法についても説明。

今、人気のJSライブラリ【2014年版】

人気上昇中のJavaScriptライブラリを調べてみた[ジャンル別に比較]

2013年中に人気が急上昇してきており、「2014年では必須の知識」となりそうなJavaScriptライブラリをランキング形式で発表。

jQuery Mobile逆引きリファレンス

jQuery Mobileを利用するには?

jQuery Mobileの基本機能を目的別リファレンスの形式でまとめる連載スタート。jQuery Mobileが動作するスマホ/タブレット環境と、jQuery Mobileページの基本構造を説明する。

jQuery UI逆引きリファレンス

ツールチップへの表示内容をカスタマイズするには?

画像を含んだツールチップを表示したり、Ajax経由でツールチップの内容を取得したりできるTooltipウィジェットのパラメーターの指定方法を紹介。

jQuery UI逆引きリファレンス

Tooltipウィジェットでツールチップを表示するには?

対象要素にマウス・ポインターを当てるとポップアップするツールチップを実装できるTooltipウィジェットの基本的な使い方を解説。

連載:コードから触るIIS 8

Windows Server 2012 R2とIIS 8.5の新機能

先日(11月1日)から製品販売が開始されている「Windows Server 2012 R2」の新機能の中から「PowerShell DSC」について紹介。また、そのOS上で動くIISの最新版「IIS 8.5」の新機能も説明する。

jQuery UI逆引きリファレンス

Progressbarウィジェットでプログレスバーを作成するには?

時間のかかる処理の進行状況をユーザーに対して通知できるProgressbarウィジェットの基本的な使い方を解説。

jQuery UI逆引きリファレンス

Draggable/Droppableウィジェットでドラッグ&ドロップ機能を実装するには?

ページ上の指定された要素をマウスでドラッグ&ドロップできるようにするDraggable/Droppableウィジェットの基本的な使い方を解説。

連載:Azureモバイルサービスで作る簡単スマートフォンアプリ

モバイルサービス開発でコマンドラインを活用しよう!(Win/Mac/Linux対応)

Azure管理用のコマンドライン・インターフェース(CLI)を活用して、モバイル・サービス開発を効率化しよう。その活用方法を解説。

jQuery UI逆引きリファレンス

Selectableウィジェットで選択可能なリストを作成するには?

マウス・クリックによる単一選択や、マウス・ドラッグによる範囲選択などが実現できるSelectableウィジェットの基本的な使い方を解説。

連載:Microsoft技術におけるアイデンティティ連携開発のいま(4)

Azureの認証におけるその他サービス ~ Azureモバイルサービス、多要素認証

最終回。Azureモバイルサービスや、多要素認証など、これまでの連載で取り上げなかった、認証に関わる先進的な技術を簡単に紹介する。

jQuery UI逆引きリファレンス

AutoCompleteウィジェットで候補リストをサーバーサイドから取得するには?

AutoCompleteウィジェットの候補リストをサーバーサイドで管理し、Ajax経由でそのリストを取得する方法を解説。

連載:コードから触るIIS 8

IIS 8でさわるSignalR 2.0

SignalR 2.0をIIS 8(WebSocket)で動かす方法を説明。Windows Server/IIS、.NET/Visual Studioに関するアップデートについても簡単に紹介。

jQuery UI逆引きリファレンス

AutoCompleteウィジェットの検索/表示方法をカスタマイズするには?

AutoCompleteウィジェットのイベントやメソッドを利用しながら、候補リストの検索/選択時の処理をカスタマイズする方法について説明。

jQuery UI逆引きリファレンス

AutoCompleteウィジェットでオートコンプリート機能付きのテキストボックスを生成するには?

テキストボックスに最初の何文字かを入力すると、それにマッチする候補リストを表示するオートコンプリート機能を実現できる、AutoCompleteウィジェットの基本的な実装方法を紹介。

jQuery UI逆引きリファレンス

jQuery UIで拡張されたエフェクト機能を利用するには?(effect/xxxxxClass編)

jQuery標準の各種エフェクト機能を拡張して、よりリッチな効果をシンプルなコードで実現できる、jQuery UIのエフェクト機能の中から、effectメソッドで利用できるtransferエフェクト、スタイル・クラスを着脱するxxxxxClassメソッドついて紹介。

Breeze入門

データ管理JavaScriptライブラリ「Breeze」とは

クライアントサイドのJavaScriptでのデータ処理を簡単にするライブラリ「Breeze」を紹介。JSONデータをキャッシュしたり、ODataのクエリ文字列などを利用したデータのソートやページング処理をしたりできる。

連載:コードから触るIIS 8

オート・スタートによるアプリケーションの初期化処理とメンテナンスページ

IISによるWebサイト起動時に何らかの処理を行うための方法を解説。また、メンテナンスページをIISにより実現する方法も紹介。

jQuery UI逆引きリファレンス

jQuery UIの拡張されたエフェクトを利用するには?(show/hide/toggle/effect編)

jQuery標準の各種エフェクト機能を拡張して、よりリッチな効果をシンプルなコードで実現できる、jQuery UIのエフェクト機能の基本的な使い方について紹介。

jQuery UI逆引きリファレンス

Sliderウィジェットでスライダーを生成するには?

ツマミをマウスでドラッグすることで値を変更できるスライダーを実装するためのSliderウィジェットの基本的な使い方について紹介。

jQuery UI逆引きリファレンス

Spinnerウィジェットで数値入力ボックスを生成するには?

数値入力ボックスを実装するためのSpinnerウィジェットの基本的な使い方について紹介。

特集:Azureメディアサービスを利用したストリーミング配信(後編)

Azureメディアサービスを利用したアプリケーション開発

デバイスに向けた動画配信サービスを容易に構築できるAzureメディアサービスを紹介。今回は、サンプル・アプリケーションを開発してメディア・サービスの機能について学習する。

jQuery UI逆引きリファレンス

JavaScriptからダイアログ・ボックスを動的に操作するには?

Dialogウィジェットのパラメーターやメソッドを利用して、Webページ上でダイアログを動的に制御する方法について紹介。

連載:コードから触るIIS 8

C#でアプリケーション・プールの設定とWebサイトの作成

IISでのWebサイトの作成をC#コードから行ってみよう。一連の開発手順とコードを分かりやすく解説。

jQuery UI逆引きリファレンス

Dialogウィジェットでダイアログ・ボックスを生成するには?

Dialogウィジェットで、テキストやボタン、フォーム要素などを配置できるダイアログ・ボックスを作成する方法を紹介。

jQuery UI逆引きリファレンス

アコーディオン・パネルの内容を外部ファイル化するには?

Accordionウィジェットのイベントやメソッドを利用しながら、アコーディオン・パネルの内容を外部ファイル化する方法を紹介。

特集:Windows 8.1標準ブラウザー「IE11」正式版での注意点

Web制作者は注意! Internet Explorer 11で変更された「互換性」

Windows 8.1正式版がMSDNサブスクライバー向けに公開され、それに標準搭載される「IE11」も正式版となった。しかしこのIE11にはWeb制作者に大きな影響がある「互換性」に関する変更が含まれている。

jQuery UI逆引きリファレンス

Accordionウィジェットでアコーディオン・パネルを生成するには?

タイトル部分をクリックすることでコンテンツが開閉するアコーディオン・パネルを実装できる「Accordionウィジェット」の基本的な使い方を説明する。

特集:Azureメディアサービスを利用したストリーミング配信(前編)

動画配信サービスの課題と、Azureメディアサービスの機能概要

デバイスに向けた動画配信サービスを容易に構築できるAzureメディアサービスを紹介。今回は、動画配信サービス構築時の課題とそれを解決するための機能を説明する。

jQuery UI逆引きリファレンス

展開可能なリッチ・メニューを生成するには?

サブメニューの動的な展開が可能なメニューを生成できるMenuウィジェットの基本的な使い方を説明する。

連載:Azureモバイルサービスで作る簡単スマートフォンアプリ

認証機能とプッシュ通知をしよう!

iOSのサンプルでAzureモバイル・サービス(BaaS)の機能を紹介。Twitter、Facebook、Google、Microsoftなどの認証プロバイダーを使用した認証機能とプッシュ通知の実装方法を説明する。

jQuery UI逆引きリファレンス

リサイズ可能なパネルを生成するには?

指定の要素を(画像、テキストにかかわらず)マウスのドラッグ操作でリサイズできるようにするResizableウィジェットの基本的な使い方を説明する。

jQuery UI逆引きリファレンス

Buttonウィジェットでさまざまなボタンを生成するには?

<button>、<input type=”radio”>、<input type=”checkbox”>、<input type=”submit”>、<a>といった要素を、一様にボタンに整形できるButtonウィジェットの基本的な使い方を説明する。

連載:Microsoft技術におけるアイデンティティ連携開発のいま(3)

カスタム・アプリケーションによる認証フローとプログラミング

ネイティブ・アプリのプログラム・コードから認証を行う方法とは? Azure Active Directoryを例に、OAuth 2.0をベースにした、プラットフォームに依存しない新しい手法を考察する。

連載:コードから触るIIS 8

C#コードによるARR 3.0 RTMのインストールと設定

7月26日に正式版がリリースされた「ARR(Application Request Routing) 3.0」とは? そのARRを、C#コードによりインストール&設定する方法を説明する。

jQuery UI逆引きリファレンス

Sortableウィジェットで並べ替え可能なリストを生成するには?

指定された要素配下の子要素群をドラッグ操作で並べ替え可能にするSortableウィジェットの基本的な使い方を説明する。

jQuery UI逆引きリファレンス

タブ・パネルの挙動をカスタマイズするには?

Tabsウィジェットのイベントやメソッドを利用しながら、タブ・パネルのさまざまな制御方法を紹介する。

連載:Azureモバイルサービスで作る簡単スマートフォンアプリ

iOSアプリを5分で作ろう! Azureモバイルサービスで簡単開発

Azureモバイル・サービス(BaaS)を使用してiOSやAndroidなどのアプリを作成していくことで、その魅力を紹介する連載がスタート。今回はToDoリストを管理するiOSアプリのサンプルを作成して動かしてみる。

jQuery UI逆引きリファレンス

Tabsウィジェットでタブ・パネルを作成するには?

パネルの端に配置されたタブで内容を切り替えられるタブ・パネルを簡単に実装できる、jQuery UIのTabsウィジェットの基本的な使い方を説明する。

特集:ASP.NET MVC Contribのテスト支援機能(後編)

URLパターンを用いてテストを行う

URLルーティングの設定を変更しながら、ASP.NET MVCアプリのテストを追加していく方法について説明。また、MvcContribのテスト支援機能以外の機能についても簡単に紹介する。

jQuery UI逆引きリファレンス

DatePickerウィジェットで日付選択ボックスを作成するには?

日付選択ボックスを実装するためのjQuery UIウィジェット「DatePicker」の基本的な使い方を説明。オプションにより、挙動や見栄えをさまざまにカスタマイズできる。

連載:コードから触るIIS 8

PowerShellによるIIS 8のインストール

Windows Server 2012に搭載されているWebサーバー「IIS 8」の機能を「コードから触って動かす」をテーマにした連載スタート。今回はPowerShellスクリプトでIISのセットアップなどを実行する方法を紹介する。

jQuery UI逆引きリファレンス

jQuery UIを利用するには?

jQuery UIの基本機能を目的別リファレンスの形式でまとめる連載スタート。jQuery UIで提供されているコンポーネントと、基本的な利用法を説明する。

特集:IE11 Preview概説

Web制作者が知っておくべき、Internet Explorer 11(プレビュー版)の新機能および変更点

先週公開されたWindows 8.1(プレビュー版)に標準搭載されているWebブラウザの新版であるIE11(プレビュー版)の主要な新機能および変更点を紹介。「ユーザー・エージェント文字列」「SPDY対応」「WebGL対応」「高品質ビデオ」など。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

JavaScriptベースのデータベース[TaffyDB]

書籍転載の18本目(書籍内の番号は「69」)。JavaScriptのJSON形式のデータに対して、データベースのような感覚でアクセスするためのライブラリ「TaffyDB」の基礎と、基本的な使い方を解説する。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

HTML5+JavaScriptベースでゲームを作る[enchant.js]

書籍転載の17本目(書籍内の番号は「65」)。HTML5+JavaScriptで作られたゲーム・エンジン「enchant.js」の基礎と、基本的な使い方を解説する。

特集:ASP.NET MVC Contribのテスト支援機能(前編)

ASP.NET MVCアプリのURLのテストを簡単に行う

ASP.NET MVCを便利に使うためのオープンソース・ライブラリ「MvcContrib」のテスト支援機能を活用して、ASP.NET MVCアプリのURLをテストする方法を説明する。

特集:JavaScriptライブラリ「Modernizr」入門

Modernizrを使ってブラウザーの機能を調べるには

ユーザー・エージェント文字列を使ってブラウザー単位で、使用可能なHTML5/CSS3機能を判定する方法は時代遅れだ。これからは機能単位で判別しよう。その方法を解説。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

JavaScriptでクッキーを簡単に操作する[jquery.cookie]

書籍転載の16本目(書籍内の番号は「61」)。JavaScriptでのクッキー操作をごくシンプルなコードで実装できる「jquery.cookieプラグイン」の基本的な使い方を説明する。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

処理を短く記述する[CoffeeScript]

書籍転載の15本目(書籍内の番号は「64」)。CoffeeScriptの基本構文のうち、数値や文字列表現、配列、for~in、unless/untilの記述方法を説明する。

特集:Umbraco入門

開発者のための、エッジなCMS「Umbraco」の魅力

日本だけが知らない?! 世界中で定評のあるCMS「Umbraco」とは? ASP.NET MVCなど.NETの先端技術と組み合わせ可能な最新版の魅力を、実際の開発手順例を通して紹介する。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

オブジェクト指向でコードを記述する[CoffeeScript]

書籍転載の14本目(書籍内の番号は「63」)。CoffeeScriptを使用すると、クラスベースのオブジェクト指向で記述できる。その内容を説明する。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

短くかつ安全で高性能なコードを書く[CoffeeScript]

書籍転載の13本目(書籍内の番号は「62」)。短い記述で、安全かつ高性能なJavaScriptコードを生成できる「CoffeeScript」の基本的な使い方を説明する。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

JasmineのSpy機能でテストダブルを作成する

書籍転載の12本目(書籍内の番号は「109」)。Jasmineでテスト対象オブジェクトが持つメソッドの戻り値を固定値に変更したり、そのメソッドが実行されたかどうかを検証したりするために、Spy機能を使用する方法を解説。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

RSpec風の構文でBDD用のテスト・コードを記述する[Jasmine]

書籍転載の11本目(書籍内の番号は「108」)。RSpec風のテスト・コードが書けるBDD(ビヘイビア駆動開発)テスティング・フレームワーク「Jasmine」の基本的な使い方を説明する。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

[Underscore.js]テンプレートとオブジェクトから文字列を生成する

書籍転載の10本目(書籍内の番号は「101」)。テンプレートとオブジェクトをバインドし、その結果を出力できる「Underscore.js」のテンプレートAPIの使い方を説明。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

[Underscore.js]さなざまなコレクション操作を行う

書籍転載の9本目(書籍内の番号は「100」)。ユーティリティ・ライブラリ「Underscore.js」の基礎として、さまざまなコレクション操作する方法を説明。

特集:RWD入門

レスポンシブWebデザインの現状と、CSSフレームワーク「Foundation 4」によるサイト制作手法

Webサイトをマルチデバイス対応する際の1つの手法にRWD(レスポンシブWebデザイン)がある。その利点と欠点を考察。また、欠点を補うためのCSSフレームワークを紹介する。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

[QUnit]テストコードを実行し、ブラウザで結果を確認する

書籍転載の8本目(書籍内の番号は「111」)。JavaScript用テストランナーの定番ライブラリである「QUnit」の基礎と基本的な使い方を説明。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

[Knockout]MVVMパターンでアプリケーションを構築する

書籍転載の7本目(書籍内の番号は「89」)。MVVM(Model-View-ViewModel)パターンをサポートするJavaScriptライブラリである「Knockout」の基礎と、基本的な使い方を解説。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

[Sammy.js]URLによって処理を分割する

書籍転載の6本目(書籍内の番号は「77」)。URLの「#」以降の指定によって処理を分割することに着目したフレームワークである「Sammy.js」の基礎と基本的な使い方を紹介。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

[AngularJS]HTMLそのものをテンプレートとして動的な表示を実現する

書籍転載の5本目(書籍内の番号は「70」)。HTMLとJavaScriptをシンプルに分離できる、LiteなJavaScriptフレームワークである「AngularJS」の基礎と基本的な使い方を紹介。

連載:Microsoft技術におけるアイデンティティ連携開発のいま(2)

.NETで使えるアイデンティティ連携のためのライブラリまとめ(後編)

アイデンティティ連携で使用可能なライブラリやサービスなどをまとめる記事の後編。今回はAzure Active Directoryのアイデンティティ連携を中心に解説。

Azure TIPS

クライアントPCから「Azure SQLデータベースをBlobストレージにバックアップ」するには?[C#]

Azure SQLデータベースを.bacpacファイルとしてBlobストレージにエクスポートするコンソール・アプリの作り方を紹介。そのアプリをタスク・スケジューラーに登録すれば、定期バックアップも実現できる。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

Ember.jsでビューとコントローラを紐付け、DOM更新のコードを省略する

書籍転載の4本目(書籍内の番号は「71」)。MVCフレームワークの「Ember.js」の基礎と基本的な使い方を紹介。Ember.jsではテンプレート・エンジンにより、コントローラからのデータを受け取ってHTML出力内容を動的に整形できる。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

Backbone.jsのCollectionを操作し、イベントを購読する

書籍転載の3本目(書籍内の番号は「88」)。Backbone.jsのCollectionの内部状態を変更するメソッドが呼ばれた際に発生するadd/change/remove/resetなどのイベントを購読することで、Collectionの状態変更を監視する方法を説明。

特集:Azure上での高度な定期処理の実現

スケジュールされたジョブ機能とAzure Webサイトを組み合わせた定期処理の実装

新機能の「スケジュールされたジョブ機能」を使えば、設定された時刻に定期的に自動実行される処理を、Microsoft Azure上で容易に実現できる。その実現方法を解説する。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

Backbone.jsのModelを操作し、イベントを購読する

書籍転載の2本目(書籍内の番号は「87」)。Backbone.jsのModelの内部状態を変更するメソッドが呼ばれた際に発生するchangeイベントを購読することで、Modelの状態変更を監視する方法を説明。

書籍転載:JavaScriptライブラリ実践活用[厳選111]

MVCパターンでアプリケーションを構築する(Backbone.js)

書籍転載の1本目(書籍内の番号は「86」)。クライアントサイドMVCフレームワークの定番ライブラリの1つ「Backbone.js」の基本的な使い方を解説。

特集:最新技術を活用したWebアプリとは?

ASP.NET SignalRとknockout.jsで実現する次世代Webアプリ

SignalRとknockout.jsは相性がよく、これらの最新技術を組み合わせることで、リアルタイムに更新されるWebアプリを簡単に構築できる。その方法を紹介する。

連載:Microsoft技術におけるアイデンティティ連携開発のいま(1)

.NETで使えるアイデンティティ連携のためのライブラリまとめ(前編)

Webアプリなどで、Facebook、Google、Twitter、企業内のActive Directoryなどの各アイデンティティ基盤と連携するための各技術(ライブラリやサービス)を、開発者視点で整理する連載スタート。

特集:次世代Web

デバイスとクラウドがもたらす近未来

これからアプリケーション・アーキテクチャはどう変化するのか、次に必要とされるWeb技術は何なのかを考察する。

サイトからのお知らせ

Twitterでつぶやこう!