タスク（TODO）共有サービスの調査メモ

日本語で使えるタスク共有サービスにアカウント登録して調べたメモ。


Brabio!

• UIはネイティブアプリライクで使いやすいが、ちょっと情報過多？
• ガントチャートを使いこなせるなら、とても便利そう。
• ガントチャートを使わずにタスク管理するだけなら、オーバースペックでかえって分かりづらいか。
• コメントにメールで返信できるのが便利そう。

Backlog

• タスクのプロパティが豊富。
• Tracに似ているので、TracやRedmine経験者なら入りやすい。
• UIは非システム系の人でもとっつきやすいが、やや古いか。（タスク選択時に小さなリンク部分をクリックしないと反応しない、等）

サイボウズLive

• UIが使いやすい。
• 機能的にもバランスが取れている。

Wrike

• UIが洗練されている。その分、ライトユーザーにはとっつきずらいか。
• 日本語化されていない（英語のままの）箇所が、ちらほらある。
• 使い方がわからない機能がある。

Todous

• UIはゆるい感じでよいが、配色等のデザインはいまいちか。
• 余分な機能が無いのは分かりやすくて良い。
• タスクをまとめて見られないのが使いづらい。

ChatWork

• タスク管理については最低限の機能しかない。（タスクにコメントをつけられない、等）

参考

• 時代は共有！タスク管理を共有できるWEBサービス12選 | 株式会社LIG 
• 情報管理、コミュニケーション、などのツールで便利なものを教えて頂けないでしょうか。 
• プロジェクト管理ツールは何を使っていますか？ 

IEのバージョン別の X-Content-Type-Options: nosniffの対応状況

IE8以下は内容がHTMLっぽいとHTTPレスポンスヘッダ‐のContent-typeに関わらず、HTMLとしてレンダリングしてしまう。
IE8はnosniffをつければ、Content-typeに従う。

参考： X-Content-Type-Options: nosniffの効果を確認してみる | UCWD-Studio.【ホームページ制作 / 京都】


PHPの実験用コード

<?php header('Content-type: text/plain') ?>
<script>alert(1)</script>

IE9以降およびChrome・Firefoxなどは、nosniffがある場合はJavaScriptやCSSの外部ファイルのContent-typeが妥当でないと、その外部ファイルは読み込まない。

参考：
X-Content-Type-Options: nosniff の効果 : swdyh
MIME タイプのセキュリティ リスクの軽減 (Windows)

今どきのHTTPヘッダーによるセキュリティ向上の調査メモ

今夜つける HTTPレスポンスヘッダー （セキュリティ編） - うさぎ文学日記の中で、よく知らなかったヘッダーについて調べたメモ。

いくつかのヘッダーについてのブラウザ別のサポート状況はこちら。
（ちょっと古いが、少なくともこれ以降のバージョンではサポートしているということは分かる。）
↓
IPA ISEC　セキュア・プログラミング講座：Webアプリケーション編　第8章 マッシュアップ：クライアントサイドマッシュアップ: #4 対策に利用できる技術


X-XSS-Protection

IE8以降のXSSフィルターはデフォルトで有効になっている（ブロッキングモードではない）。
↓
Security through HTTP response headers

[IEInternals] XSS フィルターを制御する | Hebikuzure's Tech Memo

Internet Explorer 8 には、XSS フィルターとして知られている、反射型クロスサイト スクリプティング攻撃を防止するのに有効な画期的新機能があります。このフィルターは既定ではインターネット ゾーン、信頼済みサイト ゾーン、制限付きサイト ゾーンで動作します。

オフにしている人や、XSS on XSS Filterに備えて、ブロッキングモードで有効にさせるのが無難？

X-XSS-Protection: 1; mode=block

Content-Security-Policy

（参考）Content Security PolicyでXSSを断ち切る | monoの開発ブログ

インラインリソースは'unsafe-inline'で許可できる。
dataスキームURIには"data:"で許可できる。
↓
An Introduction to Content Security Policy - HTML5 Rocks

IEがほぼサポートしていないようなので、効果は限定的か。
↓
CSP policy directives - Security | MDN

CSP is quite usable in Chrome 16+, Safari 6+, and Firefox 4+, and has (very) limited support in IE 10.

セキュリティとしては非常に強力だが、ホワイトリストのメンテが面倒なので外部リソースを気軽に使うようなサイトでは使うのは難しい？

あるいは、こんな風に思いっきり緩くしておくか？（これだと意味がないか...）

Content-Security-Policy:
default-src 'self';
script-src 'unsafe-inline' *;
img-src data: *;
frame-src *;
font-src *;
style-src 'unsafe-inline' *;
report-uri /csp-report.php

見やすくするために改行している。未検証なので取扱注意。
faviconはimg-srcに含まれる。
違反が見つかったら、report-uriにJSONでPOSTされる。
eval()が必要なら'unsafe-inline'も追加する。

Content-Security-Policy-Report-Onlyでチェックのみに使うのが良いかもしれない。


Strict-Transport-Security

IEが10でもサポートしていないことを考えると、これが効かない場合のリダイレクト等の処理も必要。
↓
HTTP Strict Transport Security - OWASP

PHP5.5を Amazonの yumリポジトリからインストール

EC2のAmazon Linux AMIでデフォルトのyumリポジトリであるamznリポジトリから、PHP5.5をインストールできるようになった。

$ yum info php55

↓

Loaded plugins: priorities, update-motd, upgrade-helper
amzn-main/latest/primary_db                                                                                                                      | 2.5 MB     00:00    
amzn-updates/latest/primary_db                                                                                                                   | 301 kB     00:00    
mod-pagespeed/primary                                                                                                                            | 4.5 kB     00:00    
mod-pagespeed                                                                                                                                                     28/28
Available Packages
Name        : php55
Arch        : x86_64
Version     : 5.5.5
Release     : 1.55.amzn1
Size        : 2.9 M
Repo        : amzn-updates/latest
Summary     : PHP scripting language for creating dynamic web sites
URL         : http://www.php.net/
License     : PHP and Zend and BSD
Description : PHP is an HTML-embedded scripting language. PHP attempts to make it
            : easy for developers to write dynamically generated web pages. PHP also
            : offers built-in database integration for several commercial and
            : non-commercial database management systems, so writing a
            : database-enabled webpage with PHP is fairly simple. The most common
            : use of PHP coding is probably as a replacement for CGI scripts.
            :
            : The php package contains the module (often referred to as mod_php)
            : which adds support for the PHP language to Apache HTTP Server.

手元のサーバで使ってる拡張（Extension）のPHP5.4から5.5への変更のメモ。

php54-mbstring → php55-mbstring
php54-pdo → php55-pdo
php54-mysql → php55-mysqlnd？
php54-pecl-apc → php55-opcache
php54-pecl-xdebug → まだない

5.4に比べてまだ少ないようだ。

MySQLで 「ERROR 2006 (HY000) at line xxx MySQL server has gone away」

調べたことをメモしておく。


mysqldumpでエクスポートした1GB余りのデータをインポートする時に、下記エラーが発生。

ERROR 2006 (HY000) at line 351 MySQL server has gone away

対策
↓
インポート時に「MySQL server has gone away」が発生したときの対処 | 南紀熊野ウェブサービス(大阪、新宮市)

max_allowed_packet = 32M

↓

今度は下記エラーが発生。

ERROR 2013 (HY000) at line xxx: Lost connection to MySQL server during query

対策
↓

Importing 1GO SQL File => ERROR 2013 (HY000) at line 23: Lost connection to MySQL server during query - Stack Overflow

max_allowed_packet = 1100M
net_write_timeout = 300

↓

駄目。次。

ERROR 2013 (HY000): Lost connection to MySQL server during query - MySQL

innodb_force_recovery = 4

↓

下記エラー。

ERROR 1051 (42S02) at line xx: Unknown table 'xxxxx.xxxxx'

↓

これは？

ERROR 2013 (HY000): Lost connection to MySQL server during query - Dev Shed

innodb_force_recovery = 3

↓

同じエラー。innodb_force_recoveryはやめる。

↓

MySQL Lists: mysql: Re: ERROR 2013 (HY000): Lost connection to MySQL server during query

connect_timeout = 6000

単位は秒？

↓

駄目。

↓

【結論】原因は、メモリ不足だった。

Windowsの Cドライブの残容量を増やす方法

まずは、

•  「ディクスのクリーンアップ」を実行する
• Cドライブを右クリック → プロパティ → ディクスのクリーンアップ

急ぎなら、

• SoftwareDistribution関連(Windowsの高速化)
•  C:\Windows\SoftwareDistribution\DataStore\DataStore.edbを削除する
• しばらくするとまた増えるので、容量不足解消という意味では応急対応にしかならない

それでも駄目なら、

•  「C:\WINDOWS\SoftwareDistribution\Download」の削除 - パソコントラブルと自己解決
•  C:\Windows\SoftwareDistribution\Downloadを空にする
• 「システムの復元」容量の変更 - パソコントラブルと自己解決
•  「システムの復元」用のディスク領域使用量を変更する
• 「Cドライブ」から「Dドライブ」へのデータ移動 - パソコントラブルと自己解決
• 仮想メモリを最適設定する 
•  ページングファイル（pagefil.sys）を別のドライブに移動する（要再起動）
• Cドライブのpagefil.sysは自動では消えないので、再起動後に移動先のドライブのpagefil.sysが使われていることを確認後、Cドライブの方は手動で削除する
• 手動（カスタムサイズ）で設定する場合はタスクマネージャ→パフォーマンスの「コミット」の値を参考にする
• 「コミット」の使用量と搭載している物理メモリ の大きさから検討する
• 参考：Windows TIPS：タスク・マネージャのパフォーマンス・タブの見方（Windows 7／Windows Server 2008 R2編） - ＠IT

EBSの rootボリュームをのサイズを増やす方法

Amazon EC2でEBSのrootボリュームの容量を増やす方法のメモ。

1. インスタンスを停止する
2. EBSボリュームをDetachする
3. Detachしたボリュームのスナップショットをとる
4. スナップショットからボリュームを作成する
   その際に、任意のサイズを指定する
   また、Availability Zoneはインスタンスと同じZoneを指定する
5. 作成したボリュームをインスタンスにAttachする
   その際に、下記のデバイスとして指定する

   /dev/sda1
6. インスタンスを起動する
7. SSHでログインして、resize2fsコマンドを実行する

   sudo resize2fs /dev/sda1
8. dfでリサイズ後の容量を確認する

   df -h

参考：EBS-backedインスタンスのrootボリュームをサイズ増量 | koba206の開発WIKI

ホスト型侵入検知ツール（IDS）の aideを Amazon Linuxにインストール

徳丸さんが改ざん検知を導入したそうなので、うちにも入れてみた。徳丸さんはionotifywait（とTripwire）を採用したそうだけど、調べてみたらaideの方が使いやすそう。aideはTripwireなどと同じホスト型の侵入検知ツールというか改竄検知ツール、というか差分ファイル調査ツール。

なのでaideをAmazon Linuxにインストールしてcronで動かすまでの備忘録。rootで作業した。

インストール

yum install aide

設定ファイル編集

vi /etc/aide.conf

• デフォルト設定の注意点
• /var/www が含まれていないのでWebファイルの改竄を検知できない
• /etc/httpd も含まれていない
• /var/log が含まれているのでログが書かれると反応してしまう
• 最初は厳し目（検知多め）にしておいて、使いながら緩くしていくのが良さそう

cron設定例

MAILTO=foo@example.com

00 2 * * * cd /var/lib/aide; cp aide.db.new.gz aide.db.gz; /usr/sbin/aide -u > /dev/null || cat /var/log/aide/aide.log

• 毎晩2時に、前回作ったDBを適用し、チェック＆DB作成を実行し、異常があった場合のみログの内容をメールで送付する場合の例
• エラーがある場合は標準出力に出力されるエラー情報と同じ内容がログにも出力されるので、標準出力は /dev/null に捨てている

きちんとやるなら、aideのDBをどうやって守るか（別サーバに置くなど）とかも考えないといけないみたい。

PHPのフレームワークの人気を Googleトレンドで比較

世界で人気のPHPフレームワークでGoogle検索されている上位5つはこれ。

 

CodeIgniterの人気がグングン上がって、2010年頃にトップになってそのまま独走してる。ライセンス問題云々の問題は影響がなかったように見える。

また、それを追うようにYiiの人気が上昇し、PHPフレームワーク旧御三家のCake、Symfony、Zendを抜いてしまった。

それにしても2009年にみんな揃ってガクッと落ちてるのはなんだろう？

で、上位5つをの下はこれ。（比較用にZendも入れている。）

Laravelがグググッと上がってきて、Zendを抜くのは時間の問題か。CodeIgniter、Yii、Laravelが新御三家になるのかな。

有望株だったKohanaは伸び悩んでこのまま消えていくのか。意外にもEthnaは細く長く頑張ってる...？日本で人気のFulePHPは、Ethnaに辛うじて勝つ程度という低空飛行。


最後に、日本限定で比べると上位5つはこれ。

みんな大好きCakePHP。安定のぶっちぎり。

後は小さくて見辛いが、Fuelがここ2年で他を抜き去って2位になって、このまま伸びそうか？Rails好きな日本人のはずが、Symfonyは落ちてきてCodeIgniterも伸び悩み。


で、ここまで書いてきてなんだけど、Googleトレンドで調べる場合の問題は、普通の単語だとPHPのフレームワークと関係なく検索数が増えてしまうこと。
例えば「Rails」で調べたら、Ruby on Railsと関係ない検索もたくさん含まれてしまうよね？Yiiなんかもどこかの国の言葉で存在してPHPと関係なく調べられてるかもしれないとも思ったけど、グラフの伸びから見るとPHPフレームワークとして検索されてそう。Yiiの強さは、普通名詞の組み合わせではない、かつ、シンプルであることだろう。

逆に、FuelPHPやZend Frameworkは「Fuel」や「Zend」と略した場合の検索がカウントされていないので、過小評価になってしまう。
「Zend Controller」「Fuel Exception」など他の言葉との組み合わせでたくさん検索されてそうだが、Googleトレンドではそこまで調べられないので。

それでも日本では圧勝のCakePHPは、それだけ凄いんだろうけど...。

サービス連携による情報収集の進化（あるいは退化）について

個人的な変遷を

1. 原始時代
   はてなブックマーク ホットエントリーなど（PC）
   
2. 石器時代（道具を使うことを覚える）
   はてなブックマーク、その他のRSS＋Pipes（バックグラウンド）
   ↓
   Google Reader（PC）
   
3. 古代（スマホにより機動力を獲得）
   はてなブックマーク、その他のRSS＋Pipes（バックグラウンド）
   ↓
   Google Reader（PC、スマホ）
   
4. 近代（PocketとiPad miniで文明開化）
   はてなブックマーク、その他のRSS＋Pipes（バックグラウンド）
   ↓
   Google Reader（スマホ、PC）
   ↓
   IFTTT（バックグラウンド）
   ↓
   Pocket（iPad、スマホ）
   
5. 現代
   はてなブックマーク、その他のRSS＋Pipes（バックグラウンド）
   ↓
   Feedly（スマホ、iPad）
   ↓
   Pocket（iPad、スマホ）

一連の流れからPCが無くなるなんて。思えば遠くへ来たもんだ。

Amazon Linuxに Ruby 2.0（+ Rails）をインストールするメモ

現時点でyumでは2.0は入れられないので調べた。

いろんなやり方があって、みんな微妙に違うから、参考サイトのパッチワークになってしまった。

参考にしたのは下記のサイト、下記の箇所。

AmazonLinuxにrbenvでrubyを入れてみる · mechamogera/MyTips Wiki · GitHub

• yumで依存するパッケージをインストールする（全部いるのかどうかは分からない）

amazon web services - Installing Ruby 2.0 and Rails 4.0.0beta on AWS EC2 - Stack Overflow

• “Here is a variant with rbenv.”の方に従って、
• rbenvをインストール
• ruby-buildをインストール
• /etc/profile.d/rbenv.shファイルを作成
• “. /etc/profile”を実行

LinuxにRuby on Railsをインストールする | tsuchikazu blog

• Rubyをインストール（必要に応じてバージョンを指定する）
• Railsをインストール（必要に応じてバージョンを指定する。本家サイトはこちら）

後で気付いたが、Amazon Linuxには最初からRuby 1.8が入っているからrbenvにしてよかった。

MySQL 5.6を RPMからインストール

現時点でyumに無いMySQL5.6をAmazon Linuxにインストールするメモ。

バージョン番号は現時点での最新版なので必要に応じて読み替えること。

インストール

（参考：How to install MySQL 5.6 on Amazon Linux EC2 Instance in AWS、MySQL :: MySQL 5.6 Reference Manual :: 2.5.1 Installing MySQL on Linux Using RPM Packages）

1. wget http://dev.mysql.com/get/Downloads/MySQL-5.6/MySQL-client-5.6.12-1.el6.x86_64.rpm/from/http://cdn.mysql.com/ -O MySQL-client-5.6.12-1.el6.x86_64.rpm
2. wget http://dev.mysql.com/get/Downloads/MySQL-5.6/MySQL-server-5.6.12-1.el6.x86_64.rpm/from/http://cdn.mysql.com/ -O MySQL-server-5.6.12-1.el6.x86_64.rpm
3. wget http://dev.mysql.com/get/Downloads/MySQL-5.6/MySQL-devel-5.6.12-1.el6.x86_64.rpm/from/http://cdn.mysql.com/ -O MySQL-devel-5.6.12-1.el6.x86_64.rpm
4. wget http://dev.mysql.com/get/Downloads/MySQL-5.6/MySQL-shared-5.6.12-1.el6.x86_64.rpm/from/http://cdn.mysql.com/ -O MySQL-shared-5.6.12-1.el6.x86_64.rpm
5. yum install MySQL-*.rpm

chkconfigに登録しようと見てみたら、もうmysqlが登録されてた。

初期設定

CentOS 6.4にMySQL 5.6をサクッとインストールする | はったりエンジニアの備忘録の「初期設定」のとこを参考に進める。

CDNから 各種JavaScriptライブラリを読み込むサンプルコード

下記のJavaScript（/CSS）ライブラリをCDNから読み込むためのサンプルコード。

• jQuery
• jQuery Mobile
• jQuery UI
• Twitter Bootstrap

共通事項として、URLのスキーム（http等）を省略すればhttpでもhttpsでも使える。
が、CSSでスキームを省略するとIE8以下が2回サーバにアクセスするという問題があるので、下記ではCSSも使う場合はスキームをhttpにした。httpsで使いたい場合はhttpsにするか、上記の問題を無視していいならスキームを省略すればよい。

jQuery

cdnjs (by CloudFlare)

<script src=”//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js”></script>

Microsoft (Ajax Content Delivery Network)

<script src=”//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.1.min.js”></script>

Google (Hosted Libraries)

<script src=”//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js”></script>

常に1.x系の最新版にする場合（※なぜか”2”や”1.9”という指定だと404 Not Foundになる）

<script src=”//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js”></script>

jQuery (CDN by Media Temple)

（https不可）

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

常に最新版にする場合（現時点の最新版の2.0.0ではなく1.9.1がロードされた）

<script src="http://code.jquery.com/jquery.min.js"></script>

jQuery Mobile

cdnjs (by CloudFlare)

<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/jquery-mobile/1.3.1/jquery.mobile.min.css" />

<script src=”http://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js”></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-mobile/1.3.1/jquery.mobile.min.js"></script>

Microsoft (Ajax Content Delivery Network)

（現時点の最新版の1.3.1がまだ無い）

<link rel="stylesheet" href="http://ajax.aspnetcdn.com/ajax/jquery.mobile/1.3.0/jquery.mobile.structure-1.3.0.min.css" />

<script src=”http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.1.min.js”></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>

jQuery (CDN by Media Temple)

（https不可）

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css"/>

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>

常に最新版にする場合

（”1.4.0pre”になる。アルファ版未満のバージョン？）

<link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" />

<script src="http://code.jquery.com/jquery.min.js"></script>
<script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>

jQuery UI

テーマが”start”の場合（※cdnjsを除く）。

cdnjs (by CloudFlare)

（テーマは”lightness”と”smoothness”しかない？CSSに”custom”が付いているのはなぜ？i18nが無い）

<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.2/css/smoothness/jquery-ui-1.10.2.custom.min.css" />

<script src=”http://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js”></script>

<script src="http://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>

Microsoft (Ajax Content Delivery Network)

（Datepikcerの日本語化もする場合）

<link rel="stylesheet" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.2/themes/start/jquery-ui.min.css" />

<script src=”http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.1.min.js”></script>

<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.2/jquery-ui.min.js"></script>

<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.2/i18n/jquery.ui.datepicker-ja.min.js"></script>

Google (Hosted Libraries)

（Datepikcerの日本語化もする場合）

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/themes/start/jquery-ui.min.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/i18n/jquery.ui.datepicker-ja.min.js"></script>

常に最新版にする場合

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/smoothness/jquery-ui.min.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/i18n/jquery.ui.datepicker-ja.min.js"></script>

jQuery (CDN by Media Temple)

（https不可。i18nが無い。常に最新版にすることもできないようだ）

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/start/jquery-ui.min.css" />

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.min.js"></script>

Twitter Bootstrap

レスポンシブにして、Font Awesomeも併用した場合。

cdnjs (by CloudFlare)

（Bootswatchは無い）

<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap.min.css" />

<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap-responsive.min.css" />

<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/3.0.2/css/font-awesome.min.css" />

<!--[if IE 7]>

<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/3.0.2/css/font-awesome-ie7.css" />

<![endif]-->

<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>

BootstrapCDN (by NetDNA)

（Bootswatchも併用した場合。Font Awesomeを使わない場合は、no-iconsではなく通常のCSSを読み込むようにする。jQueryはBootstrapCDNからは供給されていないので例としてGoogleからにした）

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.no-icons.min.css" />

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-responsive.min.css" />

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootswatch/2.3.1/united/bootstrap.min.css" />

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/3.0.2/css/font-awesome.min.css" />

<!--[if IE 7]>

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/3.0.2/css/font-awesome-ie7.css" />

<![endif]-->

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>

常に最新版にする場合

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/latest/css/bootstrap-combined.no-icons.min.css" />

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/latest/css/bootstrap-responsive.min.css" />

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootswatch/latest/united/bootstrap.min.css" />

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css" />

<!--[if IE 7]>

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/latest/css/font-awesome-ie7.css" />

<![endif]-->

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/latest/js/bootstrap.min.js"></script>

余談

URLがのきなみ長いのは、MicrosoftやcdnjsがGoogleに合わせてしまったからか。GoogleのURLが長いのは歴史的経緯の影響が大きいだろう。 （何回か名前が変わったが、URLのパス部分は変えなかった。今なら js.gapi.com/jqeury/1/jquery.min.js とかにできるだろうに。）

また、BootstrapCDNのPopular Files Overviewは興味深い。

参考

• JavaScriptフレームワーク/ライブラリの CDNいろいろ
• JSの CDNの速度比較 （2013年版）
• jQuery UIの Datepickerで日本語のカレンダーを表示する方法