2014/3/27 JSオジサン#1 で発表したライトニング トークのスライドです。 スライド自体にはあまり中身はありません。
初学者にJavaScriptを教えてみた
2014/3/27 JSオジサン#1 で発表したライトニング トークのスライドです。 スライド自体にはあまり中身はありません。
JavaScriptのSource Mapの内部表現について
プログラミング (iOS, JavaScript, Jenkins, Sikuli) とMacやiPhoneなどの話題が中心のブログ CoffeeScriptなどの別言語からコンパイルしたり、ClosureコンパイラなどでMinifyしたりしたソースをデバッグしているときなどに、生成されたJavaScriptソースコードから変換前のオリジナルソースの場所を知りたいときがあります。 それを知るための技術がSource Mapです。これがどのようにオリジナルのソースを参照しているのか気になったので調べてみました。 CoffeeScriptをコンパイルしたときのソースマップ 簡単な例として、フィボナッチのCoffeeScript版をソースとして用います (fibonacci.coffee)。 fib = (n) -> if n == 0 or n == 1 n else (fib n - 1)
JSオジサンで現在のJavaScript ASTについて発表してきた
<ul> <li> JavaScript ASTの現在 </li> <li> 簡単なAST概要 </li> <li> 実際に使われてるツールを見て </li> <li> ASTを使ってツールを書いてみる話 </li> </ul> <p> 等について書かれています。 </p> <h2> 「LTおじさんの歴史『人はなぜLTをするのか』」 – @kyo_ago </h2> <blockquote> <p> <a href="http://0-9.sakura.ne.jp/pub/lt/JSOjisan/start.html" title="LTおじさんの歴史『人はなぜLTをするのか』 #jsオジサン">LTおじさんの歴史『人はなぜLTをするのか』 #jsオジサン</a> </p> </blockquote> <ul> <li> LTオジサンの歴史 </li> <li> 週に2回ぐらい
WebStorm+Chromeでウェブサイトコードリーディング
IntelliJさんのChromeプラグインが進化してた – しおしおの雑記帳 を見て気づいた事。 今までは WebStorm -> JavaScriptデバッグ実行 -> Chrome起動 という方向でしか、WebStorm内のデバッガーは使うことが出来なかったのですが、 WebStorm 8 EAPからは、Chrome -> Inspect in WebStorm -> WebStorm という双方向でデバッガーを使えるようになったみたいです。 これを利用して、簡単にWebStormを使ってウェブサイトのコードを読むことができるのでその手順の説明です。 手順は単純で WebStormで適当なプロジェクトを開く(プロジェクトを開いてないと”Inspect in WebStorm”ができない) Chromeで読みたいサイトを開く Chromeのコンテキストメニューから”Inspect in
Present Boldly
Presentation Details AngularJS And The Computer Science Of JavaScript Created by undefined Add a short description of your presentation. Formatting is supported. Loading
大規模JSプロジェクトのための、モダンなjavascript/coffee-script の学習用資料まとめ - mizchi log
A社coffee-scriptエヴァンジェリストのmizchiです。今日は昨今の大規模JSの需要の高まりに応えるべく、お前が知ってる資料をまとめろとのお達しが下ったので、社内wiki面倒だしここに載せてますん。 前提 大規模JSをモジュール化する為にcoffee-scriptのシンタックスシュガーでOOPのパラダイムを持ち込む coffee-scriptの煩雑なコンパイル作業を避けるために、Rails/Nodeではアセットパイプラインを使って動的にコンパイルと圧縮を行う JSプロジェクトを部分的にnode化してTDDでサイクルを回す coffee-scriptに関しては、基本的には本家チュートリアルと The Little Book on CoffeeScript を読めばいい coffee-script チュートリアル 本家チュートリアル CoffeeScript little book
カジュアルJavaScript AST
今日の概要 実は使われてるJavaScript AST JavaScript AST(Abstract Syntax Tree)とは? JavaScript ASTを使ったツール紹介 使うだけじゃなくて書いてみよう browserify Node.jsで書かれたものをブラウザ向けに変換するツール Node環境で開発 -> browserifyでビルド -> ブラウザで動く JavaScriptのコードを 変換 する ≒ JavaScript ASTを見て変換 する 本体の色々な部分、transform pluginなどでASTを使ってる
ayapi.github.io
Hackers Barってなに？ Hackers Bar 六本木にハッカーがおもてなしをするバーが誕生します。 「Hackers Bar」は、ハッカーのプログラミングライブや ビジネスメイキングを楽しむ空間です。 ぁゃしすぎだし、まじで営業してんの！？って半信半疑で行ってみたら、 まじで営業してたｗ 存在してたｗｗｗｗ ぉ店自体のくゎしぃレポゎねとらぼにも載ったみたぃ カクテル名が「ブルースクリーン」「スパゲッティ」って不吉すぎるでしょ！ 六本木にできた「Hackers Bar」行ってきた - ねとらぼ ゃってもらったライブコーディング 弟が、ぁゃぴにソファーをくれるって言ってて、 ゃったーってかんじなんだけど、③人掛けでまじデカぃっぽぃ！ ぉ部屋の㊥ゎだぃじょぶっぽぃんだけど、 運ばれてくる時、マンションのエレベーターにちゃんと入るのかな？ …ってことで、それを計算したくて／(^o^)＼
Sendagaya.js（仮）を開催しました - pixiv inside [archive]
こんにちは 最近よく LGTM.in/g に載っている @catatsuy です． 先週の 3月19日（水）に Sendagaya.js（仮） on Zusaar がピクシブオフィスにて開催されました． Sendagaya.js（仮）で発表された『超大量絵馬』のことは当ブログでもエントリーがあるので参考にしてください． 超大量絵馬ができるまで - pixiv engineering blog 「超大量絵馬」の裏側 (1) - pixiv engineering blog Sendagaya.js（仮）は事の発端は社内勉強会で超大量絵馬のコードリーディング会をしようという話を私と @geta6 さんでしていたところ，マネージャーの @norio さんから折角やるなら外部の人も呼んだ方が面白いから外部の人も呼ぼうというようなことを言われて企画されました． そのため当初は何人くらい集まるのか想像
![Sendagaya.js（仮）を開催しました - pixiv inside [archive]](https://cdn-ak-scissors.b.st-hatena.com/image/square/e8b2037c1dbc5bf97adfa385a1c548c0382b23ce/backend=imagemagick;height=288;version=1;width=512/https%3A%2F%2Fcdn.image.st-hatena.com%2Fimage%2Fscale%2F078f187b9281d226b800f1247d79a04012874ad3%2Fbackend%3Dimagemagick%3Bversion%3D1%3Bwidth%3D1300%2Fhttp%253A%252F%252Fcdn-ak.f.st-hatena.com%252Fimages%252Ffotolife%252Fd%252Fdevpixiv%252F20140325%252F20140325121052.png)
jQuery Deferred broken – thewayofcode
Introduction to Javascript promises Callbacks: a classic approach to async Callbacks are Javascript classic approach to collaborative asynchronous programming. A callback is a function object that is passed to another function as a parameter and that later on must be invoked under some circumstances: for example when an asynchronous function successfully completes a task, it invokes the callback
Flight by Twitter
Overview Flight is a lightweight, component-based JavaScript framework that maps behavior to DOM nodes. Twitter uses it for their web applications. By way of example, we've included a simple email client demo (browse the source) built over the Flight framework. There's also a flight implementation over on the todoMVC site (source), courtesy of @mkuklis Flight uses jQuery and requires a module load
AirbnbがFlight.jsで検索ページをリニューアル - ワザノバ | wazanova
http://nerds.airbnb.com/redesigning-search/ 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約3時間前 Airbnbがエンジニアリングブログで、Mustache + Flight.jsを使って検索ページをリニューアルしたことを紹介しています。 Flight.jsは、 コンポーネントベースのJavaScriptフレームワーク 各DOM elementはコンポーネントにバインド or アサイン コンポーネント & DOMの依存関係をほぼ排除 イベントドリブン 再利用性が高い というのが特徴ですが、Airbnbの検索ページはかなり複雑でインタラクションがヘビー & コードがスパゲッティになりつつあった状況で、Flight.jsがうまくフィットするという判断がされたようです。
design
skip over comments if tok is / if tok-1 is () if tok-2 in "if" "while" "for" "with" tok is start of regex literal else tok is divide else if tok-1 is {} if isBlock(tok-1) // named or anonymous function if tok-2 is () and tok-3 is "function" or tok-4 is "function" if function expression // how to determine is described below tok is divide else tok is start of regex literal else tok is start of rege
プラグインなしでブラウザ上でUnityで開発したゲームが動作可能に
WebGLやasm.jsの技術を駆使し、専用プラグインなしでもブラウザ上でUnityで開発したゲームを動かすことが可能になると、MozillaとUnityが発表しました。 Mozilla and Unity Bring Unity Game Engine to WebGL | The Mozilla Blog https://blog.mozilla.org/blog/2014/03/18/mozilla-and-unity-deliver-award-winning-game-engine-to-the-web/ UnityはWindows・Mac OS X・ウェブブラウザ・Flash プレイヤー・iPhone・iPad・Android・Wii・Wii U・PS3・Xbox 360など幅広いプラットフォームのゲーム開発に対応したツールで、2005年にOS Xに対応したゲーム開発ツールとし
JavaScript でペンと筆圧を扱う : document
4月11 JavaScript でペンと筆圧を扱う はじめに JavaScript でアプリケーションを作っていると、筆圧を取得したくなることがよくあると思います。 ここでは JavaScript でタッチやペンによる筆圧の取得の仕方について簡単にまとめます。 Wacom ペンタブレットによる筆圧の取得 Wacom のペンタブレットではブラウザにプラグインをインストールすることにより筆圧の取得が可能になります。 最近はタブレットの最新版ドライバをインストールすると一緒にプラグインもインストールされるようです。 タブレットプラグインのバージョンによる API 変更 Wacom のタブレットプラグインでは元々ペンを扱う単体のものでしたが、バージョン 2 からはタッチと統合されたため API が変更されました。 基本的には統合であるため、プラグインのオブジェクトに .penAPI を付けるか付け
Sendagaya.js（仮）アウトラインメモ
Sendagaya.js（仮） に参加してきたのでメモ Sendagaya.js（仮） – Togetterまとめ 超大量絵馬とはなんだったのか – @geta6 超大量絵馬とはなんだったのか – Glide glide 超大量絵馬企画の経緯 http://10000000.pixiv.net/ の企画。 リアルタイムでお絵かきしたい要件 node.js x socket.io express backbone.marionette almond – require.js coffeescriptで書いた 1278コミット 構成 ストロークをサーバに送る Redis -> node-canvas -> 画像化 他の閲覧者に画像として表示 設計-ビューアー ビューアーは1枚のcanvas 位置に合わせて表示するものを取得してCanvasに描画しなおす url.createObject で b
googkit を使ったカンタン Closure Library 開発のすすめ - 若くない何かの悩み
この記事では、JavaScript - Client Side - Advent Calendar 2013の23日目の記事です。 さて、googkit を使ってカンタンに Closure Library での開発をはじめる方法を紹介します。 googkit は Closure Library を使った開発を手助けするツールです。私が前に開発した Webアプリケーション「piine! 」も Closure Library + googkit を使っています。 では、本題の googkit の説明に移る前に Closure Library の説明から始めましょう。 すばらしき Closure Library そもそも Closure Library ってばすごいライブラリなんですよ！！（白目 安心の Google 製 パリッとキマったクラス指向 var Child = function()
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
LTおじさんの歴史『人はなぜLTをするのか』 #jsオジサン
JavaScript engine benchmarks: Nashorn vs V8 vs Spidermonkey
JavaScript Libraries Playground