ドットインストール代表のライフハックブログ
JavaScriptの書籍はjQueryやサンプル中心のチップス本などを含めると、多数出ており、これから勉強したい人にとってはどれから読めばいいか迷うところだと思います。 今日はここ数年で出た書籍の中で初級者から脱中級者になるまでに読みたい書籍を、この順番で読めばステップアップできるという内容で紹介したいと思います。 STEP1. 初心者へのおすすめはダントツでこれ一択。 初心者向けの内容としてはこれがダントツでおすすめです。内容が易しく丁寧な上にサポートサイトで書籍の内容を動画で説明してくれています。 Amazon.co.jp: よくわかるJavaScriptの教科書: たにぐち まこと: 本 サポートサイトはこちら STEP2. 全体を把握するには十分なボリューム。脱初級者向けにはこの2冊。 2冊とも初級者にとっては少し厳しい内容になっていますが、この2冊が理解できれば後は作りまくる
Not your computer? Use a private browsing window to sign in. Learn more about using Guest mode
[対象: 中〜上級] 僕のブログではてブ数がいちばん多いのはウェブページを高速化するTIPSを解説した記事です(まだ読んでない人はぜひ読んでください!)。 その記事では高速化全般を扱っていましたが、今日の記事ではJavaScriptに的を絞って表示速度をスピードアップできる施策を6つ紹介します。 もともとはSearch Engine PeopleブログのOptimizing JavaScript for Better Web Performanceで説明されていたものです。 記事作者のJoydeep Deb(ジョイディープ・デブ)氏に僕のブログでの転載許可をもらえました (Thanks, Joydeep!)。 逐一の翻訳ではなく、書かれている内容をもとに僕の言葉で解説していきます。 1. HTTPリクエスト削減のためにJavaScriptファイルを1つに統合する ウェブページの表示を高速化
JavaScriptテストの基礎知識と使えるフレームワーク6選:フレームワークで実践! JavaScriptテスト入門(1)(1/3 ページ) しっかりとJavaScriptの“テスト”を行うために、最近のJavaScript事情やテストを取り巻く環境、今注目のテストフレームワークを6つ紹介する JavaScriptでもテストを書こう @ITの読者の方たちのほとんどは、どのような言語を主に利用しているのかなどの違いはあるにせよ、日常的にプログラムを書いている方たちが多いかと思います。 アプリケーションを作る、ライブラリを作成する、オープンソースプロジェクトに貢献するなど、皆さんがプログラムを書く場面はそれぞれいくつかあるはずです。それらプログラムを書く場面に共通して大切な習慣の1つとして、「作成するプログラムに対しては必ずテストコードを書く」ことがあるのは、誰にでも同意してもらえることでし
クライアントもサーバも! Webアプリ開発言語Dartとは 今回は、プログラミング言語「Dart」を紹介します。 Dartは2011年にグーグルが発表したプログラミング言語です。「Dart: Structured web apps」で情報が公開されています。今後のWebアプリ開発のトレンドを見極めるうえでも、1度はチェックしておきたいプログラミング言語でしょう。 DartはJavaと同じクラスベースのオブジェクト指向言語です。JavaScriptがターゲットとする分野と同じくWebアプリ開発向けのプログラミング言語です。 「構文スコープ(lexical scoping)」「クロージャ(closures)」「オプショナル静的型(optional static typing)」といったJavaにはない機能をサポートしています。Webアプリを開発しやすい言語を目指しており、クライアントサイドもサ
もともと、Appleが主にDashboardウィジェットの描画のためにWebKitに導入したCanvas API。サンプルコードと見比べながら、効率良く学習しよう Canvas APIの基礎 本連載では、Webブラウザ上で利用できるグラフィック技術を分かりやすく紹介しています。今回はHTML5のcanvas要素で使える2次元描画コンテキスト、俗にいう「Canvas API」を取り上げます。 Canvas APIは、もともとAppleが主にDashboardウィジェットの描画のためにWebKitに導入したものです。それがFirefoxやOpera、Internet Explorer(9以降)に実装され、現在はW3Cによって標準化が進められています。JavaScriptのメソッドで直接図形を描画するのが特徴で、ビットマップ画像の加工や、ゲームのようなインタラクティブ性の高いアプリケーションに向
Home - Annotator - Annotating the Web 超面白!文字を選択してその文字にコメントできるJSライブラリ。 ブログ等で記事のここにコメントしたい、といった場合に選択するとアイコンがあらわれます クリックするとコメント書き込みフォームがポップアップされます Saveボタンを押すと保存され、マウスオーバーでコメントが出るようになります コメント量の多いところはその分黄色く表示されます ストレージは自分のサーバに用意することもできますが、ホスティングを使う事もできます。 面白い上に、インタフェースが良い感じです。これを使ったサービスを作ってみるのも楽しそう。 関連エントリ スマホを判別するのに便利なJSスニペット ネットワーク図を美麗にビジュアル化できるJSライブラリ「sigma.js」 美麗なグラフをSVGで描画できるJSライブラリ「dc.js」 JavaScr
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
<<前回「CoffeeScriptって何?」へ<< CoffeScriptを3時間で理解するための10のポイントのうち、ポイント1から3までを解説します。ポイント1は「CoffeeScriptはコンパイルで即時関数に変換される」こと、ポイント2は「変数は自動的に宣言される」こと、ポイント3は「リテラルで豊かな表現を可能に」したことです。 POINT1 CoffeeScriptはコンパイルで即時関数に変換される ★「即時関数」でグローバル変数を作らない ★JavaScriptのstrictモードにも対応 CoffeeScriptで記述されたコードをコンパイルすると、JavaScriptのコードは、(function() {...}).call(this);でラップされた状態で出力されます(リスト7)*1。奇異にも見える書き方ですが、実は、JavaScriptの世界では定石とも言える書き方の一
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
グーグルが開発したJavaScript MVCフレームワーク「AngularJS」を紹介した1つ前の記事の反応が予想以上に大きく、1日たたずにブックマークが500以上もつきました。 本記事では、AngularJS以外にもすでにたくさん存在するJavaScript MVCフレームワークに関する情報をまとめて紹介したいと思います。 JavaScript MVCフレームワークの比較記事 既存のJavaScript MVCフレームワークを比較した記事が「The Top 10 Javascript MVC Frameworks Reviewed」です。Top10と書いてありますが、12種類のフレームワークの比較です。これは公開当時は10種類だったものが、その後11種類になり、今回のAngularJSの公開で12種類になったためです。 上記のような比較表を載せた上で、12種類すべての利点と欠点を説明し
グーグルは、JavaScriptでMVCアーキテクチャのアプリケーション開発をする際に便利な機能を備えたライブラリ「AngularJS 1.0」のリリースをブログで発表しました。 MVCアーキテクチャとは、ソフトウェアがデータモデル(Model)の部分とユーザーインターフェイスの部分(View)、そしてビューとモデルのあいだで制御する部分(Controller)に分離された構造のことを指します。 これらが分離されているとプログラムの見通しがよくなり変更にも対応しやすく、テストも容易になるため、何種類ものユーザーインターフェイスと複雑なロジックなどから構成される大規模なアプリケーションではMVCアーキテクチャの採用が望ましいものと考えられています。 しかしWebアプリケーションをMVCアーキテクチャで実現しようとすると、ビューの役割を果たすHTMLのコードの中に、どうしても複雑なJavaSc
※ phiary に引っ越しました. 毎日プログラミングやWebに関する情報を発信しています! RSS 登録してたまに覗いたり, tweet やハテブして拡散してもらえると幸いです. 本日公開された JSX. 早速使ってみたのでメモ程度にエントリー書きます. C#?, Java?, UnityScript? っぽい言語で, JavaScript コードに変換して実行します. これだけ聞くと CoffeeScript と同じような感じなのかな?と思われるかもしれませんが, 使った印象としては若干違いました. 今, 公式サイトの Try をひと通り目を通しているところで, まだ全然把握しきれていないので あまり詳しいことは書けませんが, 型指定とかが強制になっていて, かつ JavaScript ライクにコードが書けるので Dart に近いのかな?と思いました. 『強固なコードが書ける Jav
最近, JSX やら enchant.js やら arctic.js やらで JavaScript 界隈はすごく盛り上がっています. そんな中, 私自身も一石を投じようと本日 JavaScript ライブラリ 『tmlib.js』を公開しました!! リニューアルって言った方が良いのかな? 実際には, 2年前に作っていたライブラリ 『tmlib』 を大幅に改良したものになります. 私一人でコツコツと作っていたものなのでクォリティは低めです. 誰か協力してくれー!! コンセプトは『JavaScript をより使いやすく, より便利に, そしてより豊かに』とざっくりとした感じ. やってることは 生成時に new がいらない class 定義の仕組みを作ってみたり jQuery ライクに DOM を扱えるようにしたり ajax 機能をサポートしてみたり HTML5 Canvas をラップして使いや
gmaps.js ? the easiest way to use Google Maps ストレス無しでGoogleマップを使ったサイトが作れる「gmaps.js」 Googleマップのサイトへの実装が本当に簡単で、かつ多機能なライブラリのご紹介です 簡単なマップを出すのに必要なコードは以下。 表示させるdivと緯度経度を指定するだけです 出来ることリストは以下 マップのクリック、ドラッグ時のイベントハンドラ実装 マーカー付与 ジオロケーション・ジオコーディング マップオーバーレイ マップ上のコンテキストメニュー実装 地図上の区画指定 目的地までのルート描画 静的な画像をマップ表示 などなど超多機能。 Googleマップ使うかもしれない場合は覚えておいて損はありません 関連エントリ Googleマップ関連のjQueryプラグインとチュートリアル集 スマホやタブレットでGoogleマップ風
jQuery Mobileとは? jQuery Mobileは、jQueryをベースとした、「スマートフォン向けフレームワーク」です。 もっと簡単に言うと、「スマートフォン向けコンテンツ制作の土台を作ってくれるソフトウェア」です。 スマートフォン向けの直観的かつ使いやすい、ネイティブアプリケーションさながらのページやUI※1が、瞬時にしてできあがります。開発者はわずかなHTMLやJavascriptを書くだけです。 「UI」 ※1ユーザーインターフェースの略。jQuery MobileはわずかなHTMLの記述のみで、リストやボタン、ナビゲーションバーなどのスマホ向けUIを自動構築してくれる。 2010 年10 月にアルファ版がリリースされ、2011 年11 月ついにjQuery Mobile 1.0正式版が公開されました。現在も、jQuery の開発者であるJohn Resig 氏(@je
必要ならどうぞ。 デモ jQueryでフォームの値を取得する方法をまとめ – jsdo.it – Share JavaScript, HTML5 and CSS jQueryでフォームの値を取得する方法をまとめ – jsdo.it – share JavaScript, HTML5 and CSS 共通:要素の探し方 input要素なんかにid振っちゃうのが一番なんだけど、属性セレクターを使うと楽な場合があります。つまり[name=xxx]で検索するやり方。 <form id="my-form"> <input type="text" name="my-text" value="This is text." /> </form>
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く