フロントエンドのパラダイムを参考にバックエンド開発を再考する / TypeScript による GraphQL バックエンド開発
JavaScriptフロントエンド開発の昨今
フロントエンドのパラダイムを参考にバックエンド開発を再考する / TypeScript による GraphQL バックエンド開発
[JS]最近のウェブサイトで見かける面白い仕掛けを実装するスクリプトのまとめ
fullPage.js ポートフォリオや企業のプロモーションでもよく見かける1ページで構成されたサイトで、フルスクリーンの垂直スクロール、そして水平のスライドにも対応したウェブサイトを作るためのスクリプト。 こういう作りは特にタブレットで操作がしやすいですね。 FancyScroll.js スマフォやタブレットのようにページの終わりまでスクロールした際にバウンドするのをはじめ、ちょっと面白いさまざまなエフェクトをスクロールに与えるスクリプト。
wgld.org | WebGL |
WebGL contents WebGL に関するコンテンツの一覧です。 初心者や WebGL の入門者の方は、最初から読み進めていただけると理解が深まると思います。 また、当サイトでは実際に動作する WebGL のサンプルや、WebGL のデモを多数用意していますが、それらには当サイトオリジナルの行列・クォータニオンなどを扱うライブラリ、minMatrix.js などが使われています。ライブラリの詳しい実装については library のページをご覧ください。 WebGL 2.0 については別のコンテンツとして分けて掲載していますので、 WebGL2 のほうを参照してください。 ブラウザの準備 WebGL を始める前に canvas を知る 3D 描画の基礎知識 レンダリングのための下準備 行列(マトリックス)の基礎知識 頂点とポリゴン コンテキストの初期化 シェーダの記述と基礎 頂点バッ
Ember.js - A framework for ambitious web developers
A framework for ambitious web developers. Ember.js is a productive, battle-tested JavaScript framework for building modern web applications. It includes everything you need to build rich UIs that work on any device. Build with the teams that never stop shipping. Some of the best development teams in the world have been iterating on their products for years with Ember. With scalable UI architecture
コールバック……駆逐してやる…この世から…一匹…残らず!! - Qiita
このテキストは JavaScript のコールバック地獄に疲れたひとのためのコールバック駆逐術指南書です。対象読者は JavaScript道初段くらいの人です。このテキストを読むと、以下のそれぞれの手段における非同期処理制御の仕組み、利点および欠点がわかるようになるかもしれません。 コールバック地獄 jQuery.Deferred async.js Concurrent.Thread generators co fibers Web Workers (※なぜか『進撃の巨人』の一部ネタバレが含まれるので注意してください) それは『何故人はコールバックするのか』という話でしょうか？ 非同期処理って面倒ですよね。JavaScriptではいわゆる コールバック地獄 というやつにしばしば陥りがちです。たとえば、Ajax でふたつのファイル hoge.txt と piyo.txt を持ってきて、それら
JavaScriptでアニメーションを書く初歩の初歩
JavaScriptを使ってアニメーションを書くときに有用なテクニックの、基本中の基本をご紹介します。おそらく、このブログを見ている人のほとんどにとっては釈迦に説法だと思います。今回、requestAnimationFrameの話すらしません。その点、ご留意ください。 まず、JavaScriptでアニメーションをする場合に気をつけないといけないのが、一度JavaScriptの実行（Context）を抜けないとブラウザに描画が反映されないということです。簡単に言うと、 <html><head><title>bad sample</title><script> onload = function() { var e = document.getElementById("e"); for(var i = 0; i <= 100; i += 5) { e.style.left = e.style.
Masonry
What is Masonry? Masonry is a JavaScript grid layout library. It works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet. Install Download CDN Package managers Getting started HTML CSS Initialize with jQuery Initialize with Vanilla JavaScript Initialize in HTML Next MIT Lice
試行錯誤の末にたどり着いた Backbone.Router の使い方 - present
だいぶ前に書いた Backbone.js の入門記事で Backbone.Router を使ったサンプルを紹介した。 作って覚える Backbone.js (2) Router 編 - present Router が表示する View を切り替える良い方法が思いつかなかったので、サンプルではメイン View をグローバル変数に格納して Router から触れるようにし、無理やり切り替えていた。今見ても、全然スマートな方法じゃないね。 あれから試行錯誤しながら、何個か Backbone.js を使ってアプリを作成してみて、ようやく自分の中で Backbone.Router の使い方が固まった。以前書いたサンプルを修正したのがこちら。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>Backbone
Backbone.js -JavaScriptのMVCフレームワーク- | DevelopersIO
Backbone.jsとは？ Backbone.jsは、JavaScriptによる大規模なアプリケーション開発を行う際に力を発揮するMVCフレームワークです。データバインディングとカスタムイベントを備えたModel、配列情報を表すCollection、イベントをハンドリングするView、サーバーサイドのアプリケーションと連携するためのRESTful JSONなどをフレームワークとして備えています。 大規模な業務アプリケーションのユーザーインタフェースをJavaScriptでゴリゴリと作ろうとした場合、100%に近い確率で失敗するかと思います。これは、Flexのようなビルド時のコンパイラエラーを検出できないこと、存在するフレームワークがインタラクションやビジュアルに特化していること、ブラウザーやOSの組合せでAPIレベルの仕様が異なる事、同じブラウザーでもバージョンの違いにより挙動が異なる事
JavaScript : Backbone.js #5 - Modelのサーバ連携 : typeOf 'aki_mana'
Mackbone.Modelの派生クラスは、デフォルトでAjaxによるサーバとの連携ができる。 前のエントリでも書いたのだけど、fetch(), save(), destory() の3つのメソッドを使う。 この３つのメソッドから、Backbone.sync()が呼ばれ、$.ajax()用にオプション処理するが、この中ではサーバー側アプリケーションの要件に応じて、Backbone.emulateHTTP、Backbone.emulateJSON というフラグを活用し、古い実装でのアプリケーションにも対応しやすくする様子。 Modelに実装される、サーバー連携用メソッドは３つ。 model.fetch() サーバーから読む。model.save() サーバーに書き込む。model.destroy() サーバーから削除する。 この３つは、Modelの派生クラスにsync() を実装した場合はそ
Re: RequireJSを使うのを止めた理由 - teppeis blog
RequireJSを使うのを止めた理由 | それなりブログ を読んで、ほぼ同意だったのですが、意識が高まったのでいくつかコメントを。 嫌だったところ 基本的に、1枚のJSファイルが1モジュール、ファイル名がコードに影響する。 それができるのが良いところだと思ってました。 それもあって、結合・圧縮は r.js という専用のツールが必要になる。Grunt の concat とか uglify とか使えない。 リリース版ではビルドがほぼ必須というのがRequireJSの欠点ですね。 ただGruntについては、grunt-contrib-requirejsを使えばデフォルトでuglifyされますし、concatなど他のGruntタスクと組み合わせることも可能です。 AMD の仕様では、「JSファイルのリストを順番通りに読み込み/実行する」ということができない。実際何が困ったかというと、分割した m
最近の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
PhantomJS - Scriptable Headless Browser
Important: PhantomJS development is suspended until further notice (more details). PhantomJS is a headless web browser scriptable with JavaScript. It runs on Windows, macOS, Linux, and FreeBSD. Using QtWebKit as the back-end, it offers fast and native support for various web standards: DOM handling, CSS selector, JSON, Canvas, and SVG. The following simple script for PhantomJS loads Google homepag
cocos2d-html5エンジンが凄い件 - tsuge development page
cocos2dっていうiPhoneでは有名なゲームエンジンがあるんだけど、それのHTML5版でcocos2d-html5ってのがある。 http://www.cocos2d-x.org/projects/cocos2d-x/wiki/Cocos2d-html5 これ、ちょっとまともに調べてみたけどかなり凄い。 凄いんだけどいまいちZyngaの日本での頑張りが足らないのか記事が少ないので、ちょっと紹介する。 ダウンロードとか とりあえず自分で触ってみるわって人は、上のリンクからCocos2d-html5-v何がしの最新版リンクをクリックしてダウンロードすればいい。 この記事時点ではCocos2d-html5-v2.1.4が最新。 サンプルゲームはpixi.js辺りに比べるといまいちだけど、個別の機能を確認するのはcocos2d-html5のテストプログラムが使える。 http://www.c
コーダーさんの為のGrunt入門（前編）〜導入編 - Mach3.laBlog
この記事は賞味期限切れです。（更新から1年が経過しています） 以前はmakeを使って納品用のデータをビルドしていたりしたのですが、 去年くらいから代替にGruntを使ってみています。 この度0.3.xから0.4系に切り替えたので、覚書も兼ねてGruntの導入・使い方を記しておきます。 Gruntってなに Gruntを導入する 使ってみよう どんなタスクがあるの？ その他Gruntの魅力 まとめ Grunt ってなに GRUNT: The JavaScript Task Runner Gruntはnode.jsベースで作られたタスクベースのコマンドラインビルドツールです。 ビルドツールってなに ビルドは、ソースファイル群を元にして、実行出来る成果物を生成するプロセスの事を指します。 cf) ビルド (ソフトウェア) – Wikipedia 鍋に鶏と野菜とコンソメを入れて煮込んだらポトフが出来
gruntで簡単JSビルド - rh7's blog
gruntってのは、JS/CSSをまとめたり、JS lint, Qunit, minifyできたりってのができるビルドツールです。 また、minifyなどの組み込みタスクの他に、RakeやAntと同じようにカスタムタスクを記述して実行することも可能です。 さらに、watchというので、対象のファイルを監視して、それをトリガーとしてタスクを実行することも可能です。(inofityみたいなやつ) 他の類似ツールと比べて、簡単に使えたのでメモとして残しときます。 環境 OS: MacOSX 10.7 実行環境: Node.js(Homebrew) パッケージ管理: npm 手順 node環境のインストール 面倒なので(ry この辺みてインストールしてください。 naveを使ったnode.jsインストールと、最近のnpmの使い方 - ラシウラ Nodeとnpmのインストール - 自分の感受性くらい
UIZE JavaScript Framework | AJAX, RIA, widgets, JSON, OOP, Class Inheritance, XMLHttpRequest, DOM manipulation, and all that stuff
EVER:CLOCK is a fun, themeable, online digital clock that can be loaded straight into your modern Web browser. Several different clock types are available, and there are thousands upon thousands of interesting clock themes to choose from. Each clock type offers its own unique qualities and theming options. The EVER:CLOCK Web app and its supporting Web site is built entirely using the UIZE JavaScri
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Site Under Maintenance
JSX の使い方 自分メモ - latest log
Ajax を使った手書き文字認識