home wiki.fukuchiharuki.me
Menu

#contents

* 目標 [#l735f684]

実際にWebアプリケーションを書いてみるのが一番早い。

+ Webに関係する基本的なソフトウェア構成を知る
+ Webアプリケーションの仕組みを理解する
+ Web周辺のテクニカルな要素を知る

** Webに関係する基本的なソフトウェア構成を知る [#m80e0c9d]
- '''Webサーバ、APサーバ、DBサーバ'''

Webに関係するソフトウェアとしてWebサーバ、APサーバ、DBサーバがあることを知る。Webアプリケーションとしてコラボレートするそれぞれのソフトウェアの役割を理解する。

** Webアプリケーションの仕組みを理解する [#tef55ee9]
- '''ステートレスな応答: リクエスト、レスポンス'''

リクエストとレスポンスからなるステートレスな応答シーケンスを理解する。その中でデータベース操作のトランザクションが閉じることを知る。

** Web周辺のテクニカルな要素を知る [#c43c7917]
- '''パラメータ、セッション、HTML/JavaScript'''

パラメータによって擬似的なステートを実現できることを実験する。セッションによってステートフルに画面遷移できることを実験する。フォームを使ったパラメータの送信とJavaScriptによる(少し)リッチクライアントを実装する。

* 課題 [#rfb70fc8]

逐次課題を実施することで上記目標の達成を目指す。

** 環境構築 [#kee3ce1f]

*** XAMPPインストール [#s7c82261]

|~事前条件|Windows端末の環境が整っていること。|
|~課題内容|PHPとMySQLが動作する環境を作成する。下記のサイトからインストーラXAMPP for Windowsをダウンロードして実行する。何をインストールしてるかを(調べるなどして)知っておくこと。|
|~課題内容|PHPとMySQLが動作する環境を作成する。&br;下記のサイトからインストーラXAMPP for Windowsをダウンロードして実行する。&br;何をインストールしてるかを(調べるなどして)知っておくこと。|
|~事後条件|ApacheとMySQLをサービスとして登録していること。|

- 参考サイト
-- [[XAMPP Installers and Downloads for Apache Friends>https://www.apachefriends.org/jp/index.html]]
-- [[XAMPPの使い方>http://www.adminweb.jp/xampp/]]

*** 疎通確認: Webサーバ [#k370d347]

|~事前条件|XAMPPをインストール済みであること。|
|~課題内容|apacheが正常に動作していることを確認する。apacheの公開ディレクトリにindex.htmlを保存する。ブラウザからindex.htmlにアクセスして表示を確認する。ファイルの内容は以下のようにする。|
|~課題内容|apacheが正常に動作していることを確認する。&br;apacheの公開ディレクトリにindex.htmlを保存する。&br;ブラウザからindex.htmlにアクセスして表示を確認する。&br;ファイルの内容は以下のようにする。|
|~事後条件|ブラウザにindex.htmlの内容を表示していること。|

- index.html
 Hello HTML

*** 疎通確認: APサーバ(PHP) [#t2b4d9a3]

|~事前条件|XAMPPをインストール済みであること。|
|~課題内容|apacheが正常に動作していることを確認する。apacheの公開ディレクトリにindex.phpを保存する。ブラウザからindex.phpにアクセスして表示を確認する。ファイルの内容は以下のようにする。|
|~課題内容|apacheが正常に動作していることを確認する。&br;apacheの公開ディレクトリにindex.phpを保存する。&br;ブラウザからindex.phpにアクセスして表示を確認する。&br;ファイルの内容は以下のようにする。|
|~事後条件|ブラウザにindex.phpの出力内容を表示していること。|

- index.php
 <?php
   print("Hello PHP");
 ?>

*** 疎通確認: MySQL [#s861945f]

|~事前条件|XAMPPをインストール済みであること。|
|~課題内容|MySQLが正常に動作していることを確認する。XAMPP管理ページにてMySQLアカウントrootのパスワードを設定する。ターミナル(cmd)から設定したrootのパスワードでMySQLにログインする。|
|~課題内容|MySQLが正常に動作していることを確認する。&br;XAMPP管理ページにてMySQLアカウントrootのパスワードを設定する。&br;ターミナル(cmd)から設定したrootのパスワードでMySQLにログインする。|
|~事後条件|MySQLのコマンド待ち状態を表示すること。|

** 基礎: MySQL [#i410a902]

*** rootパスワードを設定する(XAMPP管理ページにて) [#o26c4a91]

|~事前条件||
|~課題内容||
|~事後条件||

*** アカウントを作成する(XAMPP管理ページにて) [#a1330663]

|~事前条件||
|~課題内容||
|~事後条件||

*** テーブルを作成する(XAMPP管理ページにて) [#hb9d27f0]

|~事前条件||
|~課題内容||
|~事後条件||

*** DMLを書く(select, insert, update, delete) [#g8279fd9]

|~事前条件||
|~課題内容||
|~事後条件||

** 基礎: PHP [#ue5d8f7a]

*** echo, printを使って文字列を出力する [#d4d2abbf]

|~事前条件||
|~課題内容||
|~事後条件||

*** 関数を定義してコールする [#ta5f2ea8]

|~事前条件||
|~課題内容||
|~事後条件||

*** 関数を別ファイルに定義してコールする [#cf590f8b]

|~事前条件||
|~課題内容||
|~事後条件||

*** PHPからMySQLに接続する [#n249dbd8]

|~事前条件||
|~課題内容||
|~事後条件||

** 基礎: Web [#n171495c]

*** HTMLの基本構成を書く [#r2520da8]

|~事前条件||
|~課題内容||
|~事後条件||

*** アンカーを使って別のPHPページにリンクする [#gfeb8223]

|~事前条件||
|~課題内容||
|~事後条件||

*** GETパラメータを渡す [#lf73399c]

|~事前条件||
|~課題内容||
|~事後条件||

*** POSTパラメータを渡す [#mb205417]

|~事前条件||
|~課題内容||
|~事後条件||

** Webアプリケーション: データベース [#l6f5684e]

** Webアプリケーション: セッション [#t884732e]

** Webアプリケーション: リッチクライアント [#n6996fc9]