コア学習モジュール

前提条件

この一連のモジュールを開始するにあたって、前提となる知識は必要ありませんが、コンピューターに馴染み、基本的なアプリケーション（ウェブブラウザーやコードエディターなど）がインストールされていることを確認し、ウェブやウェブ技術に関する予備知識を身につけておくことをお勧めします。 これらのトピックはすべて、私たちの入門モジュールで取り上げています。

特に、コードを書いたことがない方には、初めてのウェブサイトモジュールをお勧めします。このモジュールでは、ウェブ技術をとてもやさしく紹介し、簡単なウェブサイトを構築するプロセスを案内します。

モジュール

HTML によるコンテンツの構造化

高品質で使いやすく、アクセシビリティに優れたウェブサイトを構築するには、意味論的な HTML を使用してコンテンツ構造を定義する方法を理解する必要があります。このモジュールでは、文書構造、リンク、リスト、画像、フォームなど、主要な分野について説明する前に、 HTML 言語の基本をカバーします。

CSS によるスタイル設定の基本

CSS（カスケーディングスタイルシート）は、ウェブページのスタイルやレイアウトに使用されます。例えば、コンテンツのフォント、色、サイズ、文字間隔を変更したり、コンテンツを複数の段組みに分割したり、アニメーションや装飾機能を追加したりすることができます。このモジュールでは、構文、機能、テクニックなど、これで必要な CSS の基本すべてを提供します。

CSS によるテキストの装飾

CSS 言語の基本的な部分をカバーしたので、次に重点的に学習する CSS のトピックは、 CSS で最もよく行われることの 1 つであるテキストの装飾です。ここでは、フォント、太字、イタリック、行間や文字間隔、ドロップシャドウ、他にもテキスト機能など、基本的な部分を見ていきます。このモジュールでは、ページにカスタムフォントを適用する方法や、リストやリンクの装飾についても見ていきます。

CSS レイアウト

前回までのモジュールでは、コンテンツが収まるボックスのスタイルや操作方法について見てきました。 今回は、ボックスを互いに関連付け、ブラウザーのビューポートに合わせて正しくレイアウトする方法について見ていきます。 このモジュールでは、浮動ボックス、位置指定、他にも現行のレイアウトツール、さまざまな端末、画面サイズ、解像度に対応するレスポンシブデザインの構築について見ていきます。

JavaScript による動的スクリプト

JavaScript は非常に大きなトピックであり、習得すべき機能、スタイル設定、テクニックが数多くあり、また、その上に構築された API やツールも数多くあります。このモジュールでは、主にコア言語の要点と、その周辺にあるいくつかの重要なトピックに焦点を当てます。これらのトピックを学習することで、作業する上での確かな基盤が与えられます。

JavaScript フレームワークとライブラリー

JavaScript フレームワークは、現行のフロントエンドウェブ開発に欠かせない要素であり、開発者に、スケーラブルで操作性の高いウェブアプリケーションを構築するための、実績のあるツールを提供します。 多くの現行の企業では、ツールの標準的な一部としてフレームワークを使用しているため、フロントエンド開発の仕事では、フレームワークの使い勝手が問われることが多くなっています。 この一連の記事では、フレームワークの学習を始めるにあたって、快適なスタート地点を提供することを目的としています。

アクセシビリティ

公共サービス、教育、eコマースサイト、エンターテイメントなどのウェブコンテンツにアクセスすることは、人権です。 障碍、人種、地理的条件、または他にも人間的特性を理由に、誰一人として排除されるべきではありません。 このモジュールでは、ウェブサイトを可能な限りアクセシブルにするために学ぶべき最善の手法やテクニックについて議論します。

開発者のためのデザイン

このモジュールの狙いは、開発者にデザイン思考を（再）紹介することです。デザイナーとして働きたいわけではないかもしれませんが、基本的な使い勝手やデザインの理論を持っておくことは、その役割が何であれ、ウェブサイト構築に関わるすべての人にとって良いことです。少なくとも、最も技術的な「デザイナーではない」開発者であっても、デザイン概要を理解し、なぜそのようにデザインされているのかを理解し、ユーザーの心理を把握できるようにしておくべきです。そうすれば、ポートフォリオをより良く見せていくのに役立つでしょう。

バージョン管理

バージョン管理ツールは、コードベースのバックアップや共同作業を行うために、現行のワークフローに不可欠な要素です。このモジュールでは、 Git と GitHub を使用してバージョン管理の要点を紹介します。

関連情報

The Frontend Developer Career Path ^{MDN カリキュラムパートナー}

Scrimba のフロントエンド開発者キャリアパスでは、楽しく対話しながら学べるレッスンや課題、知識豊富な講師、対応しているコミュニティを通じて、有能なフロントエンドウェブ開発者になるために必要なすべてを学ぶことができます。ゼロから最初のフロントエンドの仕事に就くまで、このコースの多くの部分は、無料版として単独で利用できます。