こんにちは、斉藤です。 前回のブログをさぼっていたので、あっというまに次のブログの日が来てしまいました。 最近、テスト駆動開発入門(ケントベック著)という本を読んでみて、これは!と思ったので、この開発方法の実践をしてみたいと思います。 今回はQUnitというJavaScriptのユニットテストフレームワークを使った方法でのご紹介です。 http://qunitjs.com/ * テスト駆動開発(TDD)とは? ユニットテストを常に書きながら、プログラムを開発していくスタイルのことです。 ユニットテストを先に書くので、プログラムはそれが通るように開発することが求められます。 具体的な開発のサイクル: 1. テストを作成する(表現したいことを確認するテストを作る。) 2. テストをパスする(1で作ったテストをパスする実装を行う。仮実装でも構わない。) 3. リファクタリングを行う(テストを増や
Nexus 7のAndroid 4.2になってからスクリーンセーバー(DayDream)という機能が追加されました。 そのまんまスクリーンセーバーのことで、Nexus7のドッグに装着したときや充電を開始した時などに動作するアプリケーションになります。 DayClock - Google Play の Android アプリ Anroid 4.2以降のNexus 7以上の画面サイズに対応しています。 Nexus 7のドックと組み合わせるのがベターかな。 標準で時計アプリは用意されているんですが、文字表示が小さいのがネックなので 、画面いっぱいに表示できるようなアプリを作りました。 参考にしたサイト:android.service.dreams.DreamServiceを使ってみる - kinjou_j (転職中)のメモログ
Documentation -xy.css Step 1: ダウンロード xy.cssを下記ページからダウンロードします。 ダウンロード -xy.css Step 2: 水平のグリッド設計 HTMLは非常にシンプルで、classなど余計なものは一切ありません。 <header></header> <article></article> <aside></aside> <footer></footer> 天地にヘッダとフッタ、コンテンツとサイドバーを2カラム水平に配置します。 header, footer { width: 100%; } article { width: 66.6667%; float: left; } aside { width: 30.769231%; float: right; } Step 3: 垂直のグリッド設計 articleとaside内に、見出しとパラグラフ
WebSQL.jsはWeb SQL Databaseを使いやすくするJavaScriptライブラリです。 惜しくもHTML5の仕様からはもれていますが、新しいWebブラウザの機能にWeb SQL Databaseがあります。そんなWeb SQL Databaseをより使いやすくしてくれるライブラリがWebSQL.jsです。 デモです。データを追加したり、削除したりできます。 さらに追加しました。再読み込みしても再現します。 WebSQL.jsはデータベースの作成、テーブルの作成、データのCRUD操作、テーブルの削除が行えます。さらにトランザクションやSQLの実行も可能です。各メソッドはチェーンでつないで実行させることも可能になっています。 WebSQL.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る Web SQL Da
GruntをスクラッチなJavascriptプロジェクトに導入するJavascript 向けのプロジェクトビルドツールである,Grunt というものがある.今お手伝いしているプロジェクトでそろそろ scaffold 的なものが必要になってきた.なので,まずはここのドキュメントを参考にしながら,クリーンでスクラッチな Node 向けのプロジェクトに Grunt を導入してみる.その次に grunt-init で簡単な単体テストのコードのテンプレを作成できるようにしてみる. 前提今回のこのブログ記事で利用する Grunt のバージョンは,現時点の 0.4.x 系バージョンを利用して進めていく.ここにも書いてあるとおり,0.4.x 系では 0.3.x 系と比べると大分変わっているので,従来から Grunt を利用している方は,変更点を確認した方がいいと思う.というより,確認するべき! Nodeバ
世界中でデータがどんどん増えていく中でデータをうまく扱うことはとても重要になってきています。そんな中、New York Timesが積極的に活用していたり、Githubのwatch数ランキングで上位にランクインしていたりと最近人気急上昇中のデータをビジュアライズする為の「d3.js」というライブラリがあります。 本日はこの「データxデザイン」をwebサイト上で実現する為のjavascriptライブラリ”d3.js”について紹介したいと思います。 このライブラリを使うことで、今までなかなか難しくてできなかったウェブ上での「データの可視化」が手軽にできるようになり、複雑なデータを直感的に理解できるようなサイトが作りやすくなります。早速ですがこのd3.jsというものがどういうものかをなんとなく感じるには実際に動いているデモを見て頂くのが早いので以下をご覧下さい。 オバマ大統領の国家予算案詳細 (
はじめに 昨日公開した「第一回 プログラマ向けデザイン勉強会の内容を参考にして妻のパン屋のWebサイトをリニューアルしてみた」の続編を書きます。 今回は僕が苦労したIE6〜8対応のお話です。 実はIE8ユーザーの割合はIE9に次いで第2位! Mac万歳!Chrome万歳!な僕にとって、IEは「どうせ使うことないし、どうでもいいよね〜」という「心の中でサポート対象外なブラウザ」でした。 しかし、店のWebサイトのアクセス解析を見てみると、実はIE9とIE8が1位、2位を占めていることがわかりました。 よく見ると8位にはIE6がまだしぶとく生き残っています。 この結果を見ると、「うーん、こりゃ完全に無視するわけにはいかんな・・・」と考えざるを得ませんでした。 IE対応を全く考慮していないとこうなる まず最初に、IE対応を全く考慮していないと、いったいどんな表示になるか見てみましょう。 トップペ
function init() { var name = "Mozilla"; // name は、init が作成するローカル変数 function displayName() { // displayName() は内部に閉じた関数 console.log(name); // 親関数で宣言された変数を使用 } displayName(); } init(); init() 関数はローカル変数 name を作成し、それから関数 displayName() を定義しています。displayName() は init() の中で定義されている内部関数で、その関数本体の内部でしか利用できません。displayName() 自体はローカル変数を持っていませんが、外側の関数で宣言された変数にアクセスできるので、displayName() では親関数 init() で宣言された変数 name を使用
新しく書き直した。 以前のバージョンと全然互換性がなくて申し訳ないのだけど、可読性とかかなり使い勝手が良くなっていると思います。ライブラリ自体のコードも分かりやすくなっているはず。 http://mohayonao.github.com/timbre.js/ Chrome, Safari, Firefox あと node.js で使えます。 あとついでに SuperCollider みたいな関数を集めたものも用意しました。 http://mohayonao.github.com/subcollider.js/ timbre.js と合わせてアルゴリズム的なものを作るのに使えます。 デモ どういうことができるのかは簡単なデモで確認できます。 http://mohayonao.github.com/timbre.js/beatbox.html http://mohayonao.github.c
白石 俊平 es6 ECMAScript, javascript 0 Comment 昨日(2013/1/17)、Web先端技術味見部#15でECMAScript6について学んできました(参加者によるツイート)。一応主催者という立場上、勉強会を円滑に進めるため、事前に割と下調べして勉強会に臨んだわけですが、せっかくなので、その成果をまとめて公開しておきたいと思います。 とは言え、量が非常に多いので、複数回に分けての掲載です。 ECMAScript6の基礎知識 仕様に関するあれこれ ECMAScriptとは、ご存じの方も多いと思いますが、JavaScriptの公式な仕様です。ECMAScriptが仕様、JavaScriptが実装に当たるわけですね。 ECMAScriptのメンテナンスはTC39という部会によって行われており、最新バージョンである6は、現在絶賛仕様策定中です。コードネームは「
これ行って来ました。 Web先端技術味見部#15 (今回は「ECMAScript6をそろそろ触る」!) : ATND 楽しかった! JavaScript (JS)とECMAScript (ES)の違いとか、そういうのはググってください。 Firefox Auroraが現状ES6最先端ぽい。次点Chromeは chrome://flags から「JavaScript の試験運用機能を有効にする」を有効にして再起動でES6の機能が使えたりするらしい。 Firefoxで メニューのツール>Web開発>スクラッチパッド でスクラッチパッド。なんかコンソールより便利なやつ。 配列内包表記も使えるように。でも見づらいので三項演算子(?:演算子)みたいな扱いになりそうに思った。 サンプルコードいろいろ let ブロックスコープになる。varと有効範囲が異なる。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く