恋に落ちる寄席

恋するBootstrap

 ……はい、どうもどうも。ありがとうございます。拍手ありがとうございます。特に前列の方ありがとうございます。あら、後ろの方からもありがとうございます。すみませんね、催促したみたいで。


 はい、改めまして私、風呂場亭ぷろぱてい亜鈴あれいと申します。ふざけた名前ですよね。そう思いません? 私、自分で名乗るたんびにふざけた名前だなー、って思うんですけどね。つけた奴の顔が見てみたいですね。ま、鏡ごしに毎日十回以上は見てるんですけど。あー、こいつかー、って思うんですけどね。

 で、こんなふざけた名前の小娘は一体何者なんだと思われる方もいらっしゃるかも知れませんが、私こう見えて噺家はなしかなんでございます。え? わかる? ま、高座で座布団の上で喋ってる時点で大体噺家ですけどね。会場の入り口にも寄席よせって書いてあるし。噺家じゃない奴がいる方が大事件ですけどね。「お前は誰だ?」なんつってね。ノートに書かれたりなんかして。

 そんなわけで私、噺家なんですけど。ただの噺家じゃございやせんよ。まず何てったって若くて美しい。いやこれ、本当のことなんだからしょうがないです。物投げちゃいけませんよ。

 私、噺家の傍ら、普段は女子高生やってまして。女子高生、知ってます? 高校行ってる女子なんですよ。女子が最も輝く三年間を謳歌しておりますよ。寝ても覚めてもプレミアがついてる三年間ですよ。

 あとね、趣味でWebプログラミングなんかもやってまして。そうですよ。コードをゴリゴリ書いてますよ。スタバでAirでドヤ顔でゴリゴリですよ。

 そんな私です。ね、いろいろ乗っかってるでしょ? 興味を持ったら、nameプロパティだけでも覚えていってくださいね。


 *


 さて。先ほど言いましたように、私はよくWebプログラムを書いたりするんですけど。WebサイトやらWebアプリケーションなんかを作るためですね。特に最近は、HTMLとJavaScriptとスタイルシートだけで、スマートフォン用のネイティブアプリと遜色ないアプリを作れたりするんで、そっちの方も勉強してるんです。まさに才色兼備ですね。天は二物を与えちゃいましたね。はい、物投げちゃいけませんよ。危ないですからね。


 Webサイトなんてものは、昔は自分で一から書くもんだったんですけど、最近ではFacebookだとかブログサービスだとかが主流になったので、HTMLを全く知らなくてもWebで情報配信できるようになりまして。ましてや、Webアプリで遊ぶ人が、どんな仕組みで作られてるんだろうなんて意識することなどないんですけど。


 ただ、末端のユーザーさんはそれで良いんですけど、サービスを提供する側はそうはいかない。そういうブログサービスみたいなWebプログラムを作る側の人ですね。ちゃんと動くプログラムを作るのはもちろん、デバイスだとかOSだとかブラウザだとか、いろんな環境で動くように書かなきゃいけない。やることいっぱいあるんですよ、ホント。


 だから、ベースの共通的な部分のなんてのは、テンプレートになってて使い回せると開発が楽なんですよね。こういうものを「Webアプリケーションフレームワーク」なんて言うんですけど。

 それの代表格が「Bootstrapブートストラップ」です。

 これ、元々「Twitter Bootstrap」って呼ばれてました。その名の通り、ツイッター社が自社用に開発したツールなんですけど、今ではオープンソースで公開されてて、いろんなWebサイトやアプリで使われてます。


 これだけ爆発的に広まったのには、ちゃんと理由があります。もちろん使うメリットがあるからなんですけど。

 最たるものが、レスポンシブデザインへの対応です。

 Webブラウザって昔はパソコンにしか入ってなかったんですけど、最近だと、奴らがいるじゃないですか。ほら、奴ら。スマートフォンとかタブレットとかいう新顔。

 んで、パソコン用とかスマートフォン用のサイトを別々に作ってもいいんですけど、超大変だし。さらに、それぞれのデバイスも大きさがまちまちじゃないですか。さらに画面も縦向きとか横向きにもできるし。


 その辺の、多様化した環境に柔軟に対応できるような仕組みがレスポンシブデザインです。

 HTMLは一種類だけ用意しときます。で、画面のサイズに合わせて最適なデザインに切り替えるスタイルシートを書くことによって、見せ方を変えるようにしましょう、ってことにしたんですね。それがレスポンシブデザイン。

 パソコンで見ると左側にメニューがあるけど、スマートフォンだと下にメニューがある、っていうページ。見たことありません? それです。

 自分でスタイルシート書くのはとても大変で。だから、Bootstrap側で吸収してくれるととても助かるんです。


 あとは、それなりにカッチョいいデザインに簡単に出来たりとか。用意されている部品コンポーネントが豊富だとか。とにかく楽なんですよね。

 その代わり、そのまま工夫もせずに使うと「またこのデザインか……」みたいに思われちゃうので、ちょっとした工夫というか個性は必要ですけどね。

 その辺、落語にも通じるものがありますね。お客さんに合わせて枕の話を変えたり。個性がないと、どの業界でも生きていくのは難しいですね。楽してばかりじゃダメなんです。


 *


 んで、そもそも「ブートストラップ」ってなんだい、って話なんですけど。

 ブートって、要はブーツです。あの長ーい靴。あの女子高生が履いて蒸れるやつ。

 それの、一番上に輪っかとか金具が付いてて、引っ張り上げやすいようになってるんですけど。そのつまむ部分のことをブートストラップ、って言うんだそうで。ブーツの、ストラップ。なんとなくイメージ湧きました? お客さん、ちょっと賢くなったね。高い金払った甲斐があったね。

 で、話はまだ続くんですよ。その自分の履いてるブーツのつまみを自分で引っ張り上げて、高い柵を飛び越える、みたいな慣用句というかジョークがあって。「あの柵を自力で超えるにはどうすれば良いかって?自分のブーツを自分で引っ張り上げればいいのさ!」なんて。ハハハ、アメリカンジョーク。オーイエス。

 ま、ここまでは良いんですけど。これをコンピューター用語にしちゃった人がいるんですよね。

 コンピューターってのはプログラムを読み込まないと何にも出来ないんですけど、起き抜けにいきなり全部のプログラムを読み込めるほど賢くない。なんで、「プログラムを読み込むための小さなプログラム」ってのを最初に読み込まなきゃならないんですよね。で。この辺の自己矛盾的なパラドックス的な仕組みがたいそうアメリカ人のツボにハマりまして。例の慣用句から取って「ブートストラップ」って名前でいいんじゃね? ってことになったんですよ。

 余談ですが、コンピューターを起動することを「ブート」というのもここからきてるんだそうですよ。また賢くなったねお客さん。元取れたね。


 で、今回のBootstrapも、そういう意味合いが込められてるんじゃないですか? 私が作ったわけじゃないのでよく知りませんけど。


 *


 え? JavaScriptの話、しなくていいのかって?

 やっぱ、しといた方がいいですかね。タイトルがアレだし。

 もちろん、BootstrapってWebサイト作成用の統合フレームワークなので、JavaScriptで作られた汎用モジュールも内包されてますよ。抜かりないです。


 よく使われるモジュールは……

 例えば、モーダルダイアログ(Modal dialog)とかあるんですけど。

 よくイエスかノーかを選ばないと次に進めない場面ってあるじゃないですか。

 あとは、よく分からずに「I Agree」の方を選ぶと莫大な請求がきちゃって大変、とかいう時。あ、そういう時は弁護士に相談してくださいね。ウチに来ても困っちゃいますからね。

 そういうダイアログも、Bootstrapだとオシャレな感じになります。ウィンドウ全体がやや薄暗くなって、中央にダイアログが描画されてる方式。見たことあります?


 あとは、ドロップダウンメニューとかアコーディオンメニューとかタブメニューとか。普段は隠しといて必要な時だけ表示したい、っていうニーズは非常に多いですし、JavaScriptじゃないと実現できない部分なので、もちろん標準で組み込まれてます。


 ちなみにこれらは、jQueryというJavaScriptライブラリの形式で書かれてます。

 jQueryについては、また機会があれば一席設けたいと思ってますよ。

 まあ、jQueryを使わない実装なんてのもあるにはあるんですけど。AngularJS使ったやつとか。実は個人的にはこっちの方が好きなんで、これも機会があれば一席。


 *


 というわけで、便利な便利なWebアプリケーションフレームワーク、「Bootstrap」についての一席でございました。


 え、落語なのにオチはないのかって? いいんですよ。

 Webサイトは、落ちちゃダメなんです。

  • Twitterで共有
  • Facebookで共有
  • はてなブックマークでブックマーク

作者を応援しよう!

ハートをクリックで、簡単に応援の気持ちを伝えられます。(ログインが必要です)

応援したユーザー