GINPRO / SQLの窓と銀プログラマ

WEBアプリケーションはサーバ側の処理を PHP とすると、クライアント側の処理はととで構成され、クライアント側は Google Chrome で表示される事を前提として授業を行っています。クライアント側の情報は、Google Chrome のツールという機能によって容易に参照が可能ですが、機能は多岐に渡り複雑ですが、開発には欠かせない重要な機能です。

開始方法は、キーを使うか、ページ上で右クリックしてを選択しますが、表示位置は種類を選択可能で、目的によって下部か右側を選択すると良いでしょう ( このツールを表示中は、アイコンを右クリックして表示されるメニューから完全なの削除を実行できます  )。

機能毎にタブを選択するようになっていますが、主に使うのはとととの4つです。但しこれ以外にも、設定画面で JavaScriptのを設定可能なので覚えておいてください。

タブの一番最初にあるエリアでは、冒頭で説明した３種類の内容が表示されていますが、リアルタイムでが可能です。また、それはすぐにページ上の表示に反映されます。さらに、CTRL + SHIFT + キーによって切り替えられる機能でという意味の矢印のアイコンがタブの一番左にあります。これによってページ上のコンテンツをマウスで選択して対応するとの記述を知る事ができます ( タブの順序はデフォルトの位置であり、ドラッグで変更できます )。

このエリア(1つ目)の右横(2つ目)に重要なタブが存在しますが、一番左のエリア(1つ目)を表示中キーでエリア下部に表示する事ができます。このエリアは、前者(1つ目)が表示中のページの状態を表示しているのに対して、ページ内のが実行した console コマンドの結果が表示されています。また、ここからリアルタイムに処理を実行可能なので、jQuery を使った処理の記述の練習が可能です ( それ以外にもページ内の特殊なエラーが多数表示される場合もあります ) 。処理の記述は、 + 改行で、複数行のエリアを確保して矢印キーで移動しながら式を完成させてから改行キーで実行可能です。

3つ目に重要なエリア( タブ )では、ブラウザとサーバの内容を確認する事ができます。ページから何らかの操作を行い、ここに何も表示されない場合はブラウザ側のみで処理が行われています。ブラウザからサーバに情報が到達した場合は、サーバからブラウザに必ず情報が返って来ます。ブラウザからの情報はと呼ばれ、サーバからの情報はと呼ばれています。サーバからの情報で、と呼ばれる部分にはブラウザへの指示が書き込まれていますが、このツールでしか詳細を見る事ができません。しかし、残りの部分は全て画面の構成データです。

最後のエリアでは、PC 側でのいろいろな保存データを見る事ができます。この中でWEBアプリで重要なものは二つあり、とです。後者は古くから存在するサーバ側のデータを保存する為のエリアですが、前者はPC の使用者固有のデータを保存するのに用いられます。

これら以外にもという重要なエリアがあり、そこでは機能が実装されています。しかし、通常の WEBアプリケーション程度であれば console コマンドを使用して処理内容を確認したほうが容易でかつ解りやすいでしょう ( 但しここには {} アイコンをクリックして実行される機能があるのでうまく利用しましょう)。