ウェブ入門

プロが作るようなウェブサイトを作るのはとても大変な作業です。ウェブ開発の初心者は、まずは小さなものから作り始めるとよいでしょう。今すぐ Facebook のようなサイトを作ることはできませんが、簡単なウェブサイトなら作るのはそれほど難しくありません。私たちはここから始めることにしましょう。

以下の一覧の記事を通して作業することで、何もないところから、最初のウェブページをオンラインで公開できるようになります。さあ、旅を始めましょう。

基本的なソフトウェアのインストール

ウェブサイトを構築するためのツールは、実にさまざまなものからがあります。これから始める人は、コードエディター、フレームワーク、テストツールなど、さまざまな種類のツールに戸惑うかもしれません。この記事では、基本的なウェブ開発を始めるために必要なソフトウェアをインストールする方法を手順を追って紹介します。

ウェブサイトをどんな外見にするか

ウェブサイトのコードを書き始める前に、まずは計画を立てることが大切です。あなたのウェブサイトにはどんな情報を載せますか？フォントや色はどうしたいですか？ここでは、コンテンツやデザインを計画するのに役に立つ簡単な方法を紹介します。

ファイルの扱い

ウェブサイトを作るにはたくさんのファイルが必要です。テキストコンテンツ、コード、スタイルシート、メディアコンテンツなどファイルがあります。ウェブサイトを作るときは、これらのファイルをうまく配置して、ファイル同士がお互いにアクセスできることを確認する必要があります。この記事では、ウェブサイトのファイルを適切に配置する方法と、気をつけるべきことについて説明します。

HTML の基本

HyperText Markup Language (HTML、ハイパーテキストマークアップランゲージ) とは、ウェブコンテンツを構成し、その内容に意味や目的を持たせるために使用するコードのことです。例えば、私のコンテンツは段落の集合なのか、それともこの点のリストなのか？ページに挿入する画像はあるか？データ表はありますか？この記事では、HTMLに慣れるために必要な情報を提供します。

CSS の基本

Cascading Stylesheets (CSS: カスケーディング・スタイルシート) は、ウェブサイトの見た目を決めるために使うコードです。CSS を書くと、テキストの色を黒や赤にしたり、コンテンツを画面のどこに表示するかを決めたり、ページの背景に好きな色をつけたり画像を表示したりして、ウェブサイトを好きなように飾り付けることができます。この記事では、こうした飾り付けの方法について説明します。

JavaScript の基本

JavaScript は、ウェブサイトにインタラクティブな機能を追加するために使うプログラミング言語です。例えば、ゲーム、ボタンが押された時やフォームにデータが入力された時に起こること、動的なスタイルの効果、アニメーション、などなどです。この記事では、この楽しいプログラミング言語を使ってどんなことができるのか、そしてどうやって使い始めれば良いのかを紹介します。

サンプルコードの公開

ウェブサイトのコードを書き終えて、ウェブサイトに必要なファイルが用意できたら、作ったファイルをすべてオンラインにして、インターネット上の他の人からも見られるようにする必要があります。この記事では、簡単なサンプルコードを最小限の手間でオンラインに公開する方法を説明しています。

ウェブのしくみ

あなたがお気に入りのウェブサイトにアクセスする時、実は目に見えない所ではとても複雑なことが行われています。ここでは、あなたがパソコンでウェブページを開いた時に裏側でどんなことが行われているのか、その大まかなしくみを説明します。

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

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

Web Demystified

ウェブの基本を説明した素晴らしい動画のシリーズで、完全な初心者がウェブ開発できるようにするためのものです。 Jérémie Patonnier 作。

ウェブとウェブ標準

この記事では、ウェブの役立つ背景 — どうやってできたのか、ウェブ標準技術とはなにか、どう連携させるか、「ウェブ開発者」がなぜ素晴らしいキャリアであるか、この過程を通じてどんなベストプラクティスが学習できるか — を提供します。