--- title: ウェブ開発を学ぶ slug: Learn tags: - Intro - Landing - ウェブ - 初心者 - 学習 - 索引 translation_of: Learn ---

MDN 学習エリアへようこそ。この一連の記事では、ウェブ開発が全くの初心者にとって、シンプルなウェブサイトのコーディングを始めるのに必要な全てを提供することを目標とします。

MDN のこのエリアでは、あなたを「初心者」から「上級者」までのスキルアップでなく、「初心者」から「中級程度」までの支援となります。ウェブ開発において自分なりの方法を確立するためには、さらに、MDN のこのエリア以外の記事と、中・上級者用のウェブサイトを読み進めてください。その前提知識を身に付ける為に本、学習エリアがあります。

全くの初心者であれば、ウェブ開発は難しいものです - 私たちはあなたの手を握り、あなたが快適に感じ、適切にトピックを学ぶために十分な詳細を提供します。あなたがウェブ開発を学習している学生 (個人またはクラスの一部として)、クラスの教材を探している先生、趣味の人、ウェブ技術の仕組みをもっと理解したい人など、どのような人であっても、安心してください。

何が新しくなった？

学習エリアのコンテンツは定期的に追加されています。学習エリアのリリースノートには、何が変更されたかを記載しています。

カバーしてほしいトピックや不足していると感じたトピックについて質問がある場合は、Discourse フォーラムにメッセージを送ってください。

フロントエンドのウェブ開発者を目指している方へ

ゴールに向かって頑張るために必要な情報をまとめたコースをご用意しました。

始めましょう

読み始める場所

完全な初心者の方: ウェブ開発の完全な初心者なら、ウェブ入門を一通り読むのをお勧めします。これを読めば、ウェブ開発を始めるのに必要な基本的な知識はすべて見つかるでしょう。
特定の質問がある方: ウェブ開発について何か質問がある場合、よくある質問セクションに助けとなる情報があるかもしれません。
基本の次の段階の方: すでにいくらかの知識があるなら、次のステップは {{glossary("HTML")}} と {{glossary("CSS")}} を詳しく学ぶことです。 HTML 入門のモジュールから始めて、 CSS 入門のモジュールに移動します。
スクリプト作成まで進む方: HTML と CSS を十分知っていたり、主にコーディングに興味があるなら、 {{glossary("JavaScript")}} やサーバーサイド開発に移動したくなるでしょう。JavaScript の第一歩とサーバサイドの第一歩のモジュールから始めます。

メモ: 用語集にて、単語の定義が提供されています。

{{LearnBox({"title":"Random glossary entry"})}}

カバーするトピック

下記は MDN 学習エリアにてカバーしているすべてのトピック一覧です。

ウェブ入門: 完全なウェブ開発初心者用の実用的な入門を提供します。
HTML — ウェブの構造化: HTML はコンテンツのいろいろな部分を構造化し、意味や目的を定義するのに使う言語です。このトピックでは HTML を詳細に教えます。
CSS — ウェブのスタイルづけ: CSS はウェブのコンテンツをスタイルづけしたりレイアウトしたり、アニメーションのような振る舞いを追加したりする言語です。このトピックでは CSS を包括的にカバーします。
JavaScript — 動的クライアントサイドスクリプティング: JavaScript はウェブページに動的な機能を追加するスクリプト言語です。このトピックでは JavaScript を書いたり理解するのに十分となるのに必要なすべての要点を教えます。
アクセシビリティ — ウェブをすべての人が利用できるようにする: アクセシビリティはウェブコンテンツをなるべく多くの人に利用できるようにする実践であり、それは障がいや、端末や、ロケールや、その他の分化させる要素に関係なく利用できるようにします。このトピックでは知る必要のあるすべてが与えられます。
ウェブの性能 — ウェブサイトを高速かつレスポンシブにする: ウェブの性能は、ウェブアプリケーションのダウンロードを確実に高速化し、ダウンロードを帯域幅、画面の寸法、ネットワーク、端末の能力にかかわらず、ユーザーの操作をレスポンシブにする技術です。
ツールとテスト: このトピックは開発者が作業をやり易くするツール、例えばクロスブラウザーテストツールなどについてカバーします。
サーバサイドのウェブサイトプログラミング: クライアントサイドのウェブ開発に集中していても、サーバとサーバサイドのコードがどう動くのかを知るのは有益です。このトピックではサーバサイドの動作の一般的な入門と、2 つの有名フレームワーク — Django (Python) and Express (node.js) を使ってサーバサイドアプリを作る方法の詳しいチュートリアルを提供します。

コードサンプルを入手する

学習エリアにあるコードの例はすべて GitHub で利用可能です。それらすべてをあなたのコンピュータにコピーしたいのなら、最も簡単な方法は最新の master コードブランチのZIPをダウンロードすることです。

自動更新を可能にするより柔軟な方法でリポジトリをコピーしたい場合は、より複雑な指示に従うことになります。

あなたのマシンに Git をインストールします。これは GitHub が動作している、その下にあるバージョン管理システムのソフトウェアです。
GitHub にサインアップします。
サインアップが済んだら、ユーザー名/パスワードで github.com にログインします。
あなたのコンピューターでコマンドプロンプト (Windows) かターミナル (Linux, macOS) を開きます。
learning area のリポジトリを、あなたのコマンドプロンプト/ターミナルの現在位置の learning-area と呼ぶフォルダーにコピーするには、下記のコマンドを使います。
```
git clone https://github.com/mdn/learning-area
```
そのディレクトリに入って、ファイルが (finder/エクスプローラーや、cd コマンドのいずれか) の後に見つかるでしょう。

learning-area リポジトリを、GitHub の master バージョンになされたあらゆる変更で更新するには、以下の手順でできます。

コマンドプロンプト/ターミナルで、cd を使って learning-area ディレクトリの中に移動します。例えば、上位のディレクトリにいる場合は以下のようにします。
```
cd learning-area
```
下記のコマンドでリポジトリを更新します。
```
git pull
```

連絡方法

何か連絡を取りたいことがある場合、learning area discourse スレッドや IRC チャンネルでメッセージを投稿するのがもっともよい方法です。サイトの間違いや新しい学習トピックスの要望、理解できない項目についてのヘルプ要請などなんでも歓迎です。

コンテンツの開発、改善の手助けに興味がある場合、協力するには？を覗いて、始めてください！あなたが初心者でも、先生でも、熟練のウェブ開発者でも、その他学習体験の改善に興味がある人でも、誰でも歓迎です。

何が新しくなった？

フロントエンドのウェブ開発者を目指している方へ

読み始める場所

カバーするトピック

コードサンプルを入手する

連絡方法

関連情報