JavaScript
個別またはコンパイル プラグインは、（Bootstrapの個別のjs/dist/*.jsを使って）個別にインクルードすることもできますし、bootstrap.jsやminifiedのbootstrap.min.jsを使って一度にインクルードすることもできます（両方をインクルードしてはいけません）。 バンドルラー(Webpack, Parcel, Vite…)を使っている場合は、UMDに対応したjs/dist/*.jsファイルを使うことができます。 JavaScriptフレームワークでの使用 Bootstrap CSSはどのフレームワークでも使用できますが、Bootstrap JavaScriptは、DOMの完全な知識を前提とするReact、Vue、AngularなどのJavaScriptフレームワークとは完全に互換性がありません。Bootstrapとフレームワークの両方が同じDOM要素を変
Reactのユニットテスト2021
React でユニットテストをするときのベストプラクティスはいつも悩むのですが、とりあえず 2021 年 2 月時点では、こうかなーというのをまとめてみます。 まずテストランナーは jest で確定です。ここで悩む要素はまずありません。 では、React のテストをどうやるか？です。 公式の react-dom/test-utils を使う 公式の react-test-renderer を使う @testing-library/react を使う 選択肢としてはこの三種類が有名なところでしょう。 公式という響きはとても魅力的ですが、実は公式ドキュメントから「ボイラープレートを減らすため、エンドユーザが使うのと同じ形でコンポーネントを使ってテストが記述できるように設計されている、React Testing Library の利用をお勧めします。」という形で、@testing-library
Learn | Next.js
SetupFirst, let’s make sure that your development environment is ready. If you don’t have Node.js installed, install it from here. You’ll need Node.js version 18 or higher.You’ll be using your own text editor and terminal app for this tutorial.If you are on Windows, we recommend downloading Git for Windows and use Git Bash that comes with it, which supports the UNIX-specific commands in this tutor
piyo-js.com - このウェブサイトは販売用です！ - 初心者 入門 リファレンス リソースおよび情報
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でのDOM操作は重いのかという話とForced Synchronous Layoutについて - id:anatooのブログ
2015年にもなるのにJavaScriptでのDOM操作のパフォーマンスについて書く。ウェブページにインタラクションを持たせたい時に、JavaScriptでDOM操作を行うことがよくある。このDOM操作のパフォーマンスについて、よく聞く意見を大別すると次の2つがある。 JavaScriptによるDOM操作は重たい レンダリングが重いだけで、DOM操作そのものはそれほど重たくない JavaScriptでオブジェクトのプロパティを操作したりする単体の処理は通常1ミリ秒もかからないが、DOM操作をするとレンダリングが完了するまでに数十ミリ秒程度かかったりする場合がある。1番目のDOM操作が重たいと言っている人は経験則的にそう言っていることが多い。 レンダリングの仕組みを知っている人は2番目の意見を言うが、重箱の隅をつつくような話をするとこれも必ずしも正しいわけではない。DOM操作するコードによっ
Node.jsのイベントループを理解する | POSTD
(訳注：2015/8/4、いただいた翻訳フィードバックを元に記事を修正いたしました。) Nodeの”イベントループ”は高スループットのシナリオを操作する中枢で、ユニコーンや虹で満ちあふれているような魅力的な場所です。そしてこのイベントループのため、バックグラウンドで任意の処理の実行が可能でありながら、Nodeは本質的に”シングルスレッド”になるのです。この記事では、イベントループがどのような処理を行うのかを説明していきます。そうすれば皆さんも、この魔法を使いこなせるようになるでしょう。 イベント駆動型プログラミング イベントループを理解するためにまず必要なのは、イベント駆動型プログラミングのパラダイムを理解することです。イベント駆動型プログラミングは、1960年代から広く知られてきました。現在は主にUIのアプリケーションに使用されています。JavaScriptでは主にDOMとのやりとりで利
Masato Kinugawa Security Blog: Referrer文字列によるXSS
リファラを使ったXSSの小ネタです。 今回取り上げるのは、ターゲット自身が、細工したページを経由することでつけられたリファラによって攻撃を受けるケースです。このような攻撃の場合は、現実に経由可能なページからでしか攻撃文字列を送りこむことができません。 例えば、以下のように、document.referrerをそのままdocument.write()しているページがあるとします。 http://vulnerabledoma.in/location/ リファラを書き出している部分でXSSできるでしょうか。 IEでは単純です。 IEはURLのクエリに、エンコードせずに「"<>」などを含めることができるので、これらを含むURLから、リファラを書き出しているページへ遷移させれば、XSSが起きます。 http://l0.cm/xss_referrer.html?<script>alert(1)</sc
世の中のHTML5アプリケーションが糞だから、俺が「初期化」の作り方を教えてやんよ - mizchi's blog
2chまとめみたいなタイトルにしてみた。(してみたかった) HTML5のアーキテクチャと初期化とキャッシュの考え方が、「ウェブエンジニア」は本当に出来てない。 とくにソシャゲをウェブビューに貼ってスマホ対応しました系。本当にダメ。 じゃあどうするか？基本的に「初期化」の考え方を直せばどうにかなる。 (この記事はBackboneを使うときに考えてることだけど、他でも一緒だと思う) 前提 シングルページアプリケーション セマンティクスやSEOは考慮しない 基本哲学 共通モデルの初期化を徹底的に行う サーバーにリクエストを投げるのは最小限 クライアントでサーバーモデルのキャッシュを作り、更新が期待されるまで再取得しない 理由 いくらDOMの最適化したところでUXに影響が大きいのはサーバーリクエスト(200~2000ms)で、プログラミング段階で辛さがあつまるのは非同期処理の部分。 プログラマとし
はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
Shibuya.XSS テクニカルトーク#1 に行ってきた - すぎゃーんメモ
Shibuya.XSS テクニカルトーク#1 : ATND 大人気イベントに何故か3番目で申し込むことが出来ていたので行ってきた。ちょっと書くわけにはいかないような話や怖い話もあったりして楽しかった。とりあえずTwitterでの呟きだけメモ代わりに残しておく。 #shibuyaxss キター @ 株式会社ミクシィ(mixi, Inc.)なう URL 2012-04-04 18:59:31 via ロケタッチ（loctouch） MAP 「ミクシィ」シールを手に入れた! URL 2012-04-04 18:59:32 via ロケタッチ（loctouch） 自重せずにピザとビール始めてる #shibuyaxss 2012-04-04 19:04:33 via Twitter for iPhone XSSによるパスワード盗み対策例： パスワード入力させるようなところは"login.exampl
第一回 太一にモダンJSを教える会 - 設計と実装の狭間で。
と言う会が品川某所で、2011/10/05にヒッソリと開催されました。 お客様は主催者たる僕のみで、それ以外の参加者は基本的に講師という大変贅沢な会です。 それなりに話はあっちこっちしていたし、 話題に上がった重要そうな部分で、僕が覚えている事を補足しながらメモ書き。 妥当でない部分があったので、変更。 スケールするUI(by @monjudoh) イベントを遅延ディスパッチする。ドラッグ＆ドロップは実装が難しいかも。 イベントリスナは、より広い範囲で受ける。 例えば、一覧データなら、カラム内で受けるより、行で受ける方が良いし、それよりもテーブルで受ける方が良い。 これにはいくつか理由がある。 - 動的にデータが変更される中でイベントリスナの配置漏れによって適切に動作しない様なケースを避ける。 - イベントリスナのオブジェクトのインスタンス数を減らす。 - イベントリスナは登録処理が重いの
GoogleのChromeブラウザの構成モジュールのそれぞれのバイナリ・サイズの表 - [モ]Modern Syntax
映像作家のエオウィン・アルドリッジさんが撮ったビデオは水を飲む自分の姿をいろいろな映画監督のスタイルで撮影してみる、というものです。 パート1とパート2で総勢20名の映画監督のスタイルでやっています。パート1の最後ではエオウィン・アルドリッジさん本人のスタイルのものもみせています。 私は結構映画を観る方なんですが、正直よくわかんないものもあって、まだまだ勉強不足だなあと思いました。 で、このビデオ、映画監督の名前が先に表示されるのでその心構えで観ることができるんですけど、逆に映像を見せて「これ、どの映画監督のスタイルでしょうか？」という質問形式にしたら全然わかんないじゃないかと思うんですけど、どうなんでしょうね。 ではパート1です。ここでは以下の監督のスタイルが披露されています。 Christopher Nolan, Stanley Kubrick, Edgar Wright, Quent
ソフトバンクの非公式JavaScript対応の調査結果
ソフトバンクのYahoo!ケータイブラウザは、2010年春モデルまで非公式のJavaScript対応機種がありました。2010年5月に、私的にその対応状況を調査した結果を公表します。 これは、「Yahoo!ケータイの一部端末に「かんたんログイン」なりすましを許す問題」を公表するにあたり、影響のある端末を調べるために、端末実機の検証センターにて抜き取り検査した結果です。 考察JavaScriptが最初に搭載されたのは、2004冬の702NKらしい。以降、ノキア端末にはJavaScriptが搭載される。この時期のJavaScriptは簡易的なもの。 2006年冬モデルから多くのモデルでJavaScriptが搭載される。この時期の端末は、DOMは対応しているが、XMLHttpRequestは対応していない。 2008年春モデルから一部の機種でXMLHttpRequestをサポートする。 シャープ
はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
今、知っておきたいJavaScript
Webブラウザとテキストエディタさえあれば、プログラミングして実行できるシンプルで手軽な言語――。それがJavaScriptが初めて登場してからしばらくの間、多くの人が抱いた印象でした。しかし、Ajaxの登場に伴う第2のブーム以降、ハードルが高くなったように感じられます。 その大きな理由の一つが、DOM（Document Object Model）に基づくJavaScriptプログラミングでしょう。DOMは、HTMLやXMLを構成する各要素に対して、プログラムからアクセスして内部の情報を取得・変更したり、機能を利用したりするためのAPI（Application Programming Interface）です。DOMを使うことによって、WebページをリロードせずにWebページを部分的に書き換えたり、HTMLドキュメントの構造を動的に変えたりといったことが可能になります。 DOMは便利な仕組
【レポート】IE9、ほかのブラウザと同じJavaScriptコード動作へ | エンタープライズ | マイコミジャーナル
Windows Internet Explorer 9 JavaScriptプログラミングでフラストレーションが溜まるポイントのひとつに、IEとそれ以外のブラウザで記述方法が異なることを挙げることができる。特にDOM周りのコーディングはIEだけ別の記述をしなければならない。しかし、これもIE8までの話ということになりそうだ。現在開発が進められているIE9ではこうした問題が解決している。どういった変更を実施したかがIEBlogのExploring IE9's Enhanced DOM Capabilitiesに詳しく説明されている。 これまでIEだけはDOM周りの実装がほかのブラウザと違っていた。これはDOMへのアクセスにCOMを使っていたことに原因がある。結果として、プログラマがすべてのブジェクトに期待する機能がIEの提供するDOMオブジェクトにだけは存在せず、別の方法を使って実現する必要
DOM1仕様書
文書オブジェクトモデル(DOM)第1水準 仕様書 Version 1.0 この文書は、W3Cにより作成されW3C勧告として公開されている "Document Object Model (DOM) Level 1 Specification Version 1.0" (http://www.w3.org/TR/1998/REC-DOM-Level-1-19981001/) を、どら猫本舗が翻訳したものです。 最新版の仕様書は http://www.w3.org/TR/REC-DOM-Level-1/ にあります。 正式な仕様書はW3Cサイトにある英語版です。この日本語版は参考にすぎません。 この文書には翻訳上の誤りがあるかもしれません。どら猫本舗は翻訳の正確性を保証しません。あくまでご自身の責任でご利用ください。 お気付きの点がありましたらどら猫本舗までお知らせください。 REC-DOM-L
Document Object Model (DOM) Level 1 Specification
REC-DOM-Level-1-19981001 Document Object Model (DOM) Level 1 Specification Version 1.0 W3C Recommendation 1 October, 1998 This version http://www.w3.org/TR/1998/REC-DOM-Level-1-19981001 http://www.w3.org/TR/1998/REC-DOM-Level-1-19981001/DOM.ps http://www.w3.org/TR/1998/REC-DOM-Level-1-19981001/DOM.pdf http://www.w3.org/TR/1998/REC-DOM-Level-1-19981001/DOM.tgz http://www.w3.org/TR/1998/REC-DOM-Leve
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Introduction | Testing Library
Node: removeChild() メソッド - Web API | MDN
