class03 introduction to web development with php mis 3501, fall 2015 brad greenwood, phd mba...

18
Class03 Introduction to Web Development with PHP MIS 3501, Fall 2015 Brad Greenwood, PhD MBA Department of MIS Fox School of Business Temple University 9/1/2015

Upload: jesse-mitchell

Post on 29-Dec-2015

216 views

Category:

Documents


1 download

TRANSCRIPT

Class03Introduction to Web Development with PHP

MIS 3501, Fall 2015Brad Greenwood, PhD MBA

Department of MISFox School of Business

Temple University9/1/2015

Housekeeping

2

Three Things1. Challenges

i. I have spoken with Professor Shafer and we realized we were out of sync

ii. From now on I request you hand in a physical copy, i.e. print off, of your challenges the day they are due

iii. This is not the case today2. Work station etiquette

i. It has been brought to our attention that not everyone is cleaning up their machines at the end of class, i.e. deleting code.

ii. This is impolite, which is badiii. This also creates a potential for cheating, which is also bad

3. Your Codei. In the strongest possible language, if another student hands in your

code, e.g. for a quiz that may or may not be held on Thursday Sept 3rd, both students will enter the judicial process

ii. “It doesn’t matter who started it” – Every Parental Figure (1935-2015)iii. We are keenly skilled at detecting these things, we even have tools to

do it for us

MySQL

•Weeks 5 & 6

HTML & CSS

•Weeks 1 & 2

PHP

•Weeks 3 & 4

PDO

•Week 7

Course Overview

3

To do: Organize your code with

MVC (week 8) Debug your code (week 9) Work with forms (week 10) Use arrays (week 11 & 12) Use sessions (week 13)

We are here!

The Internet

4

We talked about this last time, but the internet is made up of a series of computers which are exchanging information.

Imagine a restaurant…• Your computer is a client… it makes a request

of the waiter.• The language they speak is TCP/IP

• The waiter is a server… it brings back what has been requested

• Sometimes the client is not allowed to have what has been requested… the server will say no (like an angry spouse)

• If we want to stretch the metaphor to the breaking point, your plate is a web browser… it displays things in http… salad plates do ftp…

What is important to remember though, is that the internet is just computers talking to computers. And the computer that your computer is talking to, has a

file structure just like your computer (i.e. folders and files).

A request for a specific page http://www.murach.com/books/phps/index.htm

A request for the default (home) page of a website http://www.murach.com/

Requesting applications from a local web server A request for the default page in an application directory http://localhost/book_apps/ch01_product_discount/

A request for a directory with no default page http://localhost/book_apps/

Requesting pages from an Internet web server

© 2014, Mike Murach & Associates, Inc. 5

Discuss: Why are index.htm, index.html and index.php called “default pages”?

An index of the apps in the book_apps directory

© 2014, Mike Murach & Associates, Inc. 6

Discuss: Depending on the configuration of a server you may, or may not, see a folder structure like this. Why would a server administrator choose to

present things graphically vs. in a file structure?

The Product Discount application in Chrome

Just for Emphasis

© 2014, Mike Murach & Associates, Inc. 7

See? No file specified here. *But* index.html was present.

PHP… Getting Going

8

Lets chat about PHP• PHP was designed a server side scripting language (it can be used for

general purpose programming now as well)• Others Include: ASP, ASP.NET, R, Perl, JavaScript, Python, Ruby on

Rails

• As a concept• Some programs are run on your local machine

• e.g. HTML• Server side languages run on the

SERVER, which renders CUSTOMIZED results for each machine

• This is different from things likeJavaScript where the code is embedded

1. Make sure the Apache and MySQL servers are running.

2. Start a web browser and enter the URL for the application as shown in the last figure.

3. Test the page by entering both valid and invalid data, clicking on all links, and so on.

How to retest a PHP page after changes Click the Reload or Refresh button in the browser.

How to test a PHP page for the first time

© 2014, Mike Murach & Associates, Inc. 9

Watch out! Forgetting to refresh your browser is a common mistake for beginners. Also - you may encounter situations where it appears your changes are not taking effect. If that’s happening make sure that:

1. You are editing the right page2. Completely shut down and restart your browser

The source code for a PHP page

© 2014, Mike Murach & Associates, Inc. 10

Hey, where’s the php code?

Why can’t we see it here?

© 2014, Mike Murach & Associates, Inc. 11

HTTP request

HTTP response

Web Browser Web Server

HTML file

Remember where the PHP code resides?

Right-click the page, then select the ViewPage Source command.

Viewing source code is a great way to check for HTML syntax errors. HTML syntax errors will be indicated by red text.

Recall what it looks like in Net Beans when you open a tag but don’t close it

How to view the source code for a page in Chrome and Firefox

© 2014, Mike Murach & Associates, Inc. 12

But This Class is About Creation…

13

In this class we don’t want to just view code• You could code in a text editor, e.g. notepad. This would be a pain though• Instead we often code in an “Integrated Development Environment” (IDE)

IDE’s offer a few benefits• They may format code for you (aesthetic). You’ll see why this is important

later• They may have compilers and interpreters for you (which streamline the

development process)• They often has nice graphic user interfaces (GUIs), these can automatically

generate code for you• Recall your experience with the ePortfolio project in 2101

• They often integrate multiple different code bases for you

NetBeans with three files in the main project open

© 2014, Mike Murach & Associates, Inc. 14

Auto-completion and error marking in NetBeans

Auto-completion list for names that startwith $d

Error icon

Warning icons

© 2014, Mike Murach & Associates, Inc. 16

Use normal editing techniques as you enter PHP code.

When you see an auto-completion list, you can highlight an entry and press the Enter key to enter it into your code or you can double-click on it.

If you see a red error icon at the start of a line that you have entered, you should fix whatever errors the line contains before you test the application.

How to test a PHP application with NetBeans To run the current project, click on the Run Project button in the

toolbar or press F6.

To run other projects, right-click on the project and select the Run command.

To run a file, right-click on the file and select the Run command.

How to edit a PHP file with NetBeans

© 2014, Mike Murach & Associates, Inc. 17

The dialog box for starting a new project

© 2014, Mike Murach & Associates, Inc. 18

Most of the time, we will take this option when creating a new project.

© 2014, Mike Murach & Associates, Inc. 19