JavaScript
ウェブ開発において、異なるドメイン間のデータ取得は重要ですが、セキュリティ上の制限により難しいです。この課題に対応するためJSONP（JSON with Padding）は、クロスドメインでのデータ取得を可能にする手法として注目されていました。本記事では、JSONP…
プログラミング学習の方法には様々なアプローチがあります。今回は、少し変わった方法をご紹介します。それは、p5.js（クリエイティブコーディング）を使ってJavaScriptを学ぶ方法です。 p5.jsとは？ p5.jsでJavaScriptを学ぶメリット ビジュアルフィードバ…
JavaScriptは、現代のウェブ開発において不可欠なプログラミング言語です。この入門ガイドでは、JavaScriptの基礎から応用までを体系的に学ぶための道筋を提供します。JavaScript言語の全体像を把握し、チュートリアルを通じてJavaScriptの基本的な使い方を…
JavaScriptは、現代のウェブ開発において中心的な役割を果たす言語です。フロントエンドからバックエンドまで、幅広い領域で活用されています。この学習ロードマップは、JavaScriptの基礎から高度な応用まで、段階的に習得していくための指針を提供します。 …
JavaScriptは、現代のウェブ開発において不可欠な言語です。本記事では、JavaScriptの基礎から高度なトピックスまで、広範囲にわたる項目を網羅的に紹介しています。 この記事を通じて、JavaScript言語の基本機能とより高度な応用分野の全体像を把握し、効果…
JavaScriptは、現代のウェブ開発に不可欠な言語です。本記事では、JavaScriptの主要な構文を簡潔にまとめ、各項目に簡単な説明を加えています。初心者の方の学習補助として、また経験者の方の復習やクイックリファレンスとして活用いただけます。JavaScript…
JavaScriptは、現代のウェブ開発において不可欠なプログラミング言語です。その重要性と幅広い応用範囲から、多くの開発者がJavaScriptの習得を目指しています。 このブログ記事では、JavaScript言語の基礎に絞って学習のポイントを紹介します。基礎をしっか…
JavaScriptは、ウェブサイトに動的な機能を追加するための強力なプログラミング言語です。このチュートリアルでは、JavaScriptの基本とどこにコードを書くのかを学びます。 JavaScriptの基本 JavaScriptを書く場所 scriptタグ 外部JavaScriptファイル コンソ…
JavaScriptは、現代のウェブ開発に不可欠な言語です。効果的に学習するためには、様々なアプローチを組み合わせることが重要です。この記事では、JavaScriptを学ぶための方法を複数紹介します。 書籍による学習 オンラインリソースの活用 実践的なコーディン…
jQueryのプラグインのテンプレートを作成しました。あくまで自分用に作成しました。jQueryは、新しい技術とは言えないかもしれません。しかし、学ぶことがありました。 何となくVue.jsの書き方に通ずるところがあります。個人的にVue.jsの理解の助けになりま…
MDNのドキュメントからモジュールについて勉強しました。awaitはモジュール内で利用できる機能だそうです。詳しくは分かりませんが、モジュールが非同期関数として動作できるようになるそうです。 ファイル構造 ファイルの役割 モジュールのサンプルコード …
MDNのドキュメントからモジュールについて勉強しました。ボタンをクリックしたときにモジュールがインポートされるようにします。モジュールをインポートする側でその処理を記述します。 ファイル構造 ファイルの役割 モジュールのサンプルコード 実行結果 …
MDNのドキュメントからモジュールについて勉強しました。モジュールファイルが複数になったとき、それらをまとめておくファイルを作れます。今回は、square.jsとcircle.jsをshapes.jsにまとめて、エクスポートします。インポートする側では、shapes.jsだけを…
MDNのドキュメントからモジュールについて勉強しました。モジュールをクラス構文で定義して、エクスポートします。インポートした側では、Javaのように書けるので個人的には馴染みがあります。 ファイル構造 ファイルの役割 モジュールのサンプルコード 実行…
MDNのドキュメントからモジュールについて勉強しました。モジュール全体をオブジェクトとしてインポートするとインポート文が短くなります。その方がモジュールを扱いやすくなります。 ファイル構造 ファイルの役割 モジュールのサンプルコード 実行結果 参…
MDNのドキュメントからモジュールについて勉強しました。複数のモジュールで同じ変数名、関数名を使っていても問題ありません。インポート時に名前を変更できるので、変数名、関数名の衝突を回避できます。 ファイル構造 ファイルの役割 モジュールのサンプ…
MDNのドキュメントからモジュールについて勉強しました。参考サイトの内容で充分に理解できましたが、この記事では簡易的なコードに置き換えて残します。まずは、ファイル構成やファイルの役割、モジュールの書き方について書きます。 ファイル構造 ファイル…
今回は、モジュールのインポートとエクスポートの特殊な書き方について見ていきます。具体的には、*(アスタリスク)を使った記述と再エクスポート、副作用のあるインポートの3つについてです。 事前準備 *でまとめてインポートする 再エクスポート 名前付きエ…
モジュールのインポートとエクスポートについて書きます。その中でもデフォルトインポート(default import)とデフォルトエクスポート(default export)の記述について書きます。 事前準備 モジュールのimport/export 変数のdefault import/default export 関…
モジュールのインポートとエクスポートについて書きます。その中でも名前付きインポート(named import)/名前付きエクスポート(named export)とエイリアスについて書きます。 事前準備 モジュールのimport/export named import/named export 複数の変数をimpo…
JavaScriptのモジュールは、ES2015で追加された仕組みです。今回は、モジュールの基本の書き方について勉強したことを書きます。クライアント側のJavaScriptでもモジュールが使えるようになり、便利になりました。 モジュールと名前空間 モジュールなしのJav…
以前の記事(Ajaxで外部データを取得する)で、Ajaxを利用して外部データを取得するコードをご紹介しました。このコードでは、JavaScriptのコードの中にHTMLのコードが含まれていました。今回は、JavaScriptからHTMLを分離する例を書きます。 以前のコード:XML…
jQueryのAjaxを使って、外部データ(JSON、XML、HTML)を取得する方法を見ていきます。 JSONの取得 XML(RSS)の取得 HTMLの取得 まとめ 参考 JSONの取得 ex.)気象庁のサイトから東京都の天気予報のデータをJSON形式で取得 取得先:https://www.jma.go.jp/bosai/f…
外部サイトでJSONデータをJSONPとして公開している場合、そのデータを読み込んで利用することができます。 今回は、JSONデータの読み込みについて書きます。まず、ローカルフォルダにデータを用意して、それを読み込んでみます。次に、外部サイトにあるデー…
jQueryが使えるようになると、その中身がどのようになっているのか気になります。今更ではありますが、jQuery本体のソースコードを見てみました。量が多いので一行一行まで細かく見られていませんが、全体像を何となく把握できたと思います。 私一人の力では…
JavaScriptのより良い書き方を知りたくなったので、「JavaScriptパターン ―優れたアプリケーションのための作法」を読みました。その内、本書で「必須パターン」と呼んでいるいる内容をメモとして残します。注意としては、約10年前に出版された本なので、内…
JavaScriptの入門書はたくさんありますが、より詳しい内容となるとなかなか見つからないでいました。色々なサイトを参考に、中級者向けの参考書を探したところ「JavaScript本格入門」にだとり着きました。 本の要約 学んだこと 構文のさらなる理解 組み込み…
この記事では、クラスの追加・削除をすることでアニメーションする方法について書きます。イベントと組み合わせて、インタラクティブなものを作ります。簡単にではありますが、JavaScriptを利用したアニメーションの導入としてご覧ください。 JavaScriptでク…
何かを理解するには、まず全体像を把握します。それから、一つ一つについて知っていくと理解しやすいです。私自身そうでしたが、JavaScriptを勉強すると決めたはいいものの、勉強内容が膨大で、何をどこまで勉強したらいいのか全く分かりませんでした。そこ…
これからJavaScriptを始める方に向けて、JavaScriptで何ができるのかをご紹介します。JavaScriptは、クライアントとサーバの両方で使えます。そのため、クライアントとサーバについて簡単に触れます。 JavaScriptでできること クライアントとサーバ クライア…
