プログラミング初心者のための JavaScript と Node.js の歴史、それを踏まえた勉強方法
プログラミング初心者のための JavaScript と Node.js の歴史、それを踏まえた勉強方法 2020年でJavaScript学ぶならきっとブラウザ向けJSガン無視していきなり初手node.js（ただし暫く何も足さない）がいいんじゃないかというメモ - min.t (ミント) Node.js を教えることについて、自分は賛成なんですが、その学習パスが整理されてないなと思っていたのと、学習パスがなぜ整理されていないかについて書きます。 はじめに 問題意識として、今のプログラミングスクールや独学勢が Ruby on Rails に偏っていて、 Node.js の人間としては、歯がゆく感じているんですが、実際 Node.js を教えるとしても問題も多いと認識しています。 歴史の話は、当時の実情や政治を省いて結果だけを書きます。具体的には第一次ブラウザ戦争、第二次ブラウザ戦争を言及しませ
写経でJavaScriptを習得できる？ 話題の「ぷよぷよプログラミング」に親子で挑戦してみた
写経でJavaScriptを習得できる？ 話題の「ぷよぷよプログラミング」に親子で挑戦してみた（1/4 ページ） 2020年4月から小学校でプログラミング教育が必修化された。既存の算数や理科といった科目の中で、物事を論理的に考えるプログラミングの要素を取り入れていくことになる。25年には大学入学共通テストでも、プログラミングなどを扱う「情報I」が科目として追加される予定だ。 こうした背景から、数年前から小中学生を対象としたプログラミング教材が多く登場している。その中の1つ、6月25日にセガが発表した「ぷよぷよプログラミング」（以下ぷよプロ）は、子どもから大人までなじみのある対戦アクションパズルゲーム「ぷよぷよ」を使った無料のプログラミング教材だ。コーディングで「ぷよ」を動かせるようにし、ゲームを完成に近づけていく。 必要なものは“気合い” ぷよプロはぷよぷよのソースコードをそのまま書き写す
JavaScript基本概念最速マスター - TechTalkManiacs
プログラミング言語の文法をまとめた最速基礎文法マスターが流行っていますが、それだけだと物足りないので少し視点を変えてJavaScriptという言語の基礎となっている概念について簡単にまとめてみようと思います。(基礎文法についてはこちらを参照してください) (20010/2/4 記述ミス Typoなどを修正しました) JavaScriptの基本概念 JavaScriptの基本となる概念は次の二つです。 連鎖指向 全てがオブジェクト 連鎖指向はプロトタイプチェーンやクロージャ、全てがオブジェクトであるという性質は連想配列やプリミティブ型などの性質に関わってきます。 連鎖指向 JavaScriptでは変数、オブジェクト、メソッドなどのリソースの利用において鎖のようにリソースを定義や宣言できるポイントが連なり、一番近くの宣言や定義に基づいてリソースの内容が決定される、という仕組みが採用されています
amachang - JavaScript 入門
プログラミングのこつ 無駄な名前を極力使わないこと。意味単位に名前空間を細かく階層的に分離すること。 ここで言う名前空間とは 名前空間とは、一つの名前が一意のものを表す空間。例えば、大きな目で見れば、日本語は自然言語の名前空間である。また、専門用語なども名前空間と考えることが出来る。 日本語 { コンニチワ = 挨拶 : : } 中国語 { ニーハオ = 挨拶 } 英語 { ハロー = 挨拶 } また、名前空間は重なり（優先順位）を持つ 同音異義語などの言葉は、それぞれの細かい名前空間の重なりによって一意のものに特定されると考えられる たとえば、「コイが好き」と言った場合 池に関する名前空間 { コイ = すいすいパクパク } チャライ話題に関する名前空間 { コイ = ドキドキきゅんきゅん } お茶に関する名前空間 { コイ = にがーい } 名前空間の優先順位を考えると、一意の意味を知
10 Impressive JavaScript Animation Frameworks
President of WebFX. Bill has over 25 years of experience in the Internet marketing industry specializing in SEO, UX, information architecture, marketing automation and more. William’s background in scientific computing and education from Shippensburg and MIT provided the foundation for MarketingCloudFX and other key research and development projects at WebFX. Complex and slick JavaScript-based ani
CodePress
/",">",$code); $code = preg_replace("/ CodePress - Real Time Syntax Highlighting Editor written in JavaScript .css" rel="stylesheet" id="cp-lang-style" /> //set language this.setLanguage = function() { if(arguments[0]) { language = (typeof(Content.languages[arguments[0]])!='undefined') ? arguments[0] : this.setLanguage(); cpLanguage.innerHTML = Content.languages[language].name; if(cpBody.document.
Google Chrome JavaScriptデバッガ完全マニュアル。 - IT-Walker on hatena
Google Chromeはシンプルに見えてオフラインやWebアプリショートカット作成などいろんな機能が搭載されています。 そんな中、JavaScriptデバッガがあるのも発見！ どんなもんかと思ってみてみたら、なんとコマンドラインベースのデバッガです。Firebugみたいな物を想定していたのですが、まさかgdb（GNU製C/C++デバッガ）みたいなのがブラウザに載ってるなんて・・・しかも全然情報ないし。 でも開発者にとっては、JavaScriptをランタイムでデバッグできると言うのは非常に嬉しい事ですね。そこで、Chromeデバッガの使用法についてちょっと調べてみました。 デバッガは、開発者向けメニューの中から選択する事が出来ます。立ち上げてみると、コマンドの表示結果が表示されるエリアと、コマンドを入力するテキストフィールドが並んでいるだけ、と言うシンプルなUIが表示されます。 最下部の
変数につまずくのはもうやめたい！
変数という入れ物 前回の「第1回 そろそろ本気で学びませんか？」では、JavaScriptをもう一度やり直したい方々のために、勉強の切り口を変えて、JavaScriptを使ってHTMLのコンテンツを入れ替える方法を紹介しました。 今回の最終目標は、formのデータを読み込んでBMI計算プログラム（BMIとは、Body Mass Indexの略で、肥満度の指数としてよく使われます）を作っていきたいと思います。まずは、実行結果をこのページの動画を見ながら確認してください。 また、このサンプルファイルはダウンロードできますので、こちらを見ながら勉強していきましょう。 プログラミング言語には必ず変数というものがあります。変数とは、簡単に言うとデータの入れ物です。データを一時的に保管するために、変数というものを使います。 変数名は、自由に決めることができますが、変数名の最初を数値にしたり、JavaS
JavaScriptのイベントハンドラ説明
本気でやるならonclick属性は避けてライブラリを活用すべき - 帰ってきたHolyGrailとHoryGrailの区別がつかない日記 を読んで，思うところあって書いてみました（決してカウンターアーティクルではない）。 むかしむかし JavaScript を触っていた むかしむかしに書かれた JavaScript の本で勉強している／した 人向けに。大元記事（そろそろ本気で学びませんか？ | Think IT（シンクイット））の想定読者に近いかなと思います。よって以下は JavaScript の初学者にはまったくおすすめできない（余計な知識がついてしまう）です。 Step 1: はじめのいっぽ ボタンを押したらメッセージボックスが出現する HTML を書いてみます。 <html><body> <script type="text/javascript"> function ShowMes
RubyistによるRubyのオンラインマガジン「Rubyist Magazine(通称るびま)」の通読を支援するGreasemonkey (Kanasansoft Web Lab.)
通読したいと思っているのだけど、記事が多くていったいどこまで読んだか正直わからなくなってなんともはがゆかった。これを解決するためにどこまで読んだかを記憶するuserscriptを作った。 文字で説明するよりも実際に動かしてみた方がはやいんだけど一応説明。 install後にるびまを開くと、メインコンテンツのリンクの前にステータスを表すアイコンが表示される。ステータスの意味はポインタをアイコンにあわせると表示されるので割愛。アイコンをクリックすると全ステータスのアイコンが表示される。変更したい状態のアイコンをクリックすると、そのステータスを保存し選択されたアイコンのみの表示となる。 ページの遷移やステータス変更のたびに全データを呼び出し、ステータス変更を反映後保存しているので、ウィンドウやタブを複数開いていても変な上書きはしない。つまり(表示上は一致しないけど)内部データとしては矛盾が起きな
HTMLヘルプ形式のJavaScriptリファレンス「jsref.chm」を公開した。 - こせきの技術日記
MozillaのJavaScriptドキュメントとECMA Scriptの言語仕様を、まとめてHTMLヘルプ(chm)形式にコンパイルしました。Windows用です。 (2008-05-27 追記) OS XならChemrがいいみたいです。(参考) http://cid-57544de2edadf883.skydrive.live.com/self.aspx/jsref/jsref.chm *1 以下のドキュメントが入っています。 Core JavaScript 1.5 リファレンス http://developer.mozilla.org/ja/docs/Core_JavaScript_1.5_Reference Core JavaScript 1.5 ガイド http://developer.mozilla.org/ja/docs/Core_JavaScript_1.5_Guide G
JavaScriptライブラリのパフォーマンス、最速はコレだ! | エンタープライズ | マイコミジャーナル
The PBwiki engineering teamのメンバーがWebブラウザとJavaScriptライブラリのパフォーマンスを調査するために興味深いパフォーマンステストサイトを公開している。Javascript Library Performance Test Roundupにアクセスして"Run (West Coast)"かまたは"Run (East Coast)"をクリックしてみてほしい。使っているWebブラウザにおいてDojo 1.0.1、jQuery 1.2.1、Prototype 1.6.0、YUI 2.4.0、Protoculous 1.0.2の読み込み時間がどうなるかを調査してくれる。 しかも読み込み方法は通常のJavaScriptソースコード、キャッシュされたものとそうでないもの、Gzipで圧縮されたものとそうでないもの、YUI Compressorで最小化されたものと
Ajaxアプリケーション開発における7つの大罪 - builder by ZDNet Japan
Ajaxは近ごろ人気を集めているが、その人気は伊達ではない。Ajaxを使うことで、より迅速に、より効率良く、より動的なアプリケーションを開発することができるのだ。しかし、Ajaxには固有の落とし穴もあるのだ。 こういった落とし穴は一見したところ、単なる常識を使うことで避けられるように思える。そして、この見方はある意味において正しい。しかし、Ajaxアプリケーションはその先祖にあたるDHTMLとはアーキテクチャが大きく異なっているのだ。あなたがアプリケーション開発作業においてどれ程の常識を発揮しようと、先人たちの犯した過ちから学んでおく方が良いことに変わりはない。そこで、こういった過ちを7つの大罪と呼ぶことにする。ただし、過ちは決してこれらだけに留まらない。 事実、こういった7つの大罪のいずれかを犯す前により小さな過ちを犯す可能性が高い。このため、まずはこのような小罪を7つ見てみることにしよ
scrollovers
お金を稼ぎたい場合は、スマホアプリを利用したお金を稼ぐ方法がおすすめです。 おすすめの理由には手軽さをあげることができます。 外に働きに出る必要がなく、いつも使用しているスマートフォンやタブレットから稼げるので、誰でも簡単に行うことが可能です。 特別なスキルを要しないところもおすすめのポイントだと言えます。 多くの案件が誰にでもできる容易なものとなっており、特別な能力がない人でもできるものが多いです。 アンケートに答えるなどの簡単なものが多いため、未経験者でも不安なく始めることができます。 好きなときに稼げることも魅力です。 暇なときは集中して活動することができますし、忙しいときには作業をする必要がありません。 自分のライフスタイルに合わせて稼げるため、バイトのように面倒だけれど行かなければならないといった苦痛を覚えることがないです。 楽して稼ぎたい人や気楽にお金を稼ぎたい場合には、この方
Prototype、jQuery、Mootools、YUI、Dojoが人気、Ajaxian調査 | エンタープライズ | マイコミジャーナル
Ajaxianは17日(米国時間)、3度目の調査結果となる「2007 Ajax Tools Usage Survey Results」を発表した。2007 Ajax Tools Usage SurveyはAjaxian.comのユーザを対象に実施された調査で、Ajaxツールの採用状況を調べるもの。同調査結果によるとPrototypeが34.10%、jQueryが29.30%、Extが22.50%、Script.aculo.usが22.30%、Mootoolsが14.30%、YUIが13.00%、Dojoが11.90%となっている。 2007 Ajax Tools Usage Survey Results - Ajaxian.comより抜粋 この2年間でAjaxフレームワークやツールの数は倍増した。過去の調査結果では直接JavaScriptを使ってAjax機能を使っているという割合が多かった
VoxもmixiもGmailも早くなる!? JavaScriptのおまじない - カイ士伝
VoxもmixiもGmailも早くなる!? JavaScriptのおまじない（ただしXP＆IE6限定）スター users ※Windows XPでInternet Explorer 6を使っている向けの情報です。 何回かのエントリで書いている通り、毎週Voxで行なわれている「美味しい動画コンテスト」に参加しているのですが、Voxが重いのがちょっと困ってました。ページが出るのに時間がでるだけでなく、タブブラウザでタブ開きまくってるとブラウザ自体がフリーズすることすらあったので。 最近mixiもユーザー数が増えたからかかなり重くなってて大変こまりもの。仕事中はmixi日記は書かないので夜にまとめて書こうと思うとあまりの重さに書く気なくしてしまう、なんてことがここ最近しょっちゅうでした。 そんなことをちょいと愚痴っていたら、ある日天の声がとどいたのです。 てんくうの ちをひきし わかものよ この
画像に光沢を与えるjsライブラリ『Glossy.js』
画像に光沢を与えるjsライブラリ『Glossy.js』 配布元:glossy.js ライセンス:Netzgestade Software License Agreement. /Commercial Software Licenses (商用利用不可.個人利用は無料で可能) Glossy.jsは画像に光沢を与えることができるjavascriptライブラリです。 画像にclassを付けるだけで、非常にきれいな光沢をつけることが可能です。 設置方法 まず、glossy.js を読み込みます。 <script type="text/javascript" src="glossy.js"></script> 光沢を与えたい画像のclassにglossyを付けると画像に光沢が与えられます。 <img src="img.gif" alt="R" class="glossy" /> 角丸の半径を変更する
jQuery で JSONP ２通り - てっく煮ブログ
JavaScriptjQuery を使って JSONP でリクエストする方法を２通り紹介するよ。その１: $("")createElement を $() を使って実装。 $("") .attr('type', 'text/javascript') .attr('src', "http://www.example.com/jsonp.cgi?param1=value1&callback=myCallback") .appendTo($("head")); function myCallback(json){ // ロード完了時にここが呼ばれる } http://www.example.com/jsonp.cgi?param1=value1&callback=myCallback にリクエストがいく。callback のところは、サービスによって指定の仕方が違うかもね。その２: $.ajax
[JS]単純なリスト要素を開閉するスクリプト集
単純なリスト要素でマークアップされたものを、クリックで開閉できるスクリプトの紹介です。 今回紹介しているものは、全て単体で動作するもので、jQueryやPrototypeなどのライブラリは使用されていません。 Accessible expanding and collapsing menu
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
特集：Firefox 3とFirebugで始めるJavaScript開発｜gihyo.jp … 技術評論社
