32

Real

Embed Size (px)

Citation preview

Page 1: Real
Page 2: Real

Real World Web App Development(in 2 hours or less)

Jason ArdellJoshua Silver

GT College of ComputingOctober 13, 2010

Page 3: Real

What do we mean,

“Real World”Web App Development?

Page 4: Real

What are we building?

(Demo)

Page 5: Real

Who are we?

Jason Ardell@ardell

[email protected] ‘05

Joshua [email protected]@securehealthpay.comCS ‘09

Page 6: Real
Page 7: Real

Our Toolkit Today

Page 8: Real

What is MVC and why use it?

Page 9: Real

http://betterexplained.com/articles/intermediate-rails-understanding-models-views-and-controllers/

Page 10: Real

Interactive

Follow along at:

http://github.com/joshuasilver/RealWorldWebApp

Page 11: Real
Page 12: Real

Connect to Server

• You should have credentials

• http://dl.dropbox.com/u/5037034/gt.txt$> ssh root@[your.ip.address]

[enter password]

Page 13: Real

Connect to MySQLOnce logged in, from Command line:

# mysql -u cakephpuser -p cakephpdbEnter password: << PASSWORD IS: foo

Welcome to the MySQL monitor. Commands end with ; or \g.

Your MySQL connection id is 183Server version: 5.1.41-3ubuntu12.6-log (Ubuntu)

Type 'help;' or '\h' for help. Type '\c' to clear the current input statement.

mysql>

Page 14: Real

Setup DB

(Be sure to use spaces, not tabs)

cd /var/www/cakephpnano db_schema.sql

Page 15: Real

mysql> source db_schema.sql

mysql> show tables;+---------------------+| Tables_in_cakephpdb |+---------------------+| students |+---------------------+1 row in set (0.00 sec)

mysql> describe students;+--------------+------------------+------+-----+-------------------+----------------+| Field | Type | Null | Key | Default | Extra |+--------------+------------------+------+-----+-------------------+----------------+| id | int(10) unsigned | NO | PRI | NULL | auto_increment || first_name | varchar(50) | NO | | NULL | || last_name | varchar(50) | NO | | NULL | || phone_number | char(12) | NO | | NULL | || time_created | timestamp | NO | | CURRENT_TIMESTAMP | |+--------------+------------------+------+-----+-------------------+----------------+5 rows in set (0.01 sec)

Make sure it worked

Page 16: Real

Insert Fake Data

(Be sure to use spaces, not tabs)

cd /var/www/cakephpnano db_testdata.sql

Page 17: Real

Make sure it workedmysql> source db_testdata.sql

mysql> select * from students;+----+------------+-----------+--------------+---------------------+| id | first_name | last_name | phone_number | time_created |+----+------------+-----------+--------------+---------------------+| 1 | John | Doe | 678-555-0000 | 2010-10-13 16:08:22 || 2 | Sally | Smith | 770-555-1234 | 2010-10-13 16:08:23 |+----+------------+-----------+--------------+---------------------+2 rows in set (0.00 sec)

Page 18: Real

Done with MySQL

Over to CakePHP … its already installed

cd /var/www/cakephp

Page 19: Real

Tour of CakePHP

All we care about is:

/app/models//app/views//app/controllers/

Page 20: Real

A few notes

• For automagic to work, you must name your files exactly to the spec. (case and spacing sensitive)

Page 21: Real

Create a student model# nano /var/www/cakephp/app/models/student.php

<?php

class Student extends AppModel { var $name = 'Student';}

// CakePHP automagically completes the rest

?>

Page 22: Real

Create a student controller# nano

/var/www/cakephp/app/controllers/students_controller.php

<?phpclass StudentsController extends AppController {

  var $name = 'Students';  function index() {

    $this->set('studentList', $this->Student->find('all'));

  }}

?>

Page 23: Real

Views

Class name

Method Names

Page 24: Real

Create student view folder# mkdir /var/www/cakephp/app/views/students

Page 25: Real

Add index view

nano /var/www/cakephp/app/views/students/index.ctp

root@gt-tutorial-jos<h1>Students</h1><table> <tr> <th>Id</th> <th>First Name</th> <th>Last Name</th> <th>Phone Number</th> <th>Created</th> </tr>

<!-- Here is where we loop through our $students array, printing out the students -->

<?php foreach ($studentList as $student): ?> <tr> <td><?php echo $student['Student']['id']; ?></td> <td><?php echo $student['Student']['first_name']; ?></td> <td><?php echo $student['Student']['last_name']; ?></td> <td><?php echo $student['Student']['phone_number']; ?></td> <td><?php echo $student['Student']['time_created']; ?></td> </tr> <?php endforeach; ?></table>

Page 26: Real

http://{ip_address}/students/index

ControllerMethod

Page 27: Real
Page 28: Real

Let’s figure out how to add a student

1.) Add new method called “add” to students_controller

2.) Make associated view3.) Add link on homepage to add a student

Page 29: Real

nano /var/www/cakephp/app/controllers/students_controller.php

<?phpclass StudentsController extends AppController {

var $name = 'Students';

function index() { $this->set('studentList', $this->Student->find('all')); }

function add() { if (!empty($this->data)) { if ($this->Student->save($this->data)) { $this->Session->setFlash('Your student has been added.'); $this->redirect(array('action' => 'index')); } } }

Page 30: Real

Add view<h1>Add Student</h1><?php echo $form->create('Student'); echo $form->input('first_name'); echo $form->input('last_name'); echo $form->input('phone_number'); echo $form->end('Add Student');?>

<?php echo $html->link("Add Student", array('controller' => 'students', 'action' => 'add')); ?>

Add link on homepage (index.ctp)

Page 31: Real
Page 32: Real

Twilio