Embed Size (px)
Citation preview
Intro to Web Intro to Web ProgrammingProgramming
Presented by Blaine HiltonPresented by Blaine Hilton
AgendaAgenda
Hand out PacketsHand out Packets Rules, Expectations, and other Required Rules, Expectations, and other Required
StuffStuff Introductions – Why are you here?Introductions – Why are you here? Introduction to LAMPIntroduction to LAMP Software IntroductionSoftware Introduction
Rules and suchRules and such
Come to classCome to class Be here on timeBe here on time Turn any noise maker offTurn any noise maker off Pay for the class, if you haven’t alreadyPay for the class, if you haven’t already Don’t cheatDon’t cheat Ask questionsAsk questions
Ask QuestionsAsk Questions
We only have 8 sessionsWe only have 8 sessions Each session is 3 hoursEach session is 3 hours I’m going to make a very wide array of I’m going to make a very wide array of
informationinformation If you don’t understand something, its If you don’t understand something, its
going to get worst, not bettergoing to get worst, not better If I’m not asked anything I’m going to If I’m not asked anything I’m going to
assume I should move through the assume I should move through the material fastermaterial faster
The bookThe book
PHP and MySQL Web DevelopmentPHP and MySQL Web Development ISBN: 0-672-32672-8ISBN: 0-672-32672-8 946 pages946 pages Equals 135 pages to read per weekEquals 135 pages to read per week Get it, its worth it, you will use it after the Get it, its worth it, you will use it after the
classclass
LAMP Application StackLAMP Application Stack
LinuxLinux ApacheApache MySQLMySQL PHPPHP
WAMP ComparisonWAMP Comparison
Development WorkflowDevelopment Workflow
Edit files locallyEdit files locally Publish to serverPublish to server Setup databaseSetup database TestTest DebugDebug
File Transfer MethodsFile Transfer Methods
FTPFTP SFTPSFTP SCPSCP SubversionSubversion
Introduction to the LabIntroduction to the Lab
Our software is installed in the middle rowOur software is installed in the middle row Anything you save on the lab computer will Anything you save on the lab computer will
be erased at the end of class.be erased at the end of class. All files must be saved to your flash drive, All files must be saved to your flash drive,
it is highly recommended to backup your it is highly recommended to backup your flash drive to another drive and/or your flash drive to another drive and/or your home computer oftenhome computer often
Software IntroductionSoftware Introduction
PuTTYPuTTY SubversionSubversion Tortoise SVNTortoise SVN Programmers NotepadProgrammers Notepad WinSCPWinSCP phpMyAdminphpMyAdmin
Our Web ServerOur Web Server
www.web-design-class.comwww.web-design-class.com www.web-design-class.com/phpMyAdminwww.web-design-class.com/phpMyAdmin firstinitiallastname.web-design-class.comfirstinitiallastname.web-design-class.com
Hello WorldHello World
<html><html> <head><title>Hello World!</title></head><head><title>Hello World!</title></head> <body><body> <h1>Hello World</h1><h1>Hello World</h1> </body></body> </html></html>
Save and uploadSave and upload
Make a folder on your flash driveMake a folder on your flash drive Save as “index.php”Save as “index.php” Subversion uploadSubversion upload WinSCP TransferWinSCP Transfer
HTML Tags to KnowHTML Tags to Know <table><table> <tr><tr> <td><td> <hr /><hr /> <h1>-<h6><h1>-<h6> <p><p> <br /><br /> <pre><pre> <form><form> <a href=“address”>Text</a><a href=“address”>Text</a> <img src=“image.jpg” alt=“description” width=“” height=“”><img src=“image.jpg” alt=“description” width=“” height=“”>
Table ExampleTable Example <table border=“1”><table border=“1”> <tr><tr>
<th>#</th><th>#</th> <th>Name</th><th>Name</th>
</tr></tr> <tr><tr>
<td>1</td><td>1</td> <td>Blaine</td><td>Blaine</td>
</tr></tr> <tr><tr>
<td>2</td><td>2</td> <td>Rick</td><td>Rick</td>
</tr></tr> </table></table>
Form ElementsForm Elements
Text BoxText Box Text AreaText Area SelectSelect Select MultipleSelect Multiple RadioRadio CheckboxCheckbox SubmitSubmit HiddenHidden
Form Elements in HTMLForm Elements in HTML
<input type=“text” name=“name” value=“” /><input type=“text” name=“name” value=“” />
<textarea name=“name" cols=40 rows=8><textarea name=“name" cols=40 rows=8> </textarea name> </textarea name>
<select name=“name”<select name=“name” <option value=“value”>Display</option><option value=“value”>Display</option> </select></select>
<select multiple name=“name" size=“4”><select multiple name=“name" size=“4”> <option value=“value”>Display</option><option value=“value”>Display</option> </select> </select>
Form Elements in HTMLForm Elements in HTML
<input type="radio" name=“color" value=“Red“ /> <input type="radio" name=“color" value=“Red“ /> <input type="radio" name=“color" value=“Yellow” /> <input type="radio" name=“color" value=“Yellow” />
<input type=“checkbox" name=“color" value=“Red“ /> <input type=“checkbox" name=“color" value=“Red“ /> <input type=“checkbox" name=“color" value=“Yellow” /><input type=“checkbox" name=“color" value=“Yellow” />
<input type=“submit” name=“name” value=“Click” /><input type=“submit” name=“name” value=“Click” />
<input type=“hidden” name=“name” value=“value” /><input type=“hidden” name=“name” value=“value” />
HTML NotesHTML Notes
To be well formed HTML needs to follow To be well formed HTML needs to follow some rules:some rules: All tags are always lower caseAll tags are always lower case All tags must be closedAll tags must be closed
Form ExampleForm Example
Start with Hello WorldStart with Hello World
Database IntroductionDatabase Introduction
Key TermsKey Terms DatabaseDatabase TableTable Fields/ColumnsFields/Columns RelationshipsRelationships KeysKeys
Field TypesField Types
INTINT FLOATFLOAT VARCHARVARCHAR
TEXTTEXT TINYINTTINYINT
Database KeysDatabase Keys
Primary KeyPrimary Key Unique KeyUnique Key FullTextFullText
Database Communication - SQLDatabase Communication - SQL
INSERTINSERT SELECTSELECT UPDATEUPDATE
PHP IntroductionPHP Introduction
<?php echo ‘Hello World’ ; ?><?php echo ‘Hello World’ ; ?>
Note:Note: OpeningOpening ClosingClosing Semi ColonSemi Colon
VariablesVariables
<?php<?php $university$university = ‘Purdue’ ;= ‘Purdue’ ; echo “$university” ;echo “$university” ; ?>?>
Note:Note: Variable name starts with $Variable name starts with $ Colon ends each lineColon ends each line Multiple lines can be within one opening/closing blockMultiple lines can be within one opening/closing block
Combining StringsCombining Strings <?php<?php $fname$fname = ‘Blaine’ ;= ‘Blaine’ ; $lname$lname = ‘Hilton’ ;= ‘Hilton’ ; $university$university = ‘Purdue’ ;= ‘Purdue’ ; echo ‘My name is ‘.”$fname”.’ and I attend ‘.”$university”’.’ ;echo ‘My name is ‘.”$fname”.’ and I attend ‘.”$university”’.’ ; ?>?>
Note:Note: Again, anytime you open/start you must close/endAgain, anytime you open/start you must close/end Single quotes are for non-changing informationSingle quotes are for non-changing information Double quotes are for information that can change (variabiles, ect…)Double quotes are for information that can change (variabiles, ect…) You can usually always use double quotes, but it makes the page load longer You can usually always use double quotes, but it makes the page load longer
(more to think about)(more to think about)
First ApplicationFirst Application
Goal:Goal: Have students register their likes and dislikes.Have students register their likes and dislikes.
What we need:What we need: First NameFirst Name Last NameLast Name Favorite ColorFavorite Color
What else?What else?
