Jestではじめるテスト入門 本日「Jestではじめるテスト入門」がついに発売されました 🎉🎉🎉 peaks.cc CircleCI時代の同僚の伊藤さん @ganezasan が「Jestの自動テスト本の執筆を手伝ってくれませんか？」と声をかけてくれて「これからテストを書きたいって人に向けたJestの入門書を書きたいんですよ！！」って熱く語ってくれて「いいなぁ」と思ったので参加しました。本を書くなんて初めてのことなので、自分なんかに書けるかなぁとドキドキしてたのですが、周りの方々の助けのおかげで、なんとか書き上げることができました。 そして、監修はなんと和田さん @t_wada です。自分が自動テストについて書いた文章を、和田さんに監修していただけるなんて、それだけでとても幸せだなぁと思っていたのですが、「むちゃくちゃ面白かったです！」って言ってもらえたので、もう出版しなくても満足し
const fsbx = require('fuse-box'); const fuseBox = fsbx.FuseBox.init({ homeDir: 'src/', sourcemaps : true, outFile: './dist/app.js', plugins: [ [ fsbx.SassPlugin({ outputStyle: 'compressed' }), fsbx.CSSPlugin({}) ], fsbx.TypeScriptHelpers(), fsbx.JSONPlugin(), fsbx.HTMLPlugin({ useDefault: false }) ] }); fuseBox.devServer('>main.ts **/*.html', { port: 4445 }); シンプル！！ fuse-boxの特徴として ・TypeScriptはデフォル
2015年はCSSが普及した以来となる10年に1度のフロントエンド大変革期で、それまでのツケが一気に回ってきたと個人的に感じていました。目まぐるしく状況が変化していきましたが、2016年になり、個人的にだいぶ落ち着いてきたと感じているので、ここらへんでまとめておきたい思います。 最初に結論を書いておくと、 『React + Redux + react-router + material-ui + axios + ES2015 + Babel + webpack + ESLint + Airbnb JavaScript Style Guide』 という組み合わせが、いま僕の採用しているJavaScriptの環境です。 主要ライブラリは React A JavaScript library for building user interfaces | React 去年、一気に普及したReact
知ってる人には今更と思いますが、今まで知らなかったのでメモメモ。 AppleScriptの代わりにJavaScriptを使えるようになってました。 Yosemiteからの新機能だそうです。 JXAとも呼ばれています。宇宙航空研究開発機構とは無関係です。 (追記：JXAは公式の略称です →Introduction to JavaScript for Automation Release Notes) 詳しくは Appleの公式ドキュメント か、「参考」にあるリンクへどうぞ。 もう一つ記事を書いたのでこちらもよかったらどぞ。 Macのキーボード入力、マウスクリックをJavaScriptで (JXA) Script Editorで使う方法 まずScript Editorを使う方法を説明します。 好きなテキストエディタを使いたい場合は飛ばしてください。 (でも「用語説明」の表示の仕方は覚えておいて
日々の仕事の中で役に立つES2015（ES6）のティップス、コツ、ベストプラクティス、プログラムの見本をご紹介します。コントリビューション歓迎です！ 目次 var vs. let / const IIFEからブロックベースへ アロー関数 文字列 デストラクチャリング モジュール パラメータ クラス シンボル マップ WeakMaps Promises ジェネレータ Async/Await var vs. let / const var の他に、値を格納する let と const という識別子が新たに追加されました。 var とは異なって、 let と const はクロージャのスコープ内で最初に記述されることはありません。 var の使用例です。 var snack = 'Meow Mix'; function getFood(food) { if (food) { var snack
注：このアドオンには，改良版があります。 「全タブを要約するアドオン」を改良。ページ内の選択部分を要約に反映 http://language-and-engineering.hatenablog.jp/entry/20140117/p1 全タブの「リンク集」を自動生成するアドオン。 ネットで調べ物をしているとき，リンクをたどっていくと， いつの間にか開いているタブの個数が膨大になっていたりする。 一つのトピックを深く広く，掘り下げて調べるとそうなりやすい。 そういう状況下で，開いている全てのタブの「要約」のような物を，ブラウザの機能で自動生成できれば便利だ。 自分が調べた結果の全サイトを，リンク集のような形式で抽出・出力してくれる。 そうすれば，情報収集の成果を記録に残しておきやすい。 多数のURLを１タブずつ，手動でコピペしなくて済む。 そのような機能を実現するための，Firefoxのプ
Kei Nakazawa @muo_jp https://t.co/cVgJrfc3 JSXからJSコード生成周辺の最適化ここらかな。クラスや関数を出来る限りfinalに、即値演算をプリプロセス、5ステートメント以内でローカル変数を含まない関数をインライン展開、単純なif-ret展開ってとこか。かっこいいやだー #jsx 2012-05-31 08:16:35
プログラミングのこつ 無駄な名前を極力使わないこと。意味単位に名前空間を細かく階層的に分離すること。 ここで言う名前空間とは 名前空間とは、一つの名前が一意のものを表す空間。例えば、大きな目で見れば、日本語は自然言語の名前空間である。また、専門用語なども名前空間と考えることが出来る。 日本語 { コンニチワ = 挨拶 : : } 中国語 { ニーハオ = 挨拶 } 英語 { ハロー = 挨拶 } また、名前空間は重なり（優先順位）を持つ 同音異義語などの言葉は、それぞれの細かい名前空間の重なりによって一意のものに特定されると考えられる たとえば、「コイが好き」と言った場合 池に関する名前空間 { コイ = すいすいパクパク } チャライ話題に関する名前空間 { コイ = ドキドキきゅんきゅん } お茶に関する名前空間 { コイ = にがーい } 名前空間の優先順位を考えると、一意の意味を知
HTML とは HTML とは、誤解を恐れずに言ってしまうとウェブページ（ホームページ）を作るために使われている言語です。 例えば、以下のようなものが HTML です。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> <title>タイトル</title> </head> <body> <h1>見出し</h1> <p> 本文本文本文本文本文本文本文本文本文本文本文本文本文本文 本文本文<a href="hoge.html">ハイパーリンク</a>本文 本文本文本文本文本文本文本文本文本文本文本文本文本文本文 </p> </body> </html> サンプル イメージ湧きましたか？ では、何故 HTML という
S5とは？ S5はブラウザ上でプレゼンテーション(以下プレゼンと省略)を行なうJavaScriptライブラリです。プレゼンを行なうアプリケーションとしてはパワーポイントが最も有名です。パワーポイントで作成されたプレゼンデータとブラウザ上で作成されたプレゼンデータには違いがあります。 S5の実行結果 ブラウザ上で処理されるプレゼン用のプログラムでは(X)HTML+CSSベースで処理されるため、Webブラウザを搭載しているデバイスであればプレゼン用の資料を閲覧することができるわけです。つまりゲーム機 や携帯電話でもパソコンでも見ることができます。何よりも手軽に作成できるところが利点です。 ブラウザ上で動作するプレゼンライブラリはいくつかありますが、S5は独自のフォーマットではなくOpera Show Format 1.0を採用しています。Opera Show Format 1.0はこちらのUR
IEでJSのエラーになったときに立ち上がるデバッガって大体の人が使いこなせてないのではないでしょうか？ ちなみに僕もそうだったのですが、ふと思い立って調べてみました。 追記 (2008-01-10T14:24:30+09:00) はてブのコメントで、 MS Office持ってない人はVisual Web Developer(VWD)で。/ちょっと前にこんなの書いたので、VWD 2008使う人は参考にしてもらえると幸い。 http://d.hatena.ne.jp/terurou/20071218/119796573 とありました。 これはid:kaorunさんにも聞いていたので後で試そう〜と思ってたので助かります。 合わせてご覧になって下さい。 Microsoft Script Editorとは？ のようにOffice付属のツールだったりします。僕の環境では、 C:\Program Fil
つかいかた // マウスイベントの監視を Autoscroll.start(); // 開始 Autoscroll.stop(); // やめる 動作確認 Opera 9 Firefox 2 Safari 3 IE 6 / 7 デモ → sample_autoscroll.html shift キーを押しながらマウスポインタを動かすと開始！ 手を離せばそのままスクロールされ続ける。 1 ピクセルでも動かせば止まる。 （ shift 押しながら）対象の要素の、外側にいくほど速度アップ。 ソース → Autoscroll.js グリモン → autoscroll.user.js 上に挙げたうちの IE を除くブラウザで。 左下にマウスポインタを持っていくとオンとオフが切り替わるようになってる。 追記：色々なサイトで試してみたら… Safari や Opera では残念ながら、上のような「模範的
bookmark記事からさらって、とりとめもなく纏めた。でも、こういうの纏めても最初ちょこちょこいじってすぐ飽きて止めるのが常だ。 JavaScript for CSS MDC JavaScript - MDC Core JavaScript 1.5 Reference - MDC Core JavaScript 1.5 Guide - MDC JavaScript講座 2007年版 メールマガジン「目指せ！ウェブマスター」JavaScript講座 趣味のJavaScriptなページ Category:JavaScript - Wikibooks そろそろきっちりJavaScript | コラム | エンタープライズ | マイコミジャーナル（但し、「そろそろきっちりJavaScript」がきっちりしていない点 (Kanasansoft Web Lab.)） JavaScriptist -
重たい処理があるんだけど、連続して実行したい場合にメイン処理の実行を遅延させて、最後にセットされた処理だけを実行するようなメソッドを書いてみた。例えば、コマンド入力にも使えるかも? 追記:使えそうなケース はてなスターを連打している間はカウントだけして、連打が切れたらPOSTを行うみたいな処理がすっきり書けるはず。たぶん。 var TimeLag = function(){this.initialize();}; TimeLag.prototype ={ initialize:function(ms){ this.ms = ms; this.exe = null; } ,set:function(func,obj){ if (this.exe && !this.exe.complete) { this.exe.cancel(); } return this.later(func,obj);
最近，Webエンジニアのまわりで注目されている技術に「Ajax」(エイジャックス)があります。従来のWebアプリケーションはインタラクティブな処理の際，ユーザーにページのリロード作業を強いることが多く，決して操作性が良いとは言えませんでした。しかしAjaxを利用すると，サーバーと非同期な通信ができるので，ページをリロードすることなくコンテンツを更新できます。このためデスクトップ・アプリケーションと同様な操作性を持つWebアプリケーションを作成できます。本連載では，実際にAjaxアプリケーションを開発しながら，Ajaxアプリケーションの動作の仕組みや，既存のWebアプリケーションとの違い，実装上の注意点などについて紹介していきます。 目次 第1回 古くて新しいアーキテクチャ 第2回 インクリメンタル検索を実現（クライアント編） 第3回 インクリメンタル検索を実現（サーバー編） 第4回 予測・
prototype.jsを頭から地道に読んでます。 AJAX周りに入る直前までしか読み終わっていませんが、これはなかなか。 [注意] prototype.jsは1.4.0_rc2を使ってますが、この文章には一部、1.3.1のコードが混じっています。 2005-1-15 長いので、本文を追記に移動 ついでにカテゴリをJavaScriptに変更 var Prototype = { Version: '1.4.0_rc2', emptyFunction: function() {}, K: function(x) {return x} } Prototype.Versionでprototype.jsのバージョンが取得できる。 emptyFunctionは何もしない関数のオブジェクト。 alert = Prototype.emptyFunction;とかすると、alert()を呼び出しても何も起き
Points to Note When Shopping for a Washing Machine There are different washing machines brands in New Zealand. When shopping, therefore, you need to ensure that first, you get a quality machine; a machine that will last through many years without breaking down. You check product warranties and reviews when shopping to ensure a machine is a good quality. The material of the drum can be enamel, plas
昨日のSIGHCIのメモです。 最速インターフェースの研究と実践： ライブドア mala氏 まず、自己紹介を兼ねて概論 ブログ「最速インターフェース研究会」 WebのUIの進歩の停滞に対する批判を込めて名付けた 自分の肩書きは「インターフェースエンジニア」 よいUIを作るために「実体験に基づいたチューニングをしている」 自分で使ってみる ユーザの反応を見る 欲望に忠実に作る 作業としては、perl, html, jsの記述 「実のところ、プログラミングに詳しいと言える自信はないし、デザインのことも深くはわからないが、一人で一通りこなせる（完成品を作れる）という点は自分の強み。 よいUIを作るための作業は横断的。割り当てられた仕事をするだけの人ではダメ。」 作品紹介 2ch最速検索 キーボード操作だけでスレッド検索 まだAjaxは使っていない 「めくり型」UIの実験 スクロールしながら読むよ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
