2018-11-04

増田プログラマー養成講座 その18 SQLデータの追加と取得

前回は、Webアプリの骨組み(スケルトン)までを作って、製作過程を見てみました。

今回は、データベースCRUD操作を行なって、チャットメッセージを追加/取得/変更/削除する機能実装してみましょう。

 

Visual Studio Codeの準備

Webアプリを作るときに、「Visual Studio Code」というIDE統合開発環境)を使ってみましょう。PHP用の各種プラグイン(「PHP IntelliSense」「PHP Debug」など)を入れておけば、便利に使える。

 

メッセージの追加

  1. ViewHTMLのFormタグを使って、メッセージ入力送信できるようにする。
  2. Controller:Viewから送信したデータを受け取れるようにする。
  3. Model:Controllerが受け取ったデータデータベースに保存する。

という機能実装してみよう。

 

Viewの改造

ファイルの内容を以下のように編集する。

<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>

<!DOCTYPE html>

<html>

 <head>

  <meta charset="utf-8">

  <title>増田チャット</title>

  <base href="<?php echo base_url(); ?>">

 </head>

 <body>

  <h1>増田チャット</h1>

  <h2>新規投稿</h2>

  <form action="welcome/index" method="post" accept-charset="utf-8">

   <label>メッセージ</label>

   <input type="text" name="message">

   <input type="hidden" name="action" value="add">

   <button>投稿する</button>

  </form>

 </body>

</html>

 

Viewの改造の解説

本当はセキュリティーを考慮して、入力値の検査バリデーション)とか、もっといろいろな仕込みが必要だが、ここでは練習なので省略します。

 

Controllerの改造

 

ファイルの内容を以下のように編集する。

<?php

defined('BASEPATH') or exit('No direct script access allowed');

 

class Welcome extends CI_Controller

{

 public function __construct()

 {

  parent::__construct();

  $this->load->model('chat_model');

  $this->load->helper('url');

  $this->output->enable_profiler(true); // for debug

 }

 

 // 初期画面

 public function index()

 {

  $action = $this->input->post('action');

  if ($action == 'add') {

   $message = $this->input->post('message');

   $this->chat_model->create_message($message);

  }

  $this->load->view('welcome_index');

 }

 

 // 更新画面

 public function update()

 {

  $this->load->view('chat_update');

 }

 

 // 削除画面

 public function delete()

 {

  $this->load->view('chat_delete');

 }

}

 

Controllerの改造の解説

 

Modelの改造

ここでやっとSQL文の登場だ!!!

SQL説明たかったのに(SQLとは本質的関係がない)Webアプリ説明が延々と続いた。(説明方法を変えた方がいいねw)

データベースデータを保存(追加)するSQLコマンド「INSERT」を使ってみよう!

 

ファイルの内容を以下のように編集する。

<?php

defined('BASEPATH') or exit('No direct script access allowed');

 

class Chat_model extends CI_Model

{

 public function __construct()

 {

  parent::__construct();

  $this->load->database();

 }

 

 // Create

 public function create_message($message = '')

 {

  $sql = "INSERT INTO talk SET create_at = ? , message = ?";

  $param = array(date('Y-m-d H:i:s'), $message);

  $this->db->query($sql, $param);

  return $this->db->insert_id();

 }

}

 

Modelの改造の解説

 

以上、メッセージの追加を実現するために、MVCの各パーツを用意した。これでメッセージの追加だけができるようになった。

これだけではメッセージの取得=表示がまだできないので、次はデータベースからメッセージデータを取得して、Webページに表示できるように改造しよう。

 

メッセージの取得

SQLの「SELECT」を使えば、データベースからデータを取り出せる。

メッセージデータを取り出して、Webページの表示で使おう。

 

Modelの改造

ファイルの内容を以下のように編集する。

<?php

defined('BASEPATH') or exit('No direct script access allowed');

 

class Chat_model extends CI_Model

{

 public function __construct()

 {

  parent::__construct();

  $this->load->database();

 }

 

 // Create

 public function create_message($message = '')

 {

  $sql = "INSERT INTO talk SET create_at = ? , message = ?";

  $param = array(date('Y-m-d H:i:s'), $message);

  $this->db->query($sql, $param);

  return $this->db->insert_id();

 }

 

 // Read All

 public function read_message()

 {

  $sql = "SELECT * FROM talk";

  $query = $this->db->query($sql);

  return $query->result_array();

 }

}

 

Modelの改造の解説

 

これでデータベースからデータを取り出すSQLメソッドモデルに用意できた。

 

Controllerの改造

 

ファイルの内容を以下のように編集する。

<?php

defined('BASEPATH') or exit('No direct script access allowed');

 

class Welcome extends CI_Controller

{

 public function __construct()

 {

  parent::__construct();

  $this->load->model('chat_model');

  $this->load->helper('url');

  // $this->output->enable_profiler(true); // for debug

 }

 

 // 初期画面

 public function index()

 {

  $action = $this->input->post('action');

  if ($action == 'add') {

   $message = $this->input->post('message');

   $this->chat_model->create_message($message);

  }

  $data['talk'] = $this->chat_model->read_message();

  $this->load->view('welcome_index', $data);

 }

 

 // 更新画面

 public function update()

 {

  $this->load->view('chat_update');

 }

 

 // 削除画面

 public function delete()

 {

  $this->load->view('chat_delete');

 }

}

 

Controllerの改造の解説

これは全部CodeIgniterで用意されている機能なので、マニュアルを読めば使い方が分かるようになってます

 

Viewの改造

ファイルの内容を以下のように編集する。

<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>

<!DOCTYPE html>

<html>

 <head>

  <meta charset="utf-8">

  <title>増田チャット</title>

  <base href="<?php echo base_url(); ?>">

 </head>

 <body>

  <h1>増田チャット</h1>

  <h2>新規投稿</h2>

  <form action="welcome/index" method="post" accept-charset="utf-8">

   <label>メッセージ</label>

   <input type="text" name="message">

   <input type="hidden" name="action" value="add">

   <button>投稿する</button>

  </form>

  <h2>投稿一覧</h2>

  <table border="1" cellpadding="5" cellspacing="0" bordercolor="#CCCCFF">

   <tr>

    <th>No.</th>

    <th>投稿日時</th>

    <th>メッセージ</th>

    <th>編集</th>

    <th>削除</th>

   </tr>

   <?php if(isset($talk)): ?>

   <?php foreach($talk as $item): ?>

   <tr>

    <td><?php echo $item['id']; ?></td>

    <td><?php echo $item['create_at']; ?></td>

    <td><?php echo $item['message']; ?></td>

    <td><a href="welcome/update/<?php echo $item['id']; ?>">編集</a></td>

    <td><a href="welcome/delete/<?php echo $item['id']; ?>">削除</a></td>

   </tr>

   <?php endforeach; ?>

   <?php endif; ?>

  </table>

 </body>

</html>

 

Viewの改造の解説

 

説明文が300行を超えてしまった!これ以上は増田で表示できない。)次回はメッセージの変更をやってみよう。

 


anond:20181104161900 増田プログラマー養成講座 その17 Webアプリの骨組み

anond:20181104233013 増田プログラマー養成講座 その18 SQLデータの追加と取得 ←★今ここ★

anond:20181110120715 増田プログラマー養成講座 その19 SQLデータ更新

anond:20181024214737 増田プログラマー養成講座 コンテンツ一覧

記事への反応 -
  • anond:20181104233013

    #GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOST#GOODPOS...

  • 増田式プログラマー養成講座 その17 Webアプリの骨組み

    前回は、Webアプリの完成見本を先に見てみました。 今回は、Webアプリを作る途中の過程を見て、作る雰囲気を一緒に味わってみましょう。   フレームワークの使用ルール=「設定より...

  • 増田式プログラマー養成講座 コンテンツ一覧

    コンテンツが増えてきたので、一覧ページを用意します。   第1章 準備 anond:20181016015826 増田式プログラマー養成講座 その1 パソコンの用意 anond:20181016164341 増田式プログラマー...

    • anond:20181024214737

      ブクマありがとうございます。ちょっとバズってたみたいでビックリしました! 増田式プログラマー養成講座 コンテンツ一覧 http://b.hatena.ne.jp/entry/s/anond.hatelabo.jp/20181024214737   アク...

    • anond:20181024214737

      臨時のJava入門講座 この講座を書くきっかけとなった増田(未経験からのプログラマーなんだが全然分からない 2018-10-15)を改めて読んでみると、 10月からプログラミングを始めた。 ...

    • 関数型プログラミングの教材は何を使ってますか?

      プログラマーの増田は、新人(初心者)に関数型プログラミングを教えるとき、教材(言語、書籍、ツールなど)には何を使ってますか? まずは「Lisp」か「Scheme」を使ってみる。Scheme...

      • anond:20181101234844

        C#、Javaなど、実際に業務に使う言語でラムダ式使わせとけば十分だろ

        • anond:20181101235458

          そうだな。 新人にはラムダ式の書式でも教えておけば十分だな? (関数型と論理型の説明は有料コンテンツでやろうw)

          • anond:20181102002040

            ワイ関数オタク、Calculus of Inductive Constructionsの勉強をしようとするも英語が苦手で挫折 日本語の資料ないんか・・・?有料でいいから・・・

    • anond:20181024214737

      始点が初心者なのはツリーの応答とかで分かったけれど、終点はどこなんだろう?

  • 増田式プログラマー養成講座 その19 SQLでデータの更新

    前回は、Webアプリの骨組み(スケルトン)に、SQLでデータの追加と取得をやりました。 今回は、SQLでデータの更新をやりましょう。   メッセージの更新 SQLの「UPDATE」を使えば、デー...

    • anond:20181110120715

      あのさ、こういうプログラムって3分ぐらい頑張ればなんでもできるようにならないの?

      • anond:20181110121013

        ならないね。でも外野から見て何でそんなめんどくさいこと悩まないといけないのかわかりにくいのも事実。

        • anond:20181110121318

          プログラミングは、数学と同じで扱うアルゴリズム(解法)次第で難易度が変わる。 それ以外は「難しいんじゃなくて面倒なだけ」 イメージとしては、単純な足し算や掛け算を100回...

      • anond:20181110121013

        ドットインストールの説明動画は3分程度で区切られてるね。 余計なことを省いて、本質だけ=1回に1項目だけに絞れば、3分を1単位にして説明できると思う。 ありがとう。参考に...

  • 増田式プログラマー養成講座 その20 SQLでデータの削除

    前回は、SQLでデータの更新をやりましょう。 今回は、SQLでデータの削除をやりましょう。   メッセージの削除 データの更新はSQLの「UPDATE」を使いました。 データの削除はSQLの「DELET...

    • anond:20181110182445

      正直、SQLの説明は失敗だった。ごめんねw SQLの説明じゃなくて、MVCフレームワークの使い方の説明の方が長くなって、自分でも見にくいと思った。   やり直すなら、まずはフレームワ...

      • 分かりやすい教材で選ぶならJavaScriptもあり?

        増田のアドバイスで、初心者には「JavaScript」が推奨されてた。 https://jgthms.com/javascript-in-14-minutes/ JavaScriptはプロトタイプの説明を後回しにすれば分かりやすいかも?

        • anond:20181110192400

          プロトタイプが肝だろ、と思うが、下手に難しく書くよりは、初心者は素直にダラダラ書いた方がまだ読める というか、自分でも頭が未だに混乱することがある Schemeからやってきたくせ...

  • 増田式プログラマー養成講座 その21 データベース設計 (1)要件定義

    前回まで、データベースを使ったWebアプリを作成して、SQLの使い方を学びました。 今回から、データベースの設計について学んでみよう。   参考書 anond:20181026145516 増田式プログラ...

  • 増田式プログラマー養成講座 その22 データベース設計 概念→物理

    前回は、DB設計の(1)要件定義を学びました。 今回は、DB設計の(2)概念設計、(3)論理設計、(4)物理設計を見てみましょう。   DB設計の流れ 要件定義 概念設計 論理設計 物理設計   ...

    • 1ヶ月でJavaをマスターする学習カリキュラム

      どうやったらプログラミング未経験者を1ヶ月で一人前のJavaプログラマーにできるだろうか?   基礎 JavaでOOP デザインパターン テスト IDE(IntelliJ IDEA等) ツール(Maven、Gradle等) ...

      • 学習用のプログラミング言語の選定基準

        型について考えてみる 個人的には、 最初に、動的型付けの言語を使ってみる。 次に、静的型付けの言語を使ってみる。 最後に、型推論が強力な言語を使ってみる。 という順番がい...

  • 増田式プログラマー養成講座 その23 SQLを巡る物語

    前回は、データベース設計について学びました。 今回は、その他のデータベースの話題について見てみましょう。     リレーショナル・データベースの理論 問合型言語のSQLは、「関...

記事への反応(ブックマークコメント)

アーカイブ ヘルプ
ログイン ユーザー登録
ようこそ ゲスト さん