Web 開発は非常に複雑になることがよくあります。今日は初心者向けに、英語のアルファベットの各文字ごとに 26 の概念とテクニックを紹介したいと思います。奇妙に聞こえるかもしれないので、始めましょう。
A——アヤックス
AJAX は非同期 JavaScript および XML の略で、近年使用されているすべての流暢な Web アプリケーションの背後にある主な原動力です。テクノロジーとしては、AJAX はすでに広く使用されています。 Gmail、Flickr など。WordPress 管理パネルでも見つけることができます。では、それは正確には何で、どのように機能するのでしょうか?
その核となるのは xmlhttpRequest であり、これにより、ページが完全にレンダリングされた後に、ページの他の部分と関連付けることなく、リクエストの送信と応答の受信が可能になります。これは、Web アプリケーションが操作のたびにページ全体を更新する必要がないことを意味します。これにより、非常にスムーズで動的なデスクトップ アプリのようなユーザー エクスペリエンスが提供されます。
関連書籍
生の Javascript を使用して AJAX リクエストを作成する方法
AJAX 実装の 24 のベスト プラクティス
jQueryを使用してページを更新せずにフォームを送信する
B——ブラウザ(ブラウザ)
ブラウザは、Web サイトやアプリの傑作の構造を理解するものです。最新のブラウザは、インターネット サーフィンに使用できるだけでなく、マルチタスク プラットフォームとしても機能します。たとえば、IRC、FTP、および各デバイスに情報を同期する機能を備えてインストールしました。ブラウザは貴重な開発ツールであることはすでにご存知かもしれませんが、多くの問題ももたらします。どのブラウザーでも自分の作業が完璧に見えるようにする必要があるすべての開発者は、この苦痛を理解する必要があります。
関連書籍
ブラウザをテストして作業を検証する 13 の方法
Web サイトのブラウザーをテストする 5 つの方法
9 つの最も一般的な IE のバグとその修正方法
C——CSS
CSS はフロントエンド開発における鋭い剣です。 CSS (Cascading Style Sheets の略) は、Web ページの表示方法を定義する言語です。 Web 開発の最も恐ろしい時代には、開発者はスタイル コードを HTML ソース コードに記述することがよくありました。 CSS はスタイルとコンテンツをうまく分離します。
関連書籍
覚えるべき30のCSSセレクター
初心者のための 30 の CSS ベスト プラクティス
CSS の特異性を理解する
CSS:初心者から忍者へ – 完全なビデオ シリーズ
D——ドム
DOM は Document Object Model の略で、HTML または XML ドキュメントを操作するための一般的な規則です。 DOM API は、プログラムによってドキュメントを走査および操作するための関数を提供します。 「DOM は、解析された HTML ドキュメントに対して一貫した階層構造を作成します。子要素はノードまたは DOM ノードと呼ばれます。」人々が DOM について話しているのを聞いたら、実際には DOM スクリプトについて話しています。これは、以前は JavaScript を介して DOM にアクセスして操作することを表す用語でした。これは、今日見られるほとんどの最新の Web サイトやアプリの背後にあるテクノロジーです。
関連書籍
JavaScript と DOM シリーズ: レッスン 1
JavaScript と DOM: レッスン 2
The Dom is a Mess – John Resig による講義
E——イベント
最新の Web アプリケーションは、非常にイベント駆動型です。では、イベントとは何でしょうか? Web ページ上で行うほとんどのことはイベントを形成します。リンク上にマウスを置く、ボタンをクリックする、Tab キーを押すなどはすべて有効なイベントです。イベント処理とは、イベントが発生したときに指定されたコードを実行することを指します。これは、最新の Web 開発の背後にある基本的な概念でもあり、習得する必要があります。
関連書籍
Null からの JavaScript: 第 5 章 – イベント
JavaScript イベントをゼロから構築する
Null からの JavaScript: クロスブラウザー イベント バインディング
4 分でわかる JavaScript イベント委任
F——ファイアバグ
労働者が仕事をうまくやりたいなら、まず道具を研ぐ必要があります。 Web 開発者も同様です。非常に強力なツールは Firebug です。 Firebug は、作業全体にわたって機能する Firefox 拡張機能です。ページのあらゆる側面をその場で編集および監視できます。機能についてはここでは詳しく説明できないので、下のリンクをクリックしてください。
関連書籍
Firebug を使用すべき 10 の理由
Firebug を使用して CMS のテーマを設定する方法
Firebug: 白帯から黒帯まで
G - グリッド
グリッドは、ページを構造化するための視覚的なフレームワークです。グリッドはかつて発展した印刷業界から移植されたもので、現在の Web 開発には不可欠な部分です。グリッドベースのレイアウトの作成に使用できる CSS フレームワークは数多くありますが、非常に多くのページとレイアウトを扱うには集中的な練習が必要です。
関連書籍
960 CSS フレームワークの詳細
ブループリント CSS フレームワークの詳細
短期集中コース: YUI グリッド CSS
960 グリッド システムをマスターする
H——HTML
今この記事を読んでいるあなたは、そのコンセプトについて漠然としたアイデアを持っているかもしれません。このリンクにだまされた場合は、読み続けてください。ところで、rockux へようこそ。Web 開発に関する記事を多数提供しています。 HTML は Hypertext Markup Language の略称であり、Web 言語の事実上の標準です。 HTML は、タグ、タグ属性、タグ内に含まれるコンテンツなどの複数のコンポーネントまたは要素で構成されます。 HTML 標準の最新バージョンである HTML5 では、多くの新機能が提供され、いくつかの互換性の問題が解決されています。
関連書籍
「HTML5とあなた」コース
初心者のための 30 の HTML ベスト プラクティス
知っておくべき HTML5 の 28 の機能、ヒント、テクニック
初心者が使用していない 10 の HTML タグ
I - IE
ああ、インターネットエクスプローラー。その名前は畏怖と怒りを呼び起こします。これは業界全体を前進させる 4 つのエキサイティングな新機能をもたらした英雄であり、ブラウザの停滞の歴史に終止符を打ちました。今日に至るまで、フロントエンド開発者をリードしています。 10 年間の戦争を経て、IE の最終バージョンは 9 となり、正しい革新の方向に戻りました。 IE に対するあなたの態度に関係なく、IE は依然として Web 開発プロセスの避けては通れない部分です。
関連書籍
Internet Explorer が正しく理解していること
9 つの最も一般的な IE のバグとその修正方法
Internet Explorer はボックス モデルを正しく理解しましたか?
J - JavaScript
JavaScript は、Web 開発の基本的な 3 つの要素の最後のメンバーです。 Java ではなく JavaScript は、Web のスクリプト言語です。何十億もの Web ページがそれを使用しており、さらに重要なのは、その主張を裏付ける Web サイトです。動作を定義し、イベントを管理し、DOM を操作し、JavaScript を通じてサーバーと対話します。 jQuery などの優れたライブラリの使用により、JavaScript への理解と知識は年々深まっています。 JavaScript は現代のすべての Web 開発者にとって絶対に必要なものであると言うのが適切だと思います。
関連書籍
初心者のための 24 の JavaScript ベスト プラクティス
Null の JavaScript: ビデオ シリーズ
JavaScript ジャンキーとして購読しなければならない 33 人の開発者
K——キーワード最適化(キーワード最適化)
SEO は Web 開発にのみ関係しますが、それでも、Web 開発者にとって SEO とは何か、SEO で何ができるのかについての基本的な知識を持っていることが重要です。キーワードの最適化とは、Web サイトに適切なキーワードを選択し、訪問者が Web サイトを見つけられるようにそれらを最適化することを指します。 SEO の原則をすべて理解するときは、コンテンツが王様だということを覚えておいてください。 SEO は優れていてもコンテンツが貧弱な場合、ユーザーは見つけてもすぐに離れてしまう可能性があります。優れたコンテンツを持っていれば、ユーザーはあなたを見つけて滞在してくれるでしょう。
関連書籍
必要な唯一の SEO ツール
L——少ない
Less はとげのあるバラ風の言語です。彼らの Web サイトでは、LESS は変数、ミックスイン、演算子、関数などの CSS の動的動作を拡張すると説明されており、私はこのアプローチを好む傾向があります。 LESSはアナボリックステロイドのCSSです。はい、私にはその方が良いように聞こえますが、それが何を意味するか知っていますか。動的言語の特性を CSS に取り入れ、スタイル シートをより強力にし、管理しやすくします。
関連書籍
少ないものから最大限の利益を引き出す方法
LESS.jsをチェックアウトする必要があります
ベンダープレフィックスを二度と入力しないでください
M——MVC
MVC パターンとして知られるモデル ビュー コントロール パターンは、Web 開発で最もよく使用されるパターンの 1 つです。これは、メンテナンスを容易にするために Web アプリケーションの各部分を論理的なチャンクに分割するアーキテクチャ パターンです。モデルはデータを処理し、ビューはプレゼンテーションを処理し、コントローラーは 2 つの部分間のデータ フローを担当します。
最新の Web 開発フレームワークを使用する場合は、MVC を使用します。 Ruby on Rails、Code Igniter、Zend Framework はすべてこのパターンを使用します。
関連書籍
初心者向けの MVC
PHP を使用して最初の小さな MVC ボイラープレートを作成する
ゼロからの asp.net: MVC
N - ノード.JS
node.JS は Web 開発を新しい時代に導きます。これにより、非常に高速な VM (V8) エンジン上で JavaScript を実行できるようになります。この思考パターンの変化の結果はすぐには明らかではないかもしれませんが、時間が経つにつれて利点が明らかになるでしょう。
驚くべき速度と数千の同時 IO イベントを管理する機能は、世界中の JavaScript 開発者にとって大きな話題となっています。
関連書籍
Node.js を使用したサーバーサイド JavaScript の学習
Node.JS 公式サイト
O——オブジェクト
オブジェクト指向プログラミングは、その柔軟性によりプログラミング コミュニティに広く受け入れられています。 OOP を使用すると、記述するコード行が少なくなり、コードがすっきりし、保守が容易になります。しかし、オブジェクトとは正確には何でしょうか? 1、2文でわかりやすく説明するのは難しいので、以下のリンクをご覧ください。
関連書籍
初心者のためのオブジェクト指向 PHP
オブジェクト指向 JavaScript の基礎
ウィキペディアへのリンク
P——PHP
PHP は間違いなく最も人気のあるサーバーサイド言語であり、数百万、場合によっては数十億の Web ページやアプリケーションを動かしています。
Web アプリケーションを作成するためのより良い選択肢として多くの更新や議論が行われたにもかかわらず、PHP は生き残っただけでなく、繁栄してきました。 WordPress、Joomla、Drupal、MediaWiki はすべてバックエンド言語として PHP を使用します。主な理由の 1 つは、展開が簡単で、PHP をサポートするホストを比較的簡単に見つけられることです。
関連書籍
初心者向けの 30 以上の PHP ベスト プラクティス
なぜあなたはダメな PHP プログラマーなのか
9 知っておくべき PHP の便利な関数と機能
Q——クエリ
記事内のクエリはさまざまな意味を持ちます。クエリ言語は、外部システムからデータを取得するために使用されるインターフェイスです。 SQL は、リレーショナル データベースから情報を取得する良い例です。
一方、クエリ文字列は、URL の一部として Web アプリケーションに渡される部分です。このデータは、ユーザーが ID またはトランザクションを確認するためにアクセスしているページからのものである可能性があります。クエリ文字列はキーと値のペアとしてフォーマットされます。
関連書籍
CodeIgniter をゼロから作成: クエリ文字列を使用しない検索結果
WordPress の「コメント数による人気の投稿」SQL クエリ
R - 正規表現
正規表現は、指定されたパターンに従ってテキスト内の文字列を照合する柔軟な方法を提供します。これは特定の言語で書かれており、インタープリタによって解析されます。すべての現代言語は正規表現をサポートしています。
関連書籍
ダミーのための正規表現: スクリーンキャスト シリーズ
正規表現について何も知らないあなたへ: 完全ガイド
高度な正規表現のヒントとテクニック
S - ソース管理 (ソース管理)
ソース管理は、どのような側面に焦点を当てているかに関係なく、チームの開発プロセス内で一般的に行われています。どの分野のプログラマーもソース管理を使用します。しかし、それは一体何なのでしょうか?簡単に言うと、ソース管理により、開発者のチームはファイルのコレクションに取り組み、各メンバーの変更を追跡および識別できるようになります。コードの各バージョンを比較、マージ、さらには復元することもできます。
関連書籍
私たちのためのターミナル、Git、GitHub: スクリーンキャスト
Git の視覚的な紹介
Git を使用した簡単なバージョン管理
GitHub の使い方を理解する
T - TDD (テスト駆動開発)
これもすべての開発者に共通の要素です。 TDD はテスト駆動開発の略語で、コードの実行とそのコードのテスト ケースの自動化を同時に行うプロセスを指します。これにより、多くの面倒なソフトウェア テストが不要になり、開発者はより多くのテストを行うことが奨励されます。
関連書籍
テスト駆動開発の初心者ガイド
テスト駆動の JavaScript 開発の実践
QUnit を使用して JavaScript コードをテストする方法
U —— 単体テスト(単体テスト)
単体テストは、コードの小さな単位をテストしてリリース可能であることを確認する一連の TFF です。ただし、単体テストは OPP のメソッドに関連することが多く、これは通常、独立してテストできるプログラムの最小単位を意味します。
関連書籍
QUnit を使用して JavaScript コードをテストする方法
V——ヴィム
VIM は非常に極端なテキスト エディタです。 Vim は無料のオープンソースであり、無数の機能パッケージから選択できます。一方で、その学習曲線は耐え難いほど急であり、適切なリソースがなければ、長期間にわたって道に迷ってしまう可能性があります。下のリンクをクリックして、なぜ価値があるのかをご覧ください。
W - ワードプレス
WordPress は最小限のブログ システムとして始まりましたが、今では信じられないほど拡張されました。その拡張性により、CMS から電子商取引システムまであらゆるものに使用できます。また、開発者やデザイナーを含む多くの愛好家やフォロワーがおり、将来の Web サイトで信頼できるプラットフォームにしたいと考えています。
関連書籍
WordPress テーマを一から作成する方法
すべての WordPress インストールに必須のプラグイン
高トラフィックに合わせた WordPress のスケーリング
トップ 50 の WordPress チュートリアル
8つの優れたWordPress SEOプラグイン
X——XSS
XSS はクロスサイト スクリプティングの略です。これは、Web サイトを作成するときに尋ねられる可能性のある多くのセキュリティに関する質問の 1 つです。 XSS とは、脆弱な Web サイトまたはプログラムに悪意のあるスクリプトをロードして、特権を昇格したり、機密情報を取得したりする行為を指します (多くの場合その両方)。
関連書籍
自分のサイトをハッキングできますか? セキュリティに関する重要な考慮事項をいくつか見てみましょう
ゼロからの CodeIgniter: セキュリティ
安全な PHP アプリケーションを作成するための 5 つの役立つヒント
Y——ゆい
Yahoo ユーザー インターフェイス ライブラリは、インタラクティブな Web サイトの作成プロセスを簡素化する JavaScript ライブラリです。最新のライブラリと同様に、DOM 操作とすぐに使用できる AJAX を提供します。 YUI は jQuery ほど有名ではありませんが、依然として非常に多くのユーザー ベースを抱えており、活発に開発されています。
関連書籍
YUIの紹介
2010 ゆいシアターのレンズを通して
Z——Zインデックス
Z-Index は、ページ上で要素がどのように積み重ねられるかを定義する CSS プロパティです。これは、要素がビューポートの上部にどれだけ近いかを定義します。大きな値は、小さな値の要素の上に表示されることを示します。このプロパティは比較的専門的ですが、ウィジェットやより複雑な Web デザインを作成するときにすぐに機能します。