Chrome Developer Toolsを使いこなそう！エヴァンス本を読んだことがない人、ネット上の情報を聞きかじったことがある程度の人、そんな人たちを対象に、ドメイン駆動設計について、わかりやすく説明してみました。
schteppe.github.com
p2.js by schteppe A 2D physics engine for JavaScript View on Github Documentation
[JavaScript]\uXXXX形式にunicodeエスケープする関数 / LiosK-free Blog
2007-12-22 カテゴリ: Client Side タグ: JavaScript Tips Unicode JSON さっきはPerlにはまるとか言っておきながら結局JavaScript… JavaScriptの文字列を、\uXXXXの形式のUnicodeEscapeSequenceにエスケープする関数を書きました。 JavaScriptの文字列をJSONとかでよく見かける、 \u672c\u65e5\u306f\u6674\u5929\u306a\u308a の形式の文字列に変換する関数です。ソースやサンプルは続きで。 ソース var unicodeEscape = function(str) { var code, pref = {1: '\\u000', 2: '\\u00', 3: '\\u0', 4: '\\u'}; return str.replace(/\W/g, fu
Escape Codec Library: ecl.js
このページはhttp://nurucom-archives.hp.infoseek.co.jp/digital/にあったものをiswebのサービス終了に伴い伊藤がコピーしたものです。 Shift_JISエンコードやEUC-JPエンコードなども可能な escape エンコード・デコード関数のライブラリ 文字列をすべてのコンピュータで読めるような形式に変換したり、変換されたものを元の文字列にデコードすることができる関数のライブラリです。 ビルトイン関数 escape() , unescape() とは異なり、どの種類のブラウザでも同じ変換結果が得られます。 JISコード変換テーブルを搭載し、従来JavaScriptでは実現が困難であった、Shift_JISコードやEUC-JPコードなどの文字コードとしてのエンコード・デコードも可能となっています。なお、この変換テーブルには、直接漢字は記述せず、
Sugar - A Javascript utility library for working with native objects.
Sugar is a Javascript utility library for working with native objects. It lets you do stuff like this:
直感的に使える便利なjavascriptライブラリ「Sugar」 - 世界中の羊をかき集めて
「Sugar」公式サイト http://sugarjs.com/ すごくいいです。 ネイティブオブジェクトを拡張し、便利なメソッドをたくさん使えるようにしたライブラリ。 Ajaxやアニメーション、Dom操作をするためのライブラリではありません。 Javascriptで面倒な日付操作や、配列、数値、文字列、オブジェクト等の操作を楽にするためのライブラリです。 もちろんクロスブラウザ対応されており、jQueryとも併用できます。 また、下でも書いてますが、日本語を考慮した処理がなされていて、日本人には嬉しいライブラリだと思います。 「Sugarの機能について」 http://sugarjs.com/features 「SugarのAPI一覧」 http://sugarjs.com/api もう、上のページを見れば、その便利さがすぐ分かると思います。 その中でも、便利そうなメソッドを見ていきまし
gulp.js
A toolkit to automate & enhance your workflowLeverage gulp and the flexibility of JavaScript to automate slow, repetitive workflows and compose them into efficient build pipelines. TypeScriptDevelop in any languagePNGCreate assets with any toolMarkdownWrite using any formatJavaScriptGet compiled codeWebPGet optimized imagesHTMLGet rendered content
[Polymer] Material Design を使った Web ページを作ってみる | DevelopersIO
Material design with Polymer Google I/O 2014 で発表になった「Material Design」ですが、Web の場合は Polymer で提供されています。Polymer は Web Components を使ったフロントエンドフレームワークです。昨年の Google I/O で発表されました。 ということで、リファレンスを参考に Polymer を使って Material Design の Web ページ制作を試してみたいと思います。 デモで Material Design の世界を体験してみよう その前に、Material Design でどのような Web ページが作れるのか、デモの Web ページが公開されているので、ちょっと触ってみましょう。以下の 3 つのデモが公開されています。 Topeka (クイズアプリ) Paper Eleme
![[Polymer] Material Design を使った Web ページを作ってみる | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/72ef0cd6f2febb767fc5805699941053937cbb1b/height=288;version=1;width=512/https%3A%2F%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2014%2F06%2Fpolymer.png)
Polymer Project
The Polymer library is in maintenance mode. For new development, we recommend Lit. The Polymer library provides a set of features for creating custom elements. These features are designed to make it easier and faster to make custom elements that work like standard DOM elements. Similar to standard DOM elements, Polymer elements can be: Instantiated using a constructor or document.createElement. Co
最強オブジェクト指向言語 JavaScript 再入門！
この資料では、JavaScript でオブジェクト指向プログラミングを行う際に備えておくことが望ましい、基礎知識や概念について解説します。 【対象者】 ・JavaScript でアプリケーションを構築できる方 ・JavaScript におけるオブジェクト指向プログラミングの 実現手法や原理への理解を深めたい方 ・Java 的なクラスベースの言語との違いに違和感や混乱を 感じてらっしゃる方
ブラウザの言語をJavascriptから調べる。
Photo by midnightglory 多言語対応のサイトを作っていると問題になるのが、メッセージの切り替えです。PHPやRailsを使っている場合は、HTTP_ACCEPT_LANGUAGEを見てメッセージ生成を切り替えれば良いのですが、静的ファイルの場合は、そうは行きません。 そこで、今回はJavascriptだけでブラウザの言語を取得する方法を調べてみました。 ググっていると、ブラウザ依存ですが取得する方法が見つかったので、各ブラウザで検証した所、navigator.browserLanguage、navigator.language、navigator.userLanguageのいずれかで取得できることが分りました。 ただ、この値はブラウザのデフォルト言語環境のなので、HTTP_ACCEPT_LANGUAGEとは違う値が返ってきます。たとえば、日本語OSに英語版のFirefo
はじめてのJavaScript / JS Girls Tokyo #1
JS Girls Tokyo #1で、JavaScript初心者向けの勉強方法について話しました。 私自身、HTML/CSSはできてもJavaScriptが大の苦手でしたが、@hokaccha 先生による修行によって、なんとか理解できるようになりました。 その修業の中で、何をどうやって勉…
初心者でも絶対わかる、WebGLプログラミング＜three.js最初の一歩＞
初心者でも絶対わかる、WebGLプログラミング＜three.js最初の一歩＞ 小山田 晃浩（株式会社 ピクセルグリッド） WebGLはとても高度な技術である一方、APIは低レベルであるためそのまま使うにはどうしても冗長な準備を行う必要があります。一方で、JavaScriptライブラリーを通して高レベルなAPIとしてWebGLを利用する方法があります。こうしたJavaScriptライブラリーとしてはthree.js、Away3D.js、Babylon.jsなどが有名です。その中でも特に人気があるthree.jsを通して、WebGLを利用する方法を解説します。(three.jsのリビジョンは執筆現在の最新であるr65を利用します) three.jsを手に入れる three.jsはhttp://threejs.org/から手に入れることができます。downloadから、zipファイルを手に入れま
JavaScript 徹底入門のための資料＆書籍まとめ - 酒と泪とRubyとRailsと
JavaScriptはブラウザから簡単に使えるし、jQuery Pluginも簡単に追加できるので、つい基礎をおろそかにしたまま使っていて、ちょっと凝ったことをしようとした時にいつもハマっていました。ということで今回は、独習JavaScriptの第二版を購入して読み進めつつ、ネットのお勧めのドキュメントを見て、補足しながら勉強していったのでそのメモです。 (03/09 21:50) JavaScriptの習熟度を上げるための勉強フローを追加 🍄 [動画] ドットインストールJavaScript入門 JavaScriptを本当に使ったことがない初学者の方にお勧めしたいのがドットインストールの動画。説明が環境構築からスタートしてくれるので、つまずことなく最初の一歩を踏み出すことができます。 😸 [Web] JavaScript基礎文法最速マスタ 『JavaScript基礎文法最速マスター』
すごい便利になった！javascript入門の基礎知識と小技まとめ
作成：2013/12/24 更新：2014/11/01 Web制作 > サイト構築中にちょっとした動きをのせたいとき、どうすれば良かったのか何度も調べ直さないといけないことがあります。今回はJavaScript で初心者の方でもすぐ活用できるように、使用頻度の高いリファレンスと基本知識をまとめました。 エンジニア速報は Twitter の@commteで配信しています。 もくじ できること １．リファレンス スクリプトの書き方／基礎知識 ２．スクリプトの記述 ３．文字列／特殊文字 ４．演算子 ５．オブジェクト ６．プロトタイプ ７．イベント ８．変数 ９．if文 １０．配列 １１．連想配列 １２．正規表現 １３．デバッグ できること １．リファレンス JavaScriptは開発環境の準備がほぼ不要で、コピー＆ペーストだけで、動くものができてしまいます。他の言語だとそう簡単にはいきません。サ
javascript での配列のコピーの方法 - Qiita
最初に オブジェクトのコピーのことは、ここには書かない javascript では、オブジェクト・配列の代入は参照 (reference) b = array とかやっても値渡しなコピーしない コピーの方法の王道がない (らしい) jQuery の場合は、コピー用の $.extend() がある オブジェクトに0,1,2,3とかのキーを入れたものは、配列と違う! 2つのコピー: deep & shallow コピー deep コピーと shallowコピーの2つの方法がある 1. ディープコピー deep copy 完全な複製 オブジェクトのプロパティが別オブジェクトを参照していれば、参照先オブジェクトも含めコピー 2. シャローコピー shallow copy プロバティ値や要素値だけのコピー 参照先はコピーしない shallow コピーの方法 concat
JavaScriptで覚えておくとよいデータ構造 - 配列・オブジェクト - いろいろ解析日記
JavaScriptで必要なデータ構造の覚書です。 目次 配列 配列を生成する。 配列にデータを追加する。 配列にデータを格納する。 配列からデータを取得する。 配列中のすべてのデータに同じ処理をする。 オブジェクト オブジェクトを生成する。 オブジェクトにデータを格納する。 オブジェクトからデータを取得する。 オブジェクト中のすべてのデータに同じ処理をする。 関連記事 配列 配列は複数件のデータを扱うためのデータ構造です。 ■配列を生成する。 配列の生成は以下のように行います。 var 配列の名前 = []; var 配列の名前 = [ データ, データ, … ]; 配列の生成では、配列の名前を指定します。 もし、生成時にデータを格納する場合に、[]内にデータを指定します。 なお、JavaScriptでは配列の生成時にサイズを指定しません。 例えば、空の配列array1を生成するには、以
多彩な表現力のWebGLを扱いやすくする「Three.js」
多彩な表現力のWebGLを扱いやすくする「Three.js」：Webグラフィックをハックする（5）（5/5 ページ） インタラクティブ性を取り入れる ここまで、Three.jsのさまざまな機能の使用方法を解説してきました。読者の皆さんが「これは面白い、自分でも何か作ってみよう！」と感じられていたら幸いです。 しかし、記事中で取り上げてきたサンプルコードは、いずれも一方的に映像を流し続けるだけのものでした。3次元映像を自分で操作できるのがリアルタイム3Dグラフィックの醍醐味ですから、このままでは物足りないですね。そこで、マウスによるカメラ操作などの基本的なインタラクティビティの実現方法を解説して、この記事の締めくくりとします。 リサイズへの対応など これまでのサンプルコードには、インタラクティブ性の欠如の他にも以下の欠点がありました。 WebGLをサポートしないブラウザへの対応がない 画面サ
D3.js の d3.svg.line() を試してみた
circles.enter() .attr('cx', function(d, i) { return i * 280 / n + 10; }) のような座標を計算する関数が何箇所かに散らばっていた。 これ、d3.svg.line() を使ったらまとめられるし、便利な interpolate の機能も使えるよ、というのが今回のお話。 d3.svg.line() の使い方 たとえば var line = d3.svg.line() .x(function(d, i) { return i; }) .y(function(d, i) { return d * d; }); としておくことにする。line.x() とすると function(d, i) { return i; } を返してくれるので、関数を再利用してコードが読みやすくなる。line.y() も同様。 さらに、line([5,2,
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScriptユーティリティライブラリの紹介
