JS Girls Tokyo #1で、JavaScript初心者向けの勉強方法について話しました。 私自身、HTML/CSSはできてもJavaScriptが大の苦手でしたが、@hokaccha 先生による修行によって、なんとか理解できるようになりました。 その修業の中で、何をどうやって勉…
はじめてのJavaScript / JS Girls Tokyo #1
JS Girls Tokyo #1で、JavaScript初心者向けの勉強方法について話しました。 私自身、HTML/CSSはできてもJavaScriptが大の苦手でしたが、@hokaccha 先生による修行によって、なんとか理解できるようになりました。 その修業の中で、何をどうやって勉…
Webアプリ開発者のためのHTML5セキュリティ入門
Enterprise x HTML5 Web Application Conference 2014の発表資料です。
JavaScriptライブラリの気になる実装をどうやって見ていくか
はじめに 毎日新しいJavaScriptライブラリが登場していると思いますが、それらがどういう実装になっているかを知ることはライブラリを使う以上に大事かもしれません。 ソースを全部読めば分かるかもしれませんが、それをやるには時間が足りません。 JavaScriptに限った話では無いですが、今回はJavaScriptを例に”特定の機能はどうやってるんだろ?”という事を調べる方法についてです。 探す前にドキュメントに載ってないかを見るのが手間がなくて一番よいですが、書いてない場合は実装を見ます。 Vue.js 今回はVue.jsというAngularJSやKnockoutのようなViewとModelのデータバインディグを行うライブラリを例に、データバインディグはどうやっているのかを2つの方法で調べてみたいと思います。 コードをステップで見ていく これはよく見る方法で皆さんもやったことがあると思い
なぜクライアントJavaScriptの単体テストを書くのが難しいか、考えてみた - mizchi's blog
ってsinonのスタブ漏れを探しながら何度目かわからない感じにキレてた。 とにかく仕事でJSのテスト書くのが辛いので考えてみる。比較的JSのテストに慣れてる自分ですら辛いのだから、世界はもっと辛いに間違いない。サーバーサイドのnode.jsの話ではない。 JavaScriptで完結しない 構造がHTMLの構造と密結合している。装飾や位置、表示/非表示はCSSによって制御されている。 クライアントJSはHTMLと密結合しており、CSSからビューは影響を受ける。それらがネットワークの結果を受け非同期に振る舞いを帰る。その最終的な値を取得するのが難しい。 もちろんサーバーサイドだってDBやネットワークという外部リソースを扱うが、モックの手法が確立しているし、局所的な複雑度は、JSの方がはるかに多い。 言語仕様が貧弱 mochaやjsmineはrspecを真似てるけど、本質的にJavaScript
JavaScript Patterns
A JavaScript pattern and antipattern collection that covers function patterns, jQuery patterns, jQuery plugin patterns, design patterns, general patterns, literals and constructor patterns, object creation patterns, code reuse patterns, DOM and browser patterns (upcoming). Patterns collected while developing 喜感网. General Patterns Function Declarations - creating anonymous functions and assigning t
JavaScriptフロントエンド開発の昨今
フロントエンドのパラダイムを参考にバックエンド開発を再考する / TypeScript による GraphQL バックエンド開発
WCAN 2013 Summer で「ハイパフォーマンスWebフロントエンド」を話してきました
スライド 振り返り 50分という限られた時間の中で、Network・Render・Computeという3本柱についてご紹介するという構成に挑ませていただきました。 恐らくフロントエンドが専門でない方も多くいらした中で、どこまでニュアンスだけでも届けられるように、という面の調整が多かったです。 結果的には目に見えるRenderについて多めに盛り込んで着地しています。 WebKit依存の内容が多めの所から、Canaryに載っている開発者ツールの使い方を通して、パフォーマンス問題の検証と対策について肉付けしている構成です。 参考にした資料のURLリスト 導入のあたり 開発者のための WebKit (“WebKit for Developers” 日本語訳) Performance Checklist for the Mobile Web - YouTube Strangeloop - Impac
最強オブジェクト指向言語 JavaScript 再入門！
この資料では、JavaScript でオブジェクト指向プログラミングを行う際に備えておくことが望ましい、基礎知識や概念について解説します。 【対象者】 ・JavaScript でアプリケーションを構築できる方 ・JavaScript におけるオブジェクト指向プログラミングの 実現手法や原理への理解を深めたい方 ・Java 的なクラスベースの言語との違いに違和感や混乱を 感じてらっしゃる方
JavaScript イディオム集
JavaScriptでは、初見の人にはさっぱりわからないけれども、ある程度慣れた人は当たり前に使うイディオムが結構たくさんあります。知ってしまえば何てことはないので、私の知っている限りのイディオムとその意味を解説します。 （7/3追記: twitter等で教えていただいた内容を追加しました） +v （数値化） var v = "123"; console.log(+v + 100) // 223 console.log(v + 100) // 123100 vを数値化する方法では最もメジャーです。parseFloat(v) に比べて高速なのに加えて、parseFloatとは細かい挙動が異なります（例えば空文字列の場合、parseFloatならば NaN になりますが、 +v の場合はゼロになります）。必ず数値になることが保証されており、文字列などで数値化出来ない場合はNaNが返ります。 v
続々出てきた JavaScript 系新言語。どれを使う? | プログラマーズ雑記帳
先に選択方針を図にまとめたものをあげておきます。 JavaScript 系新言語のどれかは使うべき ? 最初にそもそも何か新しい言語を使う必要があるのか? というところから考えてみましょう。 JavaScript に変換する言語あるいは取って代わろうとする言語 がいろいろできてきている状況を考えると、 今のままの JavaScript には問題がある と多くの人が思っていることは間違いないです。 そのため、今後は JavaScript を直接書くのはやめて、 どれかの言語は使うべきだと思います。 JavaScript にもいいところはある、 新しい言語を覚えるのは大変という人も多いでしょう。 しかし、理由は後で説明しますが、そういう人でも TypeScript は使うべきです。 対象言語 ここに挙げたもの以外にもありますが、私が有名だなと思うものと対象にしました。 CoffeeScript
フロントエンドJavaScriptにおける設計とテスト
今日話さないこと JavaScriptの基礎知識、jQueryの導入 気持ちいいUIやUXがうんちゃら CanvasやWebGLを使ったリッチでイケてるゲームの作り方
実際のサイト上で動作するチュートリアルが簡単に作れるIntro.jsが便利すぎる件 - (ﾟ∀ﾟ)o彡 sasata299's blog
2013年05月08日18:21 JavaScript 実際のサイト上で動作するチュートリアルが簡単に作れるIntro.jsが便利すぎる件 さて、先日簡単なチュートリアル作ろうと思ったんですが、どうやるのが良いのかなーと思って悩んでました。キャプチャ取ってそこに説明文を書いて…ってしてもいいんですけど、キャプチャだと一部分なのでサイト上のどの辺なのかわかりにくかったり、サイト側は変更したのにキャプチャが古いままとかになったりしちゃいますよね＞＜ とか思って探してみたらこちらの Intro.js が便利だったので紹介してみます。 さて、この Intro.js を使うとですね、サイト上で動作するチュートリアルを簡単に作れるんですよ。使い方も簡単で、動作させたい要素に対して data-intro (表示する説明文) と data-step (チュートリアルの何番目に表示するか) を指定します。チ
いやなブログ: 配列操作の比較表: Ruby, Python, JavaScript, Perl, C++
配列操作の比較表: Ruby, Python, JavaScript, Perl, C++ プログラムを書いていると、他のプログラミング言語の記憶とごっちゃになって、「配列の後ろに要素を追加するのは push だっけ、 append だっけ」などと混乱することがあります。特に Ruby, Python, JavaScript はコードの書き方が似ているので、この問題が起きがちです。 そこで、備忘録として、 Ruby, Python, JavaScript, Perl, C++ の配列操作の比較表を作りました。一番慣れている Ruby を基準にしています。間違いなどがあったらご指摘いただけると助かります。他の言語のもあるといいなあ。 Ruby (Array) Python (list) JavaScript (Array) Perl (@) C++ (std::vector)
JavaScriptを勉強したときにポイントになった3冊 - 車輪を再発明 / koba04の日記
今でもなんとなくJavaScript使っている感はあるのですが、勉強をしていく中でポイントになった3冊を紹介。 他の言語の経験があるけどJavaScriptに慣れていない人が読むといい本だと思います。 JavaScript: The Good Parts ―「良いパーツ」によるベストプラクティス jQuery使ってDOM操作を出来るようになってきたけど、100行以上のJavaScriptのコード書いたりするときにこれでいいのかと悩んでいたときに手にとった一冊です。１つ１つのトピックが短いのでとても読みやすいです。 JavaScriptの言語仕様のここが悪いのでこう書くべきということが書かれていて、どうJavaScriptを書いていいのかわからなかった自分にとってはJavaScriptを書く上での指針となっています。 本の薄さからわかるようにたくさん書いてあるわけではないのですが、オブジェク
最近のJSの開発環境について知っておくべきライブラリ10個 - mizchi log
ほんとに10個だと思った？（無意味に煽っていくスタイル） 最近JSだけのリポジトリで無益なゲームを大量に作っては破棄しているのだけど、割とストレスなく出来上がってきたので書く。 長々と書くが、要は次のリポジトリに概要が詰まってる。 mizchi/mizchi_client_boilerplate · GitHub https://github.com/mizchi/mizchi_client_boilerplate 前提として、最近はCSJSでもnodeのインストールを前提とする環境が多い。必須といってもいい。 grunt gruntjs/grunt · GitHub https://github.com/gruntjs/grunt ビルドタスクを簡単に作れる。make、rake、などに相当するが、node製らしくファイルシステムの監視でアクションを作れるのが特長。$ grunt serv
や...やっと理解できた！JavaScriptのプロトタイプチェーン - maeharinの日記
JavaScriptのプロトタイプチェーンについて理解しようとしたのだけど、prototypeとか__proto__とかごちゃごちゃになって、色んなブログを読んでもなかなか理解しきれなくて悶々としていたのだが、図を書いたらパッと理解できた！以下、情報ソースはなるべくECMAScript仕様書（3rd）を元にするようにして書きました なぜ分かりづらいのか？ そもそも、なぜJavaScriptのプロトタイプチェーンは自分にとってこうも分かりづらかったのだろうか？自分なりに分析してみると、まず、「似ているが違う用語が沢山ある」という点がある。ざっとあげただけでも、「prototypeと__proto__」「__proto__と[[Prototype]]」「FunctionとFunctionオブジェクト」などがある。そして次に、「入り組んだ構造が動的に変化する」という点がある。上記のように似たよう
PhantomJS + Selenium::Remote::Driver でスクレイピングをこころみる - tokuhirom's blog
PhantomJS + Selenium::Remote::Driver でスクレイピングをこころみる PhantomJS といえば、WebKit を headless でうごかせて便利なやつですが、PhantomJS 1.8 から Ghost Driver がくみこまれるようになりました。 わかる人むけにかくと「JSONWire Protocol をサポートする httpd が phantomjs にくみこまれた」ということです。 GhostDriver は WebDriver Wire Protocol の1実装です。で、そのクライアントライブラリとして Selenium::Remote::Driver が CPAN にあがっていますから、これをつかって簡単に phantomjs とやりとりができます。 Selenium::Remote::Driver という名前のとおり、Seleni
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://jp.techcrunch.com/2013/11/01/20131031amazon-launches-aws-sdk-for-javascript-in-the-browser/
捗るかもしれないフロントエンド開発環境
http://www.rvl.io/mizchi/js_hell_on_earth