JavaScriptテスト自動化キホンのキ - Qiita
if(add(1, 2) == 3) { console.log("テスト結果OK"); } else { console.log("テスト結果NG"); } のように、ひたすら泥臭いコードを書くハメになる可能性があります。（これは極端な例ですが） また、このままではテスト実行後の結果がとても分かり辛いです。 どんなテストに成功したのか/失敗したのか、全体でどれだけテストがあって、どれだけパスしたのか。 はたまた失敗した場合に、どんな部分がNGだったのか。 これらを解決するためにあるのが、テストフレームワークと呼ばれるものです。 Javaで言えばJUnit、RubyではRSpec、PHPではPHPUnitやPHPSpecなどが該当します。 こういったテストフレームワークを使うことで、テストを簡潔に分かりやすく書けるようになります。 また、こんな感じでテスト結果も見やすく出力してくれます。
ES2015時代のJavaScriptテストツールまとめ - dackdive's blog
最近になって JavaScript を勉強中です。 ES2015 と React にもちょっとずつ慣れてきましたが、テストについては Karma とか mocha とか名前は聞くけど何が何なのかよくわかってなかったので、軽く整理してみます。 JavaScript テストツールの大まかなカテゴリ JavaScript のテストツールは、だいたい以下のようなカテゴリに分類することができます。 アサーションライブラリ テストフレームワーク（テスティングフレームワーク） テストランナー 以下、それぞれについての説明と、代表的なライブラリを見ていきます。 ★は個人的にこれを使おうかなと思ったやつです。 1. アサーションライブラリ テストの一番重要な部分である、「A は B である（assert A === B）」を検証する（ためのメソッドを提供する）ライブラリ。 代表的なものとして、以下があります
一から始めるJavaScriptユニットテスト - Hatena Developer Blog
この記事は、はてなエンジニアアドベントカレンダー2016の5日目の記事です。 こんにちは、はてなでアプリケーションエンジニアをしている id:shiba_yu36 です。先日、buildersconにおいて、現在所属しているプロジェクトでJavaScriptのユニットテストを導入した知見について、「一から始めるJavaScriptユニットテスト」というタイトルで発表しました。 speakerdeck.com この発表は、実際にJavaScriptのユニットテスト環境を作ってみると非常にハードルが高いと感じたので、そのハードルを少しでも下げられればという思いで、非常にシンプルな例で一から環境を作る例を紹介しました。アジェンダは次のとおりでした。 カクヨムのJS環境 JSのテストツールを整理する 通常の関数のユニットテスト DOM操作する機能のユニットテスト カクヨムのJS環境や、JSのテスト
ここ数年前から2015までのモダンフロントエンドを総まとめしてみた｜デロイト トーマツ ウェブサービス株式会社（DWS）公式ブログ
HTML5や、次々と台頭するJavaScriptフレームワークにみられるように、現在のフロントエンドは異常なほど動きがあります。 常にキャッチアップしていないと、いつのまにかOLDな技術を使い続けることになります。実際に今回記事にしてみて、ちょっとつらくなりました。。 しかし、フロントエンドエンジニアとしてコードを書いていて（最近は主にJavaScript）、そのおもしろさに日々驚いています。 そこで今回は、ここ数年~2015年のフロントエンド界隈で一度は流行った技術、今後の動向などをまとめました。タイトルにモダンとありますが、その辺は適当です。ぜひ一度整理してみてください。 (ここではフロントエンドというのを、ざっくりとHTML/CSS/JavascriptをつかったWeb技術のことをいうことにします)。 目次 Javascriptフレームワーク React.js Angular.js
10 Javascript Framework With Rich UI Component
There are many javascript framework that available to use on the internet, most of them offering a simple solution to build modern web application, but not all offering a full rich UI component. Some framework like jquery, mootools, prototype only cover the core feature like animating, effect, DOM manipulation. This rich feature whether you called it component, widget or any other, can help you to
乱数を取得する | 主にjQueryのメモ
/* 0から100の範囲 */ var val = Math.round( Math.random()*100 ); /* 1から100の範囲 */ var val = Math.ceil( Math.random()*100 ); /* 0から99の範囲 */ var val = Math.floor( Math.random()*100 ); Math.random関数で、0から1の範囲の不動小数点数のランダムな値を取得し、100を乗算して、Math.round関数で小数点第1位の値を四捨五入している。また、Math.ceil関数は小数点数を切り上げ（繰り上げ）、Math.floor関数は小数点数を切り捨てる（繰り下げる）。
SIMILE Widgets | Timeline
With this widget, you can make beautiful interactive timelines like the one below. Try dragging it horizontally or using your mouse-wheel. Click on each event for more details. Licensing Timeline is open source software and is licensed under the BSD license. Credits This software was originally sponsored by The Andrew W. Mellon Foundation as part of the SIMILE project. Its original author is David
竹取 JS
画面をダブルクリックで縦書きと横書きを切り替えることができます。要素を指定して縦書きにしている場合は、次回アクセス時に同じ表示が引き継がれます。 どんなサイトでも縦書きにするブックマークレット。 ↓右クリックで「お気に入り」に保存するか、リンクをドラッグしてブックマークバーにドロップします。 「縦書きにする・iPhone 用リンク」 「縦書き可能にする・iPhone 用リンク」 「段組み縦書き可能にする・iPhone 用リンク」 iPhone に登録するには？ とりあえずこのページを共有ボタンからブックマーク。 iPhone 用リンク を長押ししてコピー。 ブックマークを開いて、追加したブックマークを「編集」。 名前を「縦書き可能にする」などに変更し、URL 欄に上記コードをペースト。 最初の「http://」を削除。 注意！ やや動作が重いです！ うまく変換できなかったときは、画面をダブ
wise9 › JavaとJavaScriptの20年戦争
モバイルゲーム 物凄い勢いで勃興したモバイルゲーム業界は、いろいろな課題や問題に直面しながらも巨大化し、今日の時点でのスマートフォン向けゲームの市場へと継承されていきます。 モバイルゲームの歴史 2001 Javaアプリと3Dゲームの登場 Javaが利用できるようになったことにより、ダウンロード型のゲームが供給できるようになりました。 2002 携帯電話端末の大容量化・3D化競争 Java搭載携帯電話端末が登場してからごく僅か1年の間に、アプリのサイズに関しては10倍に広大化し、表現方法も2Dから3Dにシフトし始めました。J-PHONEは『ゼビウス』や『スペースハリアー』などといった昔のアーケードゲームを、ドコモはSIMCITYなどパソコンで世界的規模のヒットを飛ばしたゲームを主力商品としていました。 2003 モバイルゲームの一般化 メモリの制限が厳しいJava仮想マシン上ではなく、OS
suzunari – CodeRepos::Share – Trac
suzunari ブログパーツフレームワーク suzunari Download http://svn.coderepos.org/share/lang/javascript/blogparts_framework_suzunari/suzunari.js Compressed: http://svn.coderepos.org/share/lang/javascript/blogparts_framework_suzunari/suzunari.min.js svn co http://svn.coderepos.org/share/lang/javascript/blogparts_framework_suzunari/ License Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license
blogparts framework suzunariを作成しました。 : tech.kayac.com - KAYAC engineers' blog
ようやく会社のブラインドを閉める方法を発見しました。agoです。 弊社ではブログデコというブログパーツのポータルサイトを運営しており、かなりの数のブログパーツを作成しています。 このたび、そこで得られた様々なノウハウを集めて、ブログパーツフレームワークを公開しました。 元々社内でもある程度まとまったライブラリはあったのですが、コードを読まないと（もしくは作成者に聞かないと）不明な機能群と、使用しても一定のJSを記述する必要があるため公開するまでには至っていませんでした。 （社内からは1年以上前から「早めにまとめて公開を」という声があったんですが。。。） そこで、必要な機能をまとめ直し、通常の全画面ジャック程度であればタグのみで実装可能なJSフレームワークを作成しました。 このフレームワークを使用することにより、各種ブラウザでのExternalInterfaceの各種問題や、wmodeによる
シンプルデザインがクールなJavaScript-WYSIWYGエディタ「TinyEditor」:phpspot開発日誌
JavaScript WYSIWYG Editor ? TinyEditor - Web Development Blog シンプルデザインがクールなJavaScript-WYSIWYGエディタ「TinyEditor」のご紹介です。 次のようなシンプルなデザインが特徴で、色々なサイトデザインにも馴染みそうです。 似たような物で、リッチ過ぎず、どんなページにも馴染みそうなWYSIWYGエディタ実装jQueryプラグイン「wkrte」 というものも以前紹介しましたが、これはこれで使いやすそうですね。 関連エントリ リッチ過ぎず、どんなページにも馴染みそうなWYSIWYGエディタ実装jQueryプラグイン「wkrte」 まだまだあったJavaScript製のWYSIWYGエディタコンプリート シンプルなWYSIWYGエディタ作成用JSライブラリ「jWYSIWYG」 FCKEditorの次世代バー
scrollsmoothly.jsを更新しました - KAZUMiX memo
地味に人気があるっぽいscrollsmoothly.jsを更新しました。使い方などは以下の元エントリーで確認できます。使い方自体は変わっていません。 こだわりのページ内リンクスムーズスクロール scrollsmoothly.js - KAZUMiX memo 更新内容 リンク先がページの先頭になることを前提としていたスクロール量の計算方法を変更。ページの終端付近のリンク先へのスクロールもスムーズになりました。 具体的には、次のサンプルのようにリンク先が最大スクロール先の描画領域の内側にある場合にスムーズではなかった問題を修正しました。 こだわりのページ内リンクスムーズスクロール scrollsmoothly.js 動作サンプル2（スクロール先が中途半端版）
ブロックレベル要素の高さを揃えるheightLine.js[to-R]
ブロックレベル要素の高さを揃えるheightLine.js Web標準の日々のグループディスカッションで出たライブラリ案を作っていく企画、第一弾。 ブロックレベル要素の高さを揃えるjsライブラリを作ってみました。 このライブラリは新バージョンがあります。 レスポンシブWebデザインに対応した「jquery.heightLine.js」 CSSでは複数のブロックレベル要素の高さを揃えれないという問題があります。 このheightLine.jsは、複数のブロックレベル要素の高さを揃える事ができ、2カラムレイアウトや3カラムレイアウトのそれぞれのカラムの高さを揃えたり、複数のブロックレベル要素をfloatで配置する際の高さを揃えたりできる、便利なライブラリになります。 設置方法 head要素内にダウンロードしたheightLine.jsを読み込みます。 <script type="text/ja
![ブロックレベル要素の高さを揃えるheightLine.js[to-R]](https://cdn-ak-scissors.b.st-hatena.com/image/square/a9717624309e36a795026e1b70982163687ccca2/height=288;version=1;width=512/https%3A%2F%2Fblog.webcreativepark.net%2Ficon_200x200.png)
POSTメソッドでリクエストを送信してテキストを受信する - JavaScript
POSTメソッドでリクエストをで送信して受信する XMLHttpRequestでリクエストを送信し、テキストデータを受信します。 文字化け対策 responseTextの文字化けについては「文字コード関連調査[responseText]」が詳しいです。 HTMLファイルの文字コードはUTF-8にします。 テキストデータは文字コードをUTF-8にしてURIエンコードし、Unicodeサイン(BOM)をつけます。 URIエンコードした文字列は、ブラウザのアドレス欄に次のように入力することで調べることができます。 javascript:document.write(encodeURI('文字列')) POSTメソッドを使用するには、open()の第1引数に "POST" を指定します。 open()の第2引数は URL を指定します。 第3引数には非同期通信ならtrueを、同期通信ならfalse
JavaScript » GET送信によるパラメータの受け渡し | PHP & JavaScript Room
searchプロパティは、現在のURLの？以降の文字列を取得します。 オブジェクト名windowは省略可。 サンプルを見る<script type="text/javascript"> function getdata(){ if(window.location.search){ /* URLの「?」以降のパラメータを変数nに代入 */ var n=window.location.search.substring(1,window.location.search.length); /* テキストボックスにパラメータを表示 */ document.form3.elements["getpram"].value=n; } } /* オンロード時に実行 */ window.onload=getdata; </script> <form name="form3" act
Javascript版 location.search汎用クラス | frog.raindrop.jp.knowledge
URLが、 hoge.html?param1=0001¶m2=0002 のばあい、'?'以降を、ブラウザオブジェクトでは、window.location.searchとして取得することができる。 ※ 正確にはsearchの部分はURLに含まないらしい。 これを分割して、連想配列のように取得するクラスを作ってみた。 var oSearch = new CLocationSearch(location.search); document.write(oSearch.item('param1'); のように使うことができる。 function CLocationSearch(sSource) { /* 初期化処理 */ var sAry = new Array(); /* アイテム配列を追加 */ { var nCur = 0, nRet = 0; var sSearch = sSource.s
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.hp-stylelink.com/news/2013/10/20131008.php
ajaxzip3 - Google Code
syboos.jp