Archive for the ‘ 開発ツール・技術 ’ Category
jQueryを30日で学習できる動画コンテンツが出来たようです。Tutsplusが仕掛けているようなのでクオリティ的には安心かな。
↑ こちらからメアドを登録すればOK。
↑ すぐに#1のレッスンのURLが届きます。10分〜15分の動画コンテンツらしいですね。
#1のレッスンを受けてみましたが、とっても丁寧な感じですね（ドットインストールははしょりすぎなのですけどね・・・）。
英語ではありますが、そろそろjQueryを・・・という方はいかがでしょうかね。
愛用しているTwitter Bootstrap、遂に「version 2」になりましたよ。今まで「version 1.4」だったのでメジャーバージョンアップ！です。これは見逃せない、というか、感動した！
個人的に「おぉ！」と感じたところをざっと紹介してみるよ！（※ コメントが手抜きっぽかったので追記しました汗）。
↑ スマホ＆タブレット時代にこれは大事。
↑ これがずっと欲しかった・・・。あとはボタンのサイズがもうちょっと柔軟だといいですよね。
↑ こちらも待望の！スマホなんかでも十分に実用的になってきましたね。ちなみにボタングループっぽいチェックボックスもつくれますよ（iPhoneでよく見る奴）。
↑ 管理画面なんかで重宝しそう。
↑ いたれりつくせりすぎる・・・。
↑ これもいまどきのサイトで良く見ますよね。すごい！
↑ jQueryのプラグインとか探さなくていいですね。
↑ こちらも検索のユーザビリティを高めるのに大事。
↑ スクリプトを軽量化する際に使えるのでは、と。
HTML5を勉強するのもいいですが、もうなんつーか、これだけでいいような・・・。ドットインストールのレッスンも作り直したいぐらいの感動巨編ですよね・・・これ。すごいすごいすごいです。
詳しくは以下からどうぞ！ドットインストール本体もversion 2.0で作り直したいぞ、と。
先日Facebookに買収されたソーシャルQ&Aの「friend.ly」ですが、ヘッダーのアニメーションが気になっていたのでどうやっているのか調べてみました。
↑ こういう集中線状の背景がアニメーションします。
↑ 透過PNGをCSSアニメーションでぶんまわしていました。
↑ Inspectしてみた。
「overflow:hidden」にしておけば綺麗に表示されますね。「お、FLASH?」と思うような表現もCSSで実現できちゃう時代ですなぁ。
ま、それだけですがちょっと勉強になったので。どこかで使えそうです。
なんかいつも検索しているような気がするのでメモ的にエントリー・・・。
さて「1ピクセルへのこだわり」に関するエントリーいろいろです。神は細部に宿るので参考にしたいところです。
グラデーションの開始色と終了色でピクセルラインつくるってところが目からウロコでしたよ。必読。
いつもながら丁寧ですよね・・・すごい。基本から応用、豆知識からTipsまでざっと網羅されています。後半にいくほど参考になるし、読ませるエントリーです。
素敵サイトをひもときながら丁寧に説明してくれていますよ。効果がある場合とない場合の対比がとってもわかりやすい。
そしてさらに実践編まで・・・。Photoshopでごにょごにょしたい人は是非。
こちらは海外記事の紹介ですね。参考になります。
Web Designingで特集されたらしいですね。本文読んでいないですが、こちらの資料ページのサンプルも参考になるかと。
以上ですかね。他にも参考になるサイトがあれば是非教えてくださいな。
bitbucket、気になりますよね。無料でプライベートリポジトリが無制限です。5ユーザーまでですが十分ですよね。Github、個人的に好きですが、有料はちょっとね、という人はいかがでしょ。
↑ ちなみにbitbucketの料金プラン。
実験的にインポートしてみたので作業ログを公開。
↑ メニューのこちらを選択して・・・。
↑ こちらからインポートします。認証はGithubのメアド、パスワードを入れます。
↑ なお、リポジトリのURLはGithubのこちらのHTTPより。
↑ インポート中。ものによってはちょいと時間かかる。終わったらメールしてくれるので他の作業していてもOK。
↑ 出来た！
↑ Admin画面。Web Hooksがないのは痛い人には痛いかな。
↑ Issue Trackingもできますな。
↑ Wikiもね。
インターフェースや細かいところでまだ（個人的には）Githubに軍配があがりますが、機能的には十分ですね。小規模なベンチャーだったらこちらでいいような気がしないでもないですのぉ・・・。
というわけで気になる方は以下からどうぞ。
あ、あと細かいですが、ユーザー名は早い者勝ちなので、登録だけでもしておくと良いかと思います、はい。
あ、これやばい。vimをインタラクティブに学べるツールですよ。チュートリアルに加え、簡単なクイズや、vimが手元にない人でもいろいろ試せるサンドボックスがついています。
↑ チュートリアルがやたら充実しています。ひととおりやればばっちりですね。
↑ ミニクイズみたいなのもありますね。
↑ サンドボックスでいろいろ試せます。
vimはプログラマーの間で評価が高いですよね・・・。僕も含め、そろそろマスターしないとな・・・と思っている人も多いのでは。まずはこちらから試してみるのはいかがですかね。
» Open Vim
以前ご紹介したBootstrapですが、良い感じにマイナーバージョンアップを繰り返しているようです。地味にウォッチしていたのですが、本日、v1.3.0になってかなり使いやすくなったので再度ご紹介。
これが一番うれしいぞ！
以前はドキュメンテーションがいまいちで、完全に動作させるにはデモページのJavaScriptを解析して・・・なんてことが必要だったのですが、JSライブラリもがつんと拡充された模様です。
↑ これらをIncludeすればすっきり実装できます。
↑ Modalの実装例。こういうコード例やオプションなどがなかったのでかなり助かる！
こういうの欲しいなぁ、と思っていたスタイルも続々と追加されています。
↑ パンくずナビゲーションとか。
↑ ボタンの種類も増えた。
↑ こういうミニラベルも欲しかった！
↑ ダミー画像も公式サポート（ってほどでもないけど便利）。
さらにグリッドのカスタマイズまで出来ちゃうようです。940pxとかないわー、とかな人はがしがしいじっちゃってください。
↑ かなり柔軟なレイアウトが可能になりましたな。
いくつかのレイアウトに関してはちゃんとしたデモページができたようですね。ここらへんをコピペしてちゃちゃっと作っちゃうといいかもですよ。
↑ まだ数は少ないけど勉強になります。
なんだかバージョンアップが意欲的すぎて個人的には嬉しい限り。このままいくとResponsive Designにも対応しそうな勢いですね！（それはないかｗ）。
なお、後方互換性がいまいちだったりするので、ライブラリのバージョンあげてレイアウトが崩れたら地味にコードをみながら修正してみてくださいね（TopBarまわりのマークアップも若干以前と違いますな）。
驚くほど簡単に今風のサイトができてしまうのでこの連休中になんか作ってみるか！という方はいかがでしょうかね。ご利用は以下からどうぞ！
同じケータイ会議メンバーのueBLOGさんに教えてもらいましたよ・・・英語版限定ですが、Androidマーケットだとオライリー本が激安なんですね。
たとえば「The Ruby Programming Language」ですが、Amazonだと2922円。
» The Ruby Programming Language
iTunes Storeだと600円。
» The Ruby Programming Language – O’Reilly Media, Inc.
が！Android Marketだと384円！
» Ruby Programming Language – Android マーケット
実際の読み心地はどうか、早速購入してみました。
↑ 公式アプリだけあって読みやすいです。フォントの大きさも変えられるので便利。
↑ さらにExportもできるだと・・・。これを使えば好きなリーダー使うことができますね（しかしグレーな機能だな、これ・・・）。
オライリー本は紙面だと相当重いですし、検索もできないですからね・・・。人によって好き嫌いがあるかと思いますが、電子書籍には向いているかと思います。いままでiPod Touchで買っていましたが、いやはや、これは便利だ。技術者の方は是非ご利用ください。
というわけでF-12CやAndroidの便利技や便利アプリは以下もご覧くださいな。
土曜日の朝ですが、これはテンションがあがる！！！
Twitter社から開発者むけに素敵なプレゼントですよ・・・これはすごい。今風のインターフェースがさくっと作れるCSSフレームワークですな。これだけでかなり高品質なデザインが実現できちゃうのではないでしょうか。
↑ ここ最近で一番テンションあがった！Twitter△！
すんごくたくさんの機能があるのですが、いくつかご紹介。
↑ まずはグリッド。部品だけでなく、こういう基本からサポートしてくれるとは嬉しい限り。
↑ レイアウト系。可変幅のカラムもさくっと実現。
↑ ソート機能付きのテーブルとか。
↑ もちろん一番面倒なFormもサポート。これがとっても嬉しいぞ。
↑ かっちょいいボタンも！
↑ 作るのが面倒なタブ式メニューも・・・。
↑ Modal WindowsやTooltipsとかもりだくさんすぎ・・・。
↑ 通知メッセージ系も嬉しい。
また、実現方法も簡単で、CSSをホットリンクできる他、GithubからForkもできますな・・・。いやはや、これはすごい。というわけで詳細＆ダウンロードはこちらから。
スタイルシートとか見れば一発ですが、それも面倒、という人のためのブックマークレットをご紹介。今見ているサイトのWebフォントを教えてくれるものですな。
↑ このボタンをブックマークレットとしてインストールすればOK。
↑ こんな感じに教えてくれます。
このサイトのフォント素敵だなぁ、と思ったときに便利かもですね。ご利用は以下からどうぞ。
誠Biz.IDの「Webサービス図鑑」を応援中です！
