ここ数年、Javascript界隈でフレームワーク戦争が勃発してきました。クライアント開発の規模も年々大きくなり、jQueryだけでは複雑な画面遷移などを管理しきれなくなってきたのが原因だと思います。 私も昨年までAngularとbackboneを試しましたが、サーバサイドをMVCにしているのに、クライアントでもMVCを作るMVCの2階建ては、やり過ぎなのではないかと思っていました。フレームワークそのもの覚えるまでにも一苦労というのも面倒に感じました。 2014年、海外でブームに火が付いたReact.js そんな中、2014年の後半からFacebook発のReact.jsの採用事例が聞こえてくるようになりました。AirBnBや米Yahoo! Mailなど大手がReact.jsを積極的に採用し出したので気になり、年末年始を使って色々調べてみることにしました。 Rails以来の衝撃 色々試して
Tim Bray(GoogleのAndroid応援団長)が「#!」の入ったajax用URLを使用を批判している。 http://www.tbray.org/ongoing/When/201x/2011/02/09/Hash-Blecch new: さらならる「#!」URL批判 例にtwitterのtwitter.com/#!/timbrayを挙げている。 #!の働き サーバ側は#!の前までしか見えない。上の例だとサーバはtwitter.com/のリクエストを受ける #!以降はブラウザの中のジャバスクリプトが解釈する 何故#!を使うのか ajaxのアプリは古いブラウザでは基本的にURLを変更することができない… ただし#(フラグメント)以降はブラウザ内のJavaScriptからでも変更可能 なので、ajaxアプリケーションが自分の状態をURLバーに表示するために使われるようになった。 つまり
Java/.NET Performance Monitoring, Analysis, Diagnostics & Profiling - Application Performance Management 無償のWebページパフォーマンス分析ツールであるdynaTrace Ajax Editionが、限られたユーザに対してだがFirefox対応β版の提供が開始されたと発表された。フィードバックを得たあとでFirefox対応β版を一般にも公開すると説明がある。 dynaTrace Ajax EditionはIE6、IE7、IE8に対応したWebページのパフォーマンス分析ツール。IEのブラウザヘルパーオブジェクトとして動作する。IE6からIE8まではこの手のパフォーマンス分析ツールが手薄であったためdynaTrace Ajax Editionは多くのWebデベロッパにとって有益なツールとな
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ jQueryでQueryStringをパースして配列で受け取れる便利関数が紹介 されていたのでメモ GETで値を渡したときにjavascriptで処理させたいときに 使えますね Get URL parameters & values with jQuery http://www.example.com/?me=myValue&name2=SomeOtherValue の?以降のパラメーターを配列で取得できます。 function getUrlVars() { var vars = [], hash; var hashes = window.locati
こんにちは。ブログビジネス部 石野です。 livedoor Blogやクリップ、Readerの担当ディレクターです。 今日は「CocProxy」というツールをご紹介します。 同僚のプログラマーに教わったのですが、便利です。 コーディングにも携わるディレクターにはぜひ知っておいてほしいツールです。 CocProxyとは ブラウザからのリクエスト先をローカルファイルに置き換えてくれるプロキシです。 （一見取っつきにくそうですが） デバッグ時にその環境を用意をするまでの手間をなくしてくれる、時間短縮してくれるツールです。 メリット Ajaxを使っているなど、デバッグ環境を用意するのが大変な場合もプロキシの切り替え1つで済みます。 また、確認するために編集したファイルをサーバへアップロードして…といった手順をスルーできます。 amachangさんのこの記事を見て「名前は知っていたけど」という方も、
GT Nitro: Car Game Drag Raceは、典型的なカーゲームではありません。これはスピード、パワー、スキル全開のカーレースゲームです。ブレーキは忘れて、これはドラッグレース、ベイビー！古典的なクラシックから未来的なビーストまで、最もクールで速い車とカーレースできます。スティックシフトをマスターし、ニトロを賢く使って競争を打ち破る必要があります。このカーレースゲームはそのリアルな物理学と素晴らしいグラフィックスであなたの心を爆発させます。これまでプレイしたことのないようなものです。 GT Nitroは、リフレックスとタイミングを試すカーレースゲームです。正しい瞬間にギアをシフトし、ガスを思い切り踏む必要があります。また、大物たちと競いつつ、車のチューニングとアップグレードも行わなければなりません。世界中で最高のドライバーと車とカーレースに挑むことになり、ドラッグレースの王冠
いまやWeb制作に欠かせなくなったJavaScript。でも、「JavaScriptはほとんど“アリモノ”で済ませている」という方も多いのでは？ そこで、WebデザイナーやマークアップエンジニアなどのWeb制作者の方向けに、いま一番人気のJavaScriptライブラリー「jQuery」の基本を学べる特別レッスンをお届けします。題して、「40分で覚えるjQuery」。要点だけにぎゅっと絞って解説しますので、手を動かしながら今すぐjQueryを始めましょう。 【0分目：導入編】 jQueryのダウンロードと利用方法 jQueryのライブラリー本体（JavaScriptファイル）は公式サイトからダウンロードし、head要素などにscript要素を書いて読み込みます。
Web APIとJSON Web上ではネットショッピング、ブログ、SNSなどさまざまなサービスが提供されています。これらのサービスの中にはWebブラウザから利用するだけでなく、サービスの機能の一部をプログラムから利用可能なAPI（Web API）として提供しているものもあります。Web開発者はWeb APIを利用したアプリケーションを開発したり、既存のWebサイトにWeb APIを利用した機能を追加することなどが可能です。 なお、Web APIを使用し、複数のサービスの機能を組み合わせたり、独自の機能を追加したサービスを構築することをマッシュアップと呼びます。 これらのWeb APIの多くはXMLで情報を返すものが多いのですが、中にはJSONで情報を返却するWeb APIも存在します。そこで、今回はJSONを使用するWeb APIの利用方法を紹介します。 Ajaxのクロスドメイン制約 しか
JSONを使ったAjaxアプリケーション 前回はJSONの概要と記法、そしてJavaScriptでの利用方法について説明しました。連載2回目となる今回はAjaxアプリケーションでのJSONの利用方法を、サンプルを作成しながら紹介していきます。 なお、本記事のサンプルを実行するにはApacheなどのWebサーバが必要になります。また、本記事の後半ではPHPを用いた動的なJSONの生成方法にも触れますので、Apache上でPHPが利用できる環境を用意してください。環境の構築方法については割愛します。 prototype.jsについて prototype.js（http://www.prototypejs.org/）はさまざまなJavaScriptライブラリの中でも最も初期に登場したもので、多くのAjaxアプリケーションで利用されています。 DOMの操作などAjax以外にも便利な機能を備えていま
JSONとは何か? JSONとはJavaScript Object Notationの略で、XMLなどと同様のテキストベースのデータフォーマットです。 その名前の由来の通りJSONはJavaScriptのオブジェクト表記構文のサブセットとなっており、XMLと比べると簡潔に構造化されたデータを記述することができるため、記述が容易で人間が理解しやすいデータフォーマットと言えます。 なお、JSONは2006年に「RFC 4627（http://www.rfc-editor.org/rfc/rfc4627.txt）」として公開されています。 例としてXMLとJSONで同じデータを記述したものをリスト1とリスト2に示します（図1）。 リスト1のXMLではすべての情報をタグで囲んだテキストノードとして記述していますが、XMLでデータを表現する場合、データの記述方法として属性とテキストノードの使い分けが
Mediabox iaian7 » code » webcode John Einselen, 27.09.08 (updated 6.12.19) This script has been replaced by mediaboxAdvanced. Please update your links! Though officially deprecated and no longer supported or actively developed, the older version of Mediabox Standard will continue to be available here for users of Mootools 1.11. Examples Mediabox will read Flickr, Google, MetaCafe, MySpace, Revve
67 20 09 2007 スクロール時に画像の読み込みを開始するAjax Lazyload jQuery, Ajax jQueryプラグインLazyloadの解説・設置方法、画像大量表示している場合サーバー負担軽減につながります。 ブラウザ画面に表示された時に読み込みを開始するので、無駄なトラフィックを防ぐ事が出来ます。 大量に画像を表示しているホームページなんかでは有効なプラグインですね。 jquery.js - ダウンロードページ かならず必要ですのでダウンロードして下さい コード <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.dimensions.min.js"></script> <script type="t
66 15 09 2007 CSSを使わずに画像を使ったSEOマークアップが簡単にできるjavascript jQuery, Ajax javascriptだけでテキストを画像に置き換えることが出来ます。コーディング作業が楽になります、 今まではテキストを画像に置き換える場合はCSSでbackgroundに画像を指定していたと思いますが、 JQueryプラグインjQirを使うと以下のコードだけでテキストを画像に置き換えることが出来ます。 コーディングしている方にはかなり良いプラグインではないでしょうか？ jquery.js - ダウンロードページかならず必要ですのでダウンロードして下さい コード <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" s
こんばんは、最近ホルモン焼きにハマっているishidaです。 WEBサイト制作時、formは必ずといってもいいぐらい存在します。 お問い合わせフォームや会員登録フォームなどがすぐに思いつきますよね。 デザインをがっつりフォーム部分で作り込んでも、CSSのみでは、 実現できなかったりすることもよくあります。 そんなクセのあるformを、よりリッチに！かつ操作性を向上！できるjQueryプラグインの数々をご紹介します。 デザイナーの方は、フォームのデザインの参考に。 コーダーの方は、ページ作成時間の短縮に手助けになればと思います。 jQuery plugin: Validation フォームの入力チェック（バリデーション）が簡単にできるプラグイン。 エラーメッセージはlocalizationディレクトリ内に18言語用意されています。 日本語用は別途作成し、使用することが可能です。 jQuery
「商業利用もOK！ Google Mapsについて知りたいこと」に続くGoogle Mapsインタビューの後編は、数多く存在するGoogle Maps関連のAPIや機能のうち、あまり知られていないものや新しいものをグーグルのソフトウェアエンジニア、淺川浩紀さんに聞いた。 Code Playgroundでオンライン編集 まずは、即効性のあるものからいこう。 Googleが持つ多くのAPIは、Webブラウザ上からJavaScriptによって呼び出せる。JavaScriptはコンパイルの手順なしに書けば実行できるので手軽である。しかし、だからAPIを試すのも簡単だとは限らない。例えば、Google Maps APIなら正しいGoogle Maps APIキーを用意したり、適切な文書にプログラムを埋め込んだりする作業を行い、それをWebブラウザで開かねばならない。
8のjQueryのすごいTIPS 原文：8 awesome JQuery tips and tricks 微妙なTIPSもあるのですが、役に立つのもあるのでご紹介。 target="_blank" のリンクの作成 XHTML 1.0 Strict ではtarget=blank属性が利用できない。そこでjQueryを利用して別ウィンドウを開く方法を紹介しよう。 $('a[@rel$='external']').click(function(){ this.target = "_blank"; }); <a href="http://www.lepinskidesign.com.br/" rel="external">lepinskidesign.com.br</a> [to-R補足] 実際に利用する際はjavascript部分を$(function(){...})などで包む必要があります。[
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く