プログラミング

Webプログラミングのためのリンク集

投稿日:2017年6月20日 更新日:

目次

1. まえがき

Webプログラミングを行うために、重要であると思われる情報へのリンクを集めました。仕様や公式サイトなどを中心としています。

仕様や公式サイトの情報は 「一次情報」 であると言えます(「一次情報」というのは、元の情報をそれ以上遡れない情報のことを言います)。 日頃から一次情報を読んで 正確な理解 を得る癖をつけましょう。これはどれだけ強調してもし過ぎることはないほど重要なことです。

ここで紹介する情報は英語であることが多いですが、日本語に翻訳されていることもあります。翻訳した内容というのは古くなっていたり、一部情報が抜けていたり、間違っていたりすることがあるため、あくまで英文を読むための参考として利用するのが理想です。

2. Web の模式図

Web に関する規格はいろいろありますが、その中でも重要な HTTP, URL(URI), HTML の関係図を載せておきます。

HTTP, URL, HTML の関係図
※ クリックすると拡大します
HTTP, URL, HTML の関係図(PHPを使った場合)
※ クリックすると拡大します

3. Web に関する入門情報

4. Web プログラミングに関連する仕様

このページに載せている情報は主に仕様書になります。たくさんありますので、すべてちゃんと覚えることは不可能に近いです。
以下の使い方でよいと思います。

  • どこに何が書いてあるか、だいたい覚えておく
  • 必要な時に必要なところを読む

1. TCP/IP

Webアプリケーションを書くだけであれば、あまり参照する機会はないかもしれません。

2. DNS

参考

3. URL

4. HTTP

HTTP/1.0 の仕様

HTTP/1.1 の仕様

HTTP/1.1 の最新バージョン(2014年~ ) は以下がセットになっています。

HTTP/2 の仕様

HTTP の Cookie ヘッダフィールドと Set-Cookie ヘッダフィールド

関連するその他のRFC

解説サイト

5. HTML

最新の仕様

WHATWG による仕様書

W3C による仕様書

XHTML の仕様

HTML 4.01 の仕様

Web におけるエンコーディングについての仕様

HTML チェッカー

特定のウェブページの HTML が正しいかどうかをチェックするサービスです。

スタイルガイド

6. CSS

CSSに関する仕様書一覧ページ

CSS の現状について

CSS 2 (Level 2)の仕様書(最新版は 2.2)

CSS3 (Level 3) は、CSS2 (Level 2) を土台としています。まずは、CSS2 (Level 2) を学ぶことをお勧めします。

CSS 3 (Level 3)の仕様書

たくさん仕様書があります。その中から主な仕様書を以下に示します。

ブラウザの実装状況

CSS チェッカー

その他

7. JavaScript

TC39-Royalty Free Task Group

Tracking ECMAScript Proposals

ECMAScript 仕様書

今までのエディションの一覧情報

ブラウザ関連技術, Web API

参考

ブラウザの実装状況

ブラウザの実装状況

ブラウザ毎の実装状況

チュートリアルとレファレンス

スタイルガイド

コメントの書き方

JavaScriptのパッケージ(ライブラリ)管理ツール

  • npm
    • Node.js に付属している。

ちょっとしたコードを試すことができるツール

セキュリティ対策

実行環境

8. PHP

公式マニュアル

PHP は公式マニュアルサイトの情報が充実しています。

各バージョンのサポート状況

各バージョンの新機能

コーディング規約

PHP をちゃんと使うためのリファレンス

PHPのRFC (Request for Comments)

PHPのパッケージ(ライブラリ)管理ツール

  • Composer
    • パッケージ(ライブラリ)管理ツール
  • Packagist
    • Composer から利用されるPHPパッケージ(ライブラリ)のリポジトリ

ちょっとしたコードを試すことができるツール

セキュリティ対策

9. データベース

MySQL

PostgreSQL

MongoDB

redis

10. 電子メール関連

電子メールに関する処理をプログラムで行うことも多いので、関連する仕様書情報を載せておきます。

MIME

メールの書式

SMTP

POP

IMAP

11. サイトの品質などをチェックする

SSL の設定をチェックする

PageSpeed Insights by Google

testmysite by Google

モバイルサイトの読み込み速度とパフォーマンスをテストする – Google

  • 「モバイルでの使いやすさ」、「モバイルでの速度」、「デスクトップでの速度」を測定してくれる。

モバイル フレンドリー テスト by Google

モバイル フレンドリー テスト – Google Search Console

AMP テスト by Google

AMP テスト – Google Search Console

12. 全般

PWA (Progressive web app)

5. アクセシビリティ

チェックツール

6. ブラウザ

Chrome

バージョン毎の情報(実装された機能)

Blinkの開発に関する Googleグループ

  • blink-dev – Google グループ
    • Googleなどが開発するHTMLレンダリングエンジン Blink の開発用メーリングリスト(のようなもの)。
    • 特定の機能について詳しく知りたい場合には、ここを調べると良い。
    • 進捗具合によってタイトルに決まりがあったり、機能に関して決まった形式のドキュメントがあるなど、予備知識がないと探しづらい。詳しくは、Web 技術の調査方法 | blog.jxck.io を参照。

Google Developers (Tools for Web Developers)

Webサイトの最適化

全般

Performance

Opportunities

Diagnostics

Accessibility

開発に役立つ拡張機能

Firefox

新たなWeb仕様に関するMozillaの見解

開発者向け情報

Safari

メーリングリスト

7. ブラウザの動作

8. Web の学習

9. Webサーバー関連

SSL の設定

10. 利用するサーバーをチェックする

利用するサーバーに割り当てられているIPアドレスがブラックリストに載っていないかチェックする

その他

関連

Web Security

PHPのセキュリティ対策

2016.06.30
PHP

Laravel 5 でのセキュリティ対策 (PHP)

2016.06.30
Web Security

JavaScript とHTML5のセキュリティ対策

2016.06.30

スポンサードリンク



📂-プログラミング

執筆者:labo


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

WordPress

WordPressのソースコード。HTMLにPHPを埋め込むスタイル。

WordPress本体のPHPソースコードや、テーマに含まれているPHPのソースコードを見ると、やたらと PHPの開始タグ(<?php)と終了タグ(?>)が埋め込まれています。 例えば、こ …

Firebase

Firebase を利用する手順

Firebase を利用する手順について説明しています。

Webサーバーの知識

分かりやすかった資料(外部サイト) 知っているようで知らないWebサーバアーキテクチャ // Speaker Deck

web development

Web Development for Beginners を読む:レッスン2

目次1. はじめに2. Lesson 2: Introduction to GitHubIntroductionCode managementWorking on projects with othe …

webpack 3 を使ったウェブページ開発手順

webpack 3 を使って、簡単なウェブページを開発する手順を紹介します。あくまで一つの例です。 1つ1つ細かい説明はできていませんが、「だいたいこんなふうにして作ることができますよ」ということが伝 …