JavaScript初心者を一気に上級者へ導く海外の無料動画ベスト6を一挙公開！ - paiza times
どうも、まさとらん（@0310lan）です。 みなさんは、「JavaScript」をどのような方法で学習されているでしょうか？ お手軽な方法としては…、 ・書籍やブログ記事を読む ・勉強会・セミナーへ参加する ・友人や先輩に直接聞く ・学習向けのWebサービスを利用する ・etc... などが一般的でしょうか。 今回は、上記のリストに加えて、もう１つ有効な方法である「海外の無料動画」についてご紹介しようと思います！ 「どうせ、英語だから…」と、つい敬遠しがちですが、海外ユーザーが作るプログラミング学習動画は、国内に比べて圧倒的に「質」が高いのが特徴です。 なかでも、特に解説が丁寧で理解しやすい動画だけを厳選しましたので、ぜひチェックしてみてください！ ■「JavaScript」の基本を徹底的に学ぶ！ まずは、JavaScriptを「どのように書いたら良いのか？」を丁寧に教えてくれる動画のご
オレ流AngularJSを使った設計ポリシー
Chrome MySQL Adminでは、 AngularJSを使って実装を行っています。Chrome appsでは、 何らかのMVC Frameworkの利用が勧められています。 AngularJSは、Controller、Directive、Template、Serviceなど、いくつかの部品群を組み合わせてアプリケーションを構成することになります。その機能の豊富さ故に、実はちゃんとしたポリシーを決めておかないと、いかようにでも作れてしまうために、かえって複雑さが増してしまうという危険性も出てきます。もちろんアプリケーションの作り始めは試行錯誤の連続なのですが、徐々に自分なりのポリシーみたいなものが確立されてくるはずです。 本エントリでは、Chrome MySQL Adminでの設計/実装ポリシーを簡単に紹介してみたいと思います。ちなみに、全てのソースコードは、以下にあります。 htt
Angular, Ember, Backbone：どのJavaScriptフレームワークを選ぶべきか？ | ReadWrite Japan
Angular, Ember, Backbone：どのJavaScriptフレームワークを選ぶべきか？ JavaScriptフレームワークの選択は、開発者の好みよりもプロジェクトとの相性が大切だ。 JavaScriptベースのアプリケーションやウェブサイトのアイデアを思いついたとして、次にしなければならないのが正しいオープンソース・フレームワークを選ぶことだ。 この記事を読んでいるということは、あなたはまだ初心者や見習いの開発者かもしれない。あるいは自分のアイデアの開発を外部に委託しようと考えているのかもしれない。Angular、Ember、Backboneの名前ぐらいは聞いたことがあるかもしれないが、それらがどういったもので、なぜそれらがウェブ開発の助けになるかについてまでは知らないかもしれない。 開発者はJavaScriptを様々なウェブ・アプリケーションに使用している。それはJa
JavaScript Garden
JavaScript Garden はJavaScriptというプログラム言語の一番奇妙な部分についてのドキュメント集です。 このドキュメントはJavaScriptという言語に慣れていないプログラマーがこの言語について深く知ろうとする際に遭遇する、良くある間違い・小さなバグ・パフォーマンスの問題・悪い習慣などを避ける為のアドバイスを与えます。 JavaScript GardenはJavaScriptを教える事を目的にしていません。このガイドの項目を理解する為には、この言語に対する前提知識がある事を推奨します。この言語の基礎部分についてはMozilla Developer Networkのガイド がオススメです。 著者 このガイドは愛すべきStack Overflowの2人のユーザーIvo Wetzel (執筆)とZhang Yi Jiang (デザイン)によって作られました。 貢献者 貢献
最強オブジェクト指向言語 JavaScript 再入門！
この資料では、JavaScript でオブジェクト指向プログラミングを行う際に備えておくことが望ましい、基礎知識や概念について解説します。 【対象者】 ・JavaScript でアプリケーションを構築できる方 ・JavaScript におけるオブジェクト指向プログラミングの 実現手法や原理への理解を深めたい方 ・Java 的なクラスベースの言語との違いに違和感や混乱を 感じてらっしゃる方
Ember.js - Webアプリケーションを正しく行う
この記事では、これら2つの質問に答えていきます。やらなきゃいけないことはたくさんあります。早速、はじめましょう。なお、これから構築するアプリケーションのソースコードは、 GitHub に置いてあります。 何を作るか？ シンプルなフォトアルバムアプリを構築していきましょう。ページの下部には、写真のサムネールを横に並べます。ユーザが写真を選択するとURLが更新され、選択された写真がサムネールの並びの上に表示されます。 シンプルなスライドショー機能も用意しましょう。4秒毎に次の写真に切り替えます。 最終的なアプリケーションは図1のようになります。 （クリックすると拡大） GitHubに最終的なソースコードが置いてあります。アプリケーション本体はそのsiteディレクトリにあります。アプリケーションを開始する方法にはいろいろありますが、シンプルなのは以下のやり方です。 図1 – 最終的なアプリケーシ
いままでいくらAmazonで買い物したか合計するブックマークレット書いた - モロ屋
2015/03/02: 現在動作しなくなっているようなので、こちら等を参照してください。 Amazonで使ってきた金額合計してみろ おにゃんこ速報 5：以下、名無しにかわりましてVIPがお送りします：2012/06/16(土) 13:28:46.48 ID:8IYD9aJN0 どうやって合計するの 6：以下、名無しにかわりましてVIPがお送りします：2012/06/16(土) 13:29:58.55 ID:5x4DpozW0 >>5 ちまちま足す というわけで 自分もどれくらいAmazonで使ってるか知りたかったので、集計するコード書きました。 まずこのページに行ってから、 https://www.amazon.co.jp/gp/css/order-history/ 下をコピペしてアドレスバーに貼り付け。 javascript:(function(){var d=document;var
Rails3.1でAjaxを使う - ひげろぐ
よく理解できていなかったのでチュートリアル的に整理した。 まずはチュートリアル用のアプリを新規作成して、コントローラーを一つ作る。 rails new ajax_tutorial cd ajax_tutorial rails g controller sandbox index update_time Ajaxなフォームやリンクを作成する form_forやlink_toといったヘルパーのオプションに:remote => trueを加えるとボタンを押した時やリンクをクリックした時のリクエストが非同期リクエストになる。 app/views/sandbox/index.html.erb <h1>Sandbox#index</h1> <%= link_to('update time', {:action => 'update_time'}, :id => 'update-time-link',
JavaScriptのプログラミングスタイルはどうあるべきか？ 重鎮Douglas Crockford氏が脳の働きとの関係を語る（前編）。QCon Tokyo 2013
JavaScriptのプログラミングスタイルはどうあるべきか？ 重鎮Douglas Crockford氏が脳の働きとの関係を語る（前編）。QCon Tokyo 2013 4月23日に都内で開催されたエンジニア向けのイベント「QCon Tokyo 2013」。基調講演に登壇したのは、JavaScriptの重鎮であるDouglas Crockford氏。「プログラミング・スタイルと私たちの脳」という大胆なタイトルで、JavaScriptプログラミングにおいてバグをどう減らしていくのかについて解説しています。 基調講演の内容をダイジェストで紹介しましょう。 プログラミング・スタイルと私たちの脳 PayPalのDouglas Crockford氏。 プログラミングスタイルはプログラムの一部ですが、コンパイラからは無視されます。だからある人はプログラミングスタイルが重要ではないと考えていますが、しか
URI.js - URLs in Javascript
URI.js is a javascript library for working with URLs. It offers a "jQuery-style" API (Fluent Interface, Method Chaining) to read and write all regular components and a number of convenience methods like .directory() and .authority(). URI.js offers simple, yet powerful ways of working with query string, has a number of URI-normalization functions and converts relative/absolute paths. While URI.js p
javascript: escape(), encodeURI(), encodeURIComponent() 比較 (groundwalker.com)
« DoBeDo 2.5 | メイン | javascript で Query String » javascript: escape(), encodeURI(), encodeURIComponent() 比較 javascript の escape(), encodeURI(), encodeURIComponent() 関数群について、どの文字がエンコードされてどの文字がエンコードされないのか分かりにくいのでまとめておく。 まずは、対象範囲 %20（半角スペース）〜%7E（チルダ~） 元データ !"#$%&'()*+,-./ 0123456789 :;<=>?@ ABCDEFGHIJKLMNOPQRSTUVWXYZ [\]^_` abcdefghijklmnopqrstuvwxyz {|}~ escape() %20%21%22%23%24%25%26%27%28%29*+%2C-
htmlエスケープについて - mtoyoshi開発メモ
こういうhtmlがあった時に、 <input type="text" name="txt" id="txt"> <span id="spn"></span> txtの内容をspnに移動するには、 document.getElementById('spn').innerHTML = document.getElementById('txt').value; とすればいける。 ただし、上記では不十分。innerHTMLに代入する場合はhtmlEscape処理が必要となる。というわけでこんな感じ。 document.getElementById('spn').innerHTML = htmlEscape(document.getElementById('txt').value); htmlEscape関数は前のエントリで作ったこれが使えそう。 var htmlEscape = (function
[JavaScript] HTML エスケープするコードを書いてみました (実用性なし) : のびーの食っちゃね〜だらだらな日々。食っちゃ寝生活してても意外と平気だったりする。
March 29, 201223:59 [JavaScript] HTML エスケープするコードを書いてみました (実用性なし) カテゴリTemporary Comment(0) HTML をエスケープする JavaScript を書いてみました。 まあ普通はテンプレートエンジンを使うでしょうから、わざわざ自分で書く必要などないのでしょうけど (でも、なぜか自分で書かなければならないこともあったりするのだけど) というわけで書いてみました。 ここでは エスケープする文字は &, <, >, ", ' の5つとしています。 var escapeHTML = (function () { var entity = { '&': '&', '<': '<', '>': '>', '"': '"', '\'': ''' }; return function (
![[JavaScript] HTML エスケープするコードを書いてみました (実用性なし) : のびーの食っちゃね〜だらだらな日々。食っちゃ寝生活してても意外と平気だったりする。](https://cdn-ak-scissors.b.st-hatena.com/image/square/da78a05937633f7a2b4b2219826151c370cd607b/height=288;version=1;width=512/https%3A%2F%2Fparts.blog.livedoor.jp%2Fimg%2Fusr%2Fcmn%2Fogp_image%2Flivedoor.png)
addEventListenerで渡した無名関数の中でremoveEventListenerする - 今日覚えたこと
最近は、onload属性やonclick属性に無名関数を渡すやり方ではなく、なるべくaddEventListenerを使うようにしている。 <script type="text/javascript"> window.addEventListener('load', function(){ document.getElementById('button1').addEventListener('click', function(){ alert('hello, world!'); }, false); }, false); </script> <button type="button" id="button1">hello</button> こんな感じ。 そして、一度セットした関数を削除したいことがある。addEventListenerでセットした関数を削除するには、removeEvent
removeEventListenerの使い方間違えてた - 三等兵
add時と引数違うとだめなのか。 うわーremoveしたことなかったから知らなかった。removeせずに関数内で判定させてイベントおこさないようにしてた。イベント放置プレーバレバレ。 function a(){ console.log('バカですよ'); } document.documentElement.addEventListener('mouseover', a, false); document.documentElement.removeEventListener('click', a, false); document.documentElementをクリックしたらイベント無くなるのかなーとかaddと同じ要領で使った。これじゃ削除されない。document.documentElementをクリックすることで、mouseoverのイベントを削除するのだったら、 function
知ってて当然？初級者のためのJavaScriptで使う即時関数(function(){...})()の全て
(function(){...})()は、 (function($){ $.hoge = function() { }; })(jQuery) みたいに使われていたりするコード。GreasemonkeyとかjQueryのプラグインとか、あれこれ見かけることがあると思います。 この話題はいくつかWebでも取り上げられていますが何がどうなってんのかちょっと難しいですね。しかし、誰でも理解できるレベルではあります。というのも、こういう種の難しさは体系的な知識が備わっているか否かということなのです。 でも、この知識を体系化する作業って結構しんどくて、難しくて、まーハゲるほど悩むこともあるかもしれない。それはきっと、とても毛根に悪いかもしれない。スカルプDも真っ青の状況になるかもしれない。それは、悲しいことなのだと思う・・・っ！ 毛根にはこれからもがんばってほしい！いつだって頭を温かいまなざしで見守
FireFox3でappendChildを使ってscriptタグを追加すると、スクリプトが実行される。 - うなの日記
昨日のサンプルコードを書くときに気になってちょっと試していたのだけど、innerHTMLでscriptタグを挿入しても実行されないみたいだなー。(FireFox3とIE7では)。あれ、じゃYUIのGetUtilityはどうやってるんだろう、と思っていろいろ試してみるとappendChild()を使ってhead要素に追加するとスクリプトが実行されるようだ(FireFox3、IE7とも)。さらに、FireFox3ではhead要素以外の適当なdivにappendChild()してもスクリプトが実行される。 操作 IE7 FireFox3 innerHTMLでscriptタグを挿入 実行されない 実行されない innerHTMLでsrc属性を持つscriptタグを挿入 実行されない 実行されない appendChildでscriptタグをheadに挿入 実行される 実行される appendChil
element.appendChild - 指定要素へ子要素追加 - JavaScriptリファレンス
「指定要素へ子要素追加」サンプルコード <html> <head> <title>element.appendChild - 指定要素へ子要素追加</title> </head> <body> <!--指定要素へ子要素追加のサンプル--> <script type="text/javascript"> function addElement() { var element = document.createElement('div'); element.id = "id"; element.innerHTML = "hogehoge"; element.style.backgroundColor = 'red'; var objBody = document.getElementsByTagName("body").item(0); objBody.appendChild(element)
『[jQuery] 外部JavaScriptファイル読込みに関する考察』
前回の「GO2WEB20のTwitterバッチをAmebloにつけてみた。と、IE対策方法 」に端を発してjQueryを使って外部のJavaScriptのソースを読み込む際の様々なやり方の検証をしてみる。 jQueryのappend()を使ってタグを追加できますのでこれでscriptタグを追加してみます。 <script> $(document).ready(function(){ var script_tag = document.createElement("script"); script_tag.type = "text/javascript"; script_tag.src = "hoge.js"; script_tag.charset = "utf-8"; $("body").append(script_tag); }) </script> function foo() { a
![『[jQuery] 外部JavaScriptファイル読込みに関する考察』](https://cdn-ak-scissors.b.st-hatena.com/image/square/fa24a3b30d8fa23a05574c6d7eda22c94d409206/height=288;version=1;width=512/https%3A%2F%2Fstat.ameba.jp%2Fuser_images%2F20100402%2F00%2Fitboy%2F60%2F00%2Fj%2Fo0687039310477745699.jpg)
JavaScript入門講座
今日の内容 JavaScriptを勉強し始めくらいの人を対象にしたJavaScript入門講座的なもの 文法とかは調べればわかるのでふれません 一人で勉強してもわからなそうな概念などを重点的に説明します ライブコーディングするのでJavaScriptってこんな感じて作るんだなーというのがわかってもらえればと アジェンダ JavaScriptを勉強する前に JavaScriptの基礎知識 ライブコーディング part1 jQueryの基礎知識 ライブコーディング part2
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
