ウェブ開発のチュートリアル

「ウェブ入門」は、ウェブ開発の実際について紹介する簡潔なシリーズです。 基本的なウェブページを構築し、自分自身のコードを公開するために必要なツールをセットアップします。

HTML 学習モジュールの導入では、 HTML を基礎から学べます。 HTML の知識は必要ありません。 ステージを設けて、重要な概念と構文に慣れ親しみ、テキストに HTML を適用する方法、ハイパーリンクを作成する方法、 HTML を使用してウェブページを構築する方法を見ていきます。

この HTML ガイドは、初心者向けに HTML タグを含めた、よくあるタグを紹介しています。 また、段階ごとに基本的なウェブページを作成するためのコード例を載せています。

問題に挑戦し HTML のスキルを磨きましょう。マークアップが意味のあるものになっているか (例: <h2> か <strong> のどちらをを使うべきか) がポイントです。

フォームは、ウェブの重要な部品です。フォームは多くの機能を提供し、ユーザーがウェブサイトとやり取りする際に必要なものとなっています。例えば登録、ログイン、フィードバックの送信、商品の購入、などなど。このモジュールではフォームのクライアント側の部分を作成するところから始めます。

ウェブページを最適化することでサイト表示の待ち時間を短くし、サーバーとインターネット接続経路の負荷を軽減する方法を学ぶことができます。

CSS (Cascading Style Sheets) は、ウェブページのスタイルを設定するコードです。CSS の基本ではあなたが始めるのに必要なものを紹介します。私たちは次のような質問に答えます：テキストを黒または赤にするにはどうすればいいですか？ そのような場所でコンテンツを画面に表示させるにはどうすればよいですか？ 背景画像と色を使ってウェブページをどのように飾るのですか？

CSS (Cascading Style Sheets) は、ウェブページのスタイルづけやレイアウトに使用されます。例えば、コンテンツのフォント、色、サイズ、間隔を変更したり、複数の段に分割したり、アニメーションやその他の装飾機能を追加したりすることができます。このモジュールでは、 CSS がどのように機能するか、どのような構文になっているか、そして HTML にスタイルを追加するためにどのように使い始めるか、といった基本的な内容で、 CSS マスターへの道を順番に始めます。

HTML 要素を、要素の状態に基づくなどして、CSS で対象とします。

ある要素に競合する宣言がある場合、どの CSS 宣言が適用されるかを決定するためのブラウザーアルゴリズムを、詳細度クイズ（英語）を使って理解します。

カスケード、詳細度、継承は、 CSS が HTML にどのように適用されるか、およびスタイル宣言間の競合がどのように解決されるかを制御します。

ここでは、フォント、太字、イタリック体、線、文字間隔、影、その他のテキストの機能の設定を含むテキストのスタイル付けの基礎を確認します。ページにカスタムフォントを適用し、リストとリンクにスタイルを適用することでこのモジュールを締めくくります。

初心者向けによくある質問と回答です。

この時点で、 CSS の基本、テキストスタイルの設定方法、コンテンツが内部にあるボックスのスタイルと操作方法については説明を終えています。今度は、ボックスを表示領域に関連して適切な場所に配置する方法を見てみましょう。必要な堰堤条件についてはすでに終えているので、 CSS のレイアウト、様々な display の設定、浮動 (float) と位置指定 (positioning) を含む従来のレイアウト方法、フレックスボックスのような新しいレイアウトツールなどについて詳しく調べることができます。

CSS の完全なリファレンスです。Firefox やその他のブラウザーの対応の詳細もあります。

前からある植字用のグリッドを使いながら、ブラウザーのウィンドウに合わせて可変的にリサイズするレイアウトを設計することができます。

CSS スキルを確認し、何を勉強すべきかを知ることができます。

CSS を使って、回転、傾き、拡大、縮小、移動を行います。

CSS トランジションでは、CSS プロパティの変化を即時に行うのではなく、アニメーションで行う方法を提供します。

canvas 要素を使用するスクリプトを書いてグラフィックを描く方法を学ぶことができます。

このモジュールでは、JavaScript のすべての主要な基本機能の説明を続け、条件分岐、ループ、関数、イベントなど、よく遭遇するコードブロックの種類に注目します。この内容はすでにこのコースで見てきましたが、それはただ通り過ぎただけでした。ここでは、すべてを明確に解説します。

JavaScript とは何か? 何の役に立つのかを学べます。

Codecademy では簡単に JavaScript コーディングの方法を学べます。対話形式で学習でき、友人と一緒に進めることができます。

では、ウェブ開発のための様々な言語やフレームワークを教えています。フォーラム、インターネットラジオ局、ブログもあります。

JavaScript では、文字列や配列などの JavaScript のコア機能から、JavaScript の上に構築されたブラウザー API まで、ほとんどのものがオブジェクトです。関連する関数や変数を効率的なパッケージにカプセル化する独自のオブジェクトを作成することもできます。 JavaScript のオブジェクト指向の性質を理解することは、言語に関する知識をさらに深め、より効率的なコードを書く場合に重要です。したがって、このモジュールを用意しました。ここではオブジェクトの理論と構文を詳しく説明し、独自のオブジェクトを作成する方法を見て、JSON のデータとその使い方を説明します。

ウェブサイトやアプリケーションのためにクライアント側 JavaScript を書くとき、API (様々なブラウザーやサイトを動かしている OS 、さらに他のウェブサイトやサービスのデータを操作するインターフェイス) の使用が不可欠です。このモジュールでは、API とはどういったものかや開発の多くで使われる最もよくある API の使い方を調べられます。

JavaScript の中級・上級の方法論への包括的ガイドです。

JavaScript の学習をすばやく正確に学びたいプログラマーや特定のトピックスを探したり、スキルを上げたいプログラマーのためのサイトです。

基本的な JavaScript デザインパターンの紹介です。

第 1 部: 言語。第 2 部: ブラウザーでの作業。

初心者から上級者まですべてのレベル向けの分かりやすい JavaScript ガイドです。定期的に更新されています。

このシリーズは、JavaScript のコアなメカニズムを深める本です。

JavaScript で最もはまりやすい部分をドキュメント化したものです。

ECMAScript 2015 の信頼できる詳しい情報元です。

JavaScript のパターンと不適切な例であるアンチパターンを集めたものです。関数パターン、jQuery パターン、jQuery プラグイン パターン、デザイン パターン、よくあるパターン、リテラルおよびコンストラクター パターン、オブジェクト生成パターン、コード再利用パターン、DOM をカバーしています。

モダンブラウザーのエンジンやページレンダリングなどの違いが詳しく研究され、説明された論文です。

見ておきたい JavaScript についての映像を集めたものです。

WebExtensions は、ブラウザーのアドオンを開発するための、ブラウザー間互換システムです。多くの部分において、このシステムは Google Chrome や Opera が対応している拡張機能 API と大体において互換性があります。これらのブラウザー用に書かれたアドオンは大抵の場合、 Firefox や Microsoft Edge でも ほんの少し変更を加えるだけで、動かすことができます。この API はマルチプロセス Firefox とも完全な互換性があります。