XMLHttpRequest とはなんだったのか | blog.jxck.io
Intro Fetch API の実装が広まり、 IE もリタイアを迎えたことで、今後忘れ去られていくことになるだろう XMLHttpRequest について。 どのように始まり、どのように広まり、どのように使われなくなっていくのか。その間に残した多大な功績を残す。 XMLHttpRequest の始まり この名前は非常に長いため、通常 XHR と略される。 この API は、現在の Web API のように W3C/WHATWG による標準化を経て策定された API ではない。 Microsoft によるいわゆる独自実装の API として始まり、後追いで標準化される。 したがって、 Web API の中でもかなり異質な命名である XHR が、 XmlHttpRequest でも XMLHTTPRequest でもなく XMLHttpRequest である理由も、 Microsoft の命
セガがjavascriptでぷよぷよを作るプログラミング講座を出しているが、とても良いプログラミングの教材になっている「写経はとても大事」
ショーヘー@デイトラ代表 | 受講生25,000人突破 @showheyohtaki プログラミング学習中の方へ👨💻 これ面白い！！セガがjavascriptでぷよぷよを作るプログラミング講座を出してくれてます😊 動作ごとに細かくコメントも入ってるので、ちゃんとソースコードを読んでから写経していったらめちゃくちゃいいプログラミングの勉強になると思う！ puyo.sega.jp/program_2020/ pic.twitter.com/Xr5hmPzZXI ショーヘー@デイトラ代表 | 受講生25,000人突破 @showheyohtaki このぷよ開発に使う『Monaca』は、本来iOS用はswift・Android用はJavaと、別々に開発が必要なアプリを、HTML・jsなどのWeb標準言語でまとめて開発できるという開発プラットフォームです。 無料で使えてブラウザだけで開発可能
2021年にJavaScriptやNode.jsを勉強し始めたので、読んで良かった資料をまとめる
2021年になってJavaScript、TypeScript、Node.jsの勉強を始めました。 この記事では、読んで良かった本、記事、公式ドキュメントなどをまとめていきます。 ※2021/03時点の情報です。 個人的なリンク集ですが、「これも読むと良いよ」というものがあればぜひ教えてください。 ECMAScript ECMAScriptの仕様は、EcmaのTC39で策定されている Ecma TC39 GitHub organization ep78 TC39 | mozaic.fm Node.jsの各バージョンでのECMAScriptサポート状況 JavaScript Misreading Chat - #86: JavaScript: the first 20 years JavaScript 二十年の歴史についての回 JavaScript チュートリアル | MDN JavaScri
JavaScript情報の情報源となっているサイトの一覧を作った
JSer.infoで紹介したサイトのデータをドメイン別で一覧できるサイトを作りました。 JSer.info Watch List JSer.info Watch Listは、次の条件でサイトをドメイン別(または作者別)で一覧できます。 JSer.infoで2年以内に紹介したことがあるサイトが対象 紹介した回数順 GitHubやAmazonなど一部特殊なものは除外 JSer.infoを更新するたびにこのリストも更新されます。 そのため、鮮度を保ちつつ、JavaScriptの情報源となるサイトが一覧できるようになっています。 また、タグでの絞り込みもできるようになっているので、興味があるトピックのサイトやブログなどを調べてみるといいかも知れません。 https://t.co/CXy3hOXJ8q のデータを使ったJavaScript情報源リスト タグでの絞り込みができるようになった。 "per
Reactを使うとなぜjQueryが要らなくなるのか - Qiita
はじめに React（通称 React.js1）を全く知らない、あるいは幾つか記事を見たけどなんなのかピンと来ていない、という人のために書いています。 「jQuery くらいしか知らない」くらいの人に具体的に雰囲気を知ってもらうのが目的であり、すでにやる気がある人向けのチュートリアルではありません。やる気が出れば日本語版ドキュメントを読んで手を動かせばあっという間なので、そこまでの興味が出ることを目標にしています。 以降では ES2015 (ES6) の文法（アロー関数とか）を使っています。この部分が怪しい人は先にアロー関数と const 文だけでも知ってから先に進んでください。 以下の説明中、このアイコンで表すのは（2023 年現在から見た）『昔話』です。新しく自分のコードを書く際には本来知らなくていいことですが、古い記事を見たときに混同しないための参考情報として書いてあります。この記事
You Don't Need jQuery - Qiita
注意とお願い この記事の内容はもはや古いです。ここに書いている方法では動かないものをいくつか見つけました。参考にする際は動作をよく確認してから使ってください。 ひとつお願いがあります。「あれ、動かないぞ」というコードを見つけたら是非コメントか編集リクエストで教えてください。解決方法までなくても結構です。「これはもう動かないよ」という印をつけたいのです。 この記事はYou Don't Need jQueryの日本語訳と同じ内容です。 先日ひょんなことからYou Don't Need jQueryの日本語訳をさせていただきました。著者のCam Songさんからも快諾をいただけたので1、Qiitaでも公開させていただきます。 なお、本家の英語の説明は継続的にメンテされているので、この記事の情報は古くなっている可能性があります。 追記 この記事は当初は「もうjQueryは必要ない」というタイトルで
JavaScriptソースコードを圧縮してサイズを小さくする。またはソースを整形する｜プログラムメモ
JavaScriptのソースコードを圧縮してファイルを軽くしたい。 という時がたまにあります。（ブックマークレット作成時とか。） そこでソースコード圧縮サービスサイト。 ・YUI Compressor http://refresh-sf.com YUI Compressor などのアルゴリズムを使用してHTML, JavaScript, CSSの圧縮ができます。 ・packer http://dean.edwards.name/packer/ なお行頭が ;;; で始まっているコメントはデバッグ用コメントと見なされ圧縮時に削除されます。便利！ ;;; alert('test!'); // この行は圧縮時に削除されます。 ・Creativyst® JavaScript Compressor http://www.creativyst.com/Prod/3/ ・逆にソースコードを整形する場合は
表示速度改善！SEOに効果的な必ずやるべきサイト高速化手法40選
サイトの高速化手法40選基本編1．HTML・CSS・JSの無駄な部分の削除HTMLやCSS、Javascriptのファイルで余計な空白・改行、無駄なコードはなくして、容量を削減しましょう。ダウンロード時間が短くなります。 HTMLは以下のツールを使うことで簡単に空白や改行を削除できます。 Compress HTML CSSは以下のツールを使用すると、空白・改行と共に、それぞれのプロパティを文字数が一番少なくなる記述方式に変えて容量を削減できます。 Online YUI Compressor Javascriptは以下のツールを使用すると、空白・改行と共に、コードを文字数が少なくなるように変更し、変数も短いものに変えて、容量を削減することができます。 Closure Compiler Service 2．複数のCSSファイルはすべて1つのファイルにまとめるCSSの外部ファイルを複数読み込んで
JavaScriptの「&&」「||」について盛大に勘違いをしていた件 - Qiita
論理演算子「&&」「||」について JavaScriptの基本である論理演算子の && || について、 根本的に勘違いをしていたことに最近気付いたので自戒の意味を込めてここに記します。 論理演算子の使い道 1. お馴染みの使い道「条件処理」 JavaScriptには皆さんご存知の通り論理演算子&& ||が存在します。 それぞれ「AND」「OR」という意味で、条件処理の中で使うことが多い演算子です。 // aとbに0または1を足し続ける // aとbのどちらかが最大値に達すると終了 var a = 0, b = 0, max = 50; // 条件式その１ AND while (a < max && b < max) { // 0または1を足す a += Math.round(Math.random()); b += Math.round(Math.random()); console.l
今年からジワジワくる【秘伝】のJavaScript - {ライブラリ系}初回編 - Qiita
と私が勝手に思っているだけですが 早速それを紹介？ではなくメモります。 理由 誰かが、情報発信をしないとダメかなと思い、気づいたメモとして残します。 ちょっと変わり種を紹介したかった 将来的に流行ったりした時に少しうれしいからです。 JS 正確には、JavaScriptです そして、私はJSエンジニアではありませんが、初めてJSに触れたのは小学生の頃初めて買ってもらったWindows98のPCです。あの頃は意味もなく動いたりすることが面白くて仕方なかったのです。 今回は、そんな幼少の気持ちを奮い起こしたものを紹介します。 それでは紹介 順番は適当です。見た方が面白いと感じたものを使っていただければという感じです。そして、一介のエンジニアたる私の独断と偏見でメモしてるだけですので、あまり内容は気にしないでください。ああ、JSも知らない残念なやつだと罵ってくださっても構いません、実際そのとおり
マイクロソフトのJavaScriptライブラリー「WinJS」について知っておくべき５つのこと
これまでマイクロソフトの Build カンファレンスは、開発者の中でも特にマイクロソフトのプラットフォーム用に製品を開発する保守的な開発者を対象としていた。先日同社が既存の JavaScript フレームワーク「WinJS」のオープンソース化を発表したことで、このカンファレンスはウェブやモバイルの開発者も対象としていくことになるだろう。 WinJS は、HTML/CSS/JS アプリケーションの開発を支援する JavaScriptツールキットだ。これによって開発者は、ウェブやAndroid、iOS といった Windows 以外のプラットフォーム向けにも Windows アプリを開発することができる。今回 WinJS がオープンソース・プロジェクト化されたため、開発者は WinJS を利用したコードを GitHub 上に提供することも可能になった。 Angular、Backbone、Emb
JavaScriptの圧縮・軽量化ツールを通すと動かなくなった時に気をつけるたった1つのこと - 好き勝手に・げーあにん？
GoogleのCloser Compilerか、YUI Compressorを使う。どっちもダメだったらあきらめる。 おわり。 以下は上記に至るまでの経緯的なもの。 JavaScriptのツールとかまったく詳しくないので、ぐぐりながらいくつか軽量化を試していたら、動かなくなるパターンのほうが多かった。 で、どこで動かなくなっているのか追っていたら、どれもこれも改行を削除するタイプの軽量化ツールで、セミコロンを打ってないと動かないパターンだった。 function hoge(){ var a=1 alert(a) } hoge() これの単純な空白文字削除での軽量化の正しい例は function hoge(){var a=1;alert(a)}hoge(); a=1; にセミコロンが必要なんだけど function hoge(){var a=1 alert(a)}hoge() ↑こんな感じに
[JS]このホバーエフェクト楽しい！シールのようにぺらっとめくるスクリプト -Sticker.js
写真画像やアイコンなどを配置したベタ塗りのボタンなどをサークル状にし、ホバーするとシールのようにぺらっとめくれるようにするスクリプトを紹介します。 実装は非常に簡単で、jQueryなどの他のスクリプトは必要ありません。 Sticker.js Sticker.js -GitHub Sticker.jsのデモ Sticker.jsの使い方 Sticker.jsのデモ デモはChrome, Safari, Firefox, Opera, IE10+でご覧ください。 上記のアニメーションは左からのぺらっですが、上下左右の全ての方向からぺらっができます。右のベタ塗りはめくるとシャドウが半透明で適用されます。 Sticker.jsのフッタ 最初のデモは写真画像なのでカーソルはアローですが、フッタのはリンクなのでポインターになっています。 Sticker.jsの使い方 Step 1: 外部ファイル 当ス
React - Facebook製。JavaScriptのUI生成ライブラリ MOONGIFT
Facebookからまた面白そうなソフトウェアが出てきましたよ！ JavaScriptにおけるテンプレートフレームワークは数多く出てきています。いずれも興味深い作りなのですが、ここにきてFacebookがReactというライブラリをリリースしました。 ReactはUIを生成するJavaScriptライブラリで、MVCでいうところのVになります。さっそくコードを見てみましょう。 一番シンプルな実装例。左側がコード、右側が実行結果になります。 Reactは必須ではないのですがJSXというXMLライクな記法を使っています。 <hellomessage name="John" />のように定義するとthis.props.nameで値が取り出せます。実際の描画はリアルタイムに反映されるので、Helloのところを修正すればすぐにレンダリング内容が変わります。 こちらはタイマーを使った例。コードが見やす
レーダーチャート - JavaScript ライブラリー - HTML5.JP
JavaScriptからレーダーチャートをcanvas要素に描画します。パラメータを指定することで、項目、色、凡例表示などお好みのレーダーチャートを柔軟に描画できます。 ダウンロード Release Date Size (byte) Download 使い方 graph_radar_x_x_x.zipを解凍し、html5jpフォルダをウェブサーバにそのままアップロードしてください。グラフを表示させたいHTMLには次のタグを記述してください。 <div><canvas width="400" height="300" id="sample"></canvas></div> 上記タグは次の点に注意してください。 canvas要素は、必ずdiv要素で囲んでください。 canvas要素には、必ずwidth属性とheight属性を記述し、幅と高さを指定してください。 canvas要素には、必ずid属
rainyday.js
About The idea behind rainyday.js is to create a JavaScript library that makes use of the HTML5 canvas to render an animation of raindrops falling on a glass surface. Simple enough, right? Have a look at the demos to see it in action. Features rainyday.js features extendable API, collision detection and is easy to extend with your own implementations of different animation components. Cross-browse
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Vue.js 2.3 CheatSheet
脱jQueryのためにしたこと - Qiita
JSMin
Chart.js
