Utvikling av dynamiske nettsteder med PHP og databaser

Transcription

Utvikling av dynamiske nettsteder med PHP og databaser
Utvikling av dynamiske nettsteder med PHP og databaser: Introduksjon
http://bibin.hioa.no/~michaelp/Web-publisering/V14/innledning/innled...
Utvikling av dynamiske nettsteder med PHP og databaser: Introduksjon
http://bibin.hioa.no/~michaelp/Web-publisering/V14/innledning/innled...
Hva er et programmeringsspråk?
Utvikling av dynamiske nettsteder
med PHP og databaser,
våren 2014
Et forsøk på definisjon
Engelsklignende språk, med rigid syntaks, som kan brukes til å skrive instruksjoner (eksempel
nedenfor).
[Kurssidene] [ ABI - fagsider bibin ]
Instruksjonene i et programmeringsspråk kan leses og skrives av mennesker (vi forstår hva ord
som print betyr).
Introduksjon
Instruksjonene (samlet kalt programkode ) oversettes til maskinspråk (som bare
datamaskinen forstår), slik at datamaskinen kan utføre dem.
Michael Preminger (michael.preminger@hioa.no) 13/12-13
Hva er et dataprogram (litt forenklet)
en sekvens med instruksjoner skrevet i et programmeringsspråk ...
I denne forelesningen:
... oversatt (eller tolket) til maskinspråk for å utføre nyttige handlinger.
Motivasjon: Hvorfor vi lærer å programmere (og hva er et programmeringsspråk)
Eksempel 1
Om dynamiske, tjenerbaserte, interaktive nettsider
Programkode for et lite dataprogram (én instruksjon lang), skrevet i programmeringsspråket
PHP:
Noen enkle programmer, bruken av print-funksjonen
Om infrastrukturen, tjenermaskinen og andre verktøy
<?php
Arbeide med øvelsesoppgaver
print("Dette er et enkelt program");
?>
Hvorfor lærer vi å programmere?
kjør programmet
PHP er et programmeringsspråk brukt til å lage dynamiske, tjenerbaserte og interaktive
nettsider
Mye av innholdet på webben, er dynamisk, interaktivt og databasestyrt.
For å kunne forstå hvordan dynamiske nettsteder (særlig slike som benytter databaser) lages, må
vi kunne litt om programmering.
Vi skriver våre programmer i PHP-filer , som oftest med navn som fil.php
Disse filene lagrer vi på en webtjener, der hvor vi lagrer html-filer.
For å kunne lage slike nettsteder må vi kunne programmere.
En PHP-fil er, stort sett, en HTML-fil, med (potensielt) dynamisk innhold.
Noen begrep:
Viktige bregreper å diskutere, er
Hva er en dynamisk nettside?
programmeringsspråk
dynamiske nettsider
En statisk nettside ser lik ut hver gang den hentes frem
interaktive nettsider
Samme visning, uansett av hvem, hvor og når siden hentes fram.
"tjenerbasert"
Eksempel: en statisk nettside. (samme visning hver gang jeg klikker).
Idag:
En dynamisk nettside kan se annerledes ut fra gang til gang.
se på disse begrepene.
Et eksempel: en dynamisk nettside
lage de fø rste programmene , som utfø rer enkele oppgaver.
(klikker 3 til 4 ganger: forskjellig innhold fra gang til gang!)
statisk: HTML-fil, med "klokkeslettet" skrevet som tekst.
dynamisk: krever en mekanisme, som "henter" det faktiske klokkeslettet og tilrettelegger for
visning
1 of 12
13.12.2013 14:42
2 of 12
13.12.2013 14:42
Utvikling av dynamiske nettsteder med PHP og databaser: Introduksjon
http://bibin.hioa.no/~michaelp/Web-publisering/V14/innledning/innled...
Utvikling av dynamiske nettsteder med PHP og databaser: Introduksjon
Hva menes med "tjenerbasert"?
http://bibin.hioa.no/~michaelp/Web-publisering/V14/innledning/innled...
Hva med "interaktiv"?
Med PHP kan vi ta i bruk data fra brukere, ved hjelp av HTML-forms
PHP-programmer er i stand til å ta i bruk data som brukere av nettsider legger i utlagte
FORM-elementer.
Hva heter du?
Data fra FORM-elementer overføres via nettet til webtjeneren, som tilpasser nettsidens funksjon
til dataene.
PHP henter klokkeslettet på tjeneren (fritt etter Lash (2003), figur 1.2).
En tjenerbasert, dynamisk nettside tilrettelegges på tjenermaskinen
Vi bruker den dynamiske webklokken som eksempel.
Slike FORM-elementer ser vi på neste gang!
Følgende skjer når vi klikker på en lenke til en tjenerbasert dynamisk webklokke:
nettleseren sender en forespørsel til tjeneren, som finner riktig PHP-program (med URL'en til
PHP-filen)
Hva med databaser?
PHP-programmet
etterspør det øyeblikkelige klokkeslettet
Med PHP kan vi anvende databaser i våre dynamiske nettsider.
gjør klokkeslettet om til en forståelig tekststreng (for eksempel "12.02.02")
De fleste dynamiske nettsteder bruker databaser.
PHP-programmer gjør brukere istand til å
Det ferdig tilrettelagte innholdet overføres til vår nettleser over nettet.
hente spesifikke data over nettet, på forespørsel
Webtjenerprogrammet (et annet program) sender strengen med klokkeslettet over nettet til vår
nettleser, for visning.
endre data i databaser på forespørsel
Dette kommer vi strekt tilbake til.
I dette eksemplet viser vår nettleser tjenerens klokkeslett .
Hvis vår tjener er lokalisert i USA, risikerer vi å få et klokkeslett som ikke passer med vårt.
Hvor brukes PHP?
Kort svar: Mange steder.
Et fagrelevant eksempel: biblioteksystemet Reindeks.
3 of 12
13.12.2013 14:42
4 of 12
13.12.2013 14:42
Utvikling av dynamiske nettsteder med PHP og databaser: Introduksjon
http://bibin.hioa.no/~michaelp/Web-publisering/V14/innledning/innled...
Utvikling av dynamiske nettsteder med PHP og databaser: Introduksjon
http://bibin.hioa.no/~michaelp/Web-publisering/V14/innledning/innled...
Eksempel 3: Flere linjer med HTML
Generere HTML fra PHP - funksjonen print()
Her skriver vi PHP-kode som skal bli til 5 linjer med innhold.
Vi vever PHP-instruksjoner sammen med "faste" HTML-setninger
Vi bruker vanlig avsnittsstruktur: en overskrift, et avsnitt og en liste.
Eksempel 2: En XHTML fil med én linje generert med PHP
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd">
Dette eksemplet gjør lite utover genreringen av "vanlig" , fast HTML-kode.
<html>
"print" innenfor en PHP-blokk gjør at HTML-KODEN med blå bakgrunn flettes med den "faste"
HTML koden (med grå bakgrunn)
<head>
<title>Det andre eksemplet</title>
Teksten (grå HTML-kode) utenfor PHP-blokken kaller vi "maltekst" (template text).
</head>
Den sammenflettede siden sendes til nettleseren.
<body>
<?php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1
/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Et første eksempel </title>
</head>
<body>
<?php
print(" <p>Dette er mitt første PHP-program</p>");
print("<h3>Dette er en overskrift</h3>");
print( "<p>Nå følger en liste med innførsler</p>");
print("<ul>");
print(" <li>Første innførsel</li>");
print(" <li>Andre innførsel</li>");
print(" <li>Tredje innførsel </li>");
print("</ul>");
?>
</body>
?>
</body>
</html>
</html>
I nettleseren:
Slik ser resultatet ut i sidevisning:
og slik ser det ut i kildevisning.
Man kan, altså, ikke se at tekstlinjen er PHP-generert.
5 of 12
13.12.2013 14:42
6 of 12
13.12.2013 14:42
Utvikling av dynamiske nettsteder med PHP og databaser: Introduksjon
http://bibin.hioa.no/~michaelp/Web-publisering/V14/innledning/innled...
Utvikling av dynamiske nettsteder med PHP og databaser: Introduksjon
http://bibin.hioa.no/~michaelp/Web-publisering/V14/innledning/innled...
Eksempel 4: Kode med innlagte kommentarer
"echo" istedenfor "print"
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
PHP tilbyr også instruksjonen echo.
<html>
echo gjør temmelig nøyaktig samme nytten som print.
<head>
<title>Kommentarer</title>
Mange programmerere (og mange lærebøker) bruker "echo" istedenfor print .
</head>
Dette er en smaksak.
<body>
<?php
/* Dette programmet skriver noen linjer til
Kommentarer i programkoden
en nettleser. Skrevet av Michael*/
Vi skriver kommentarer i programkoden for at vi (og andre) lettere skal kunne lese våre
programmer
// Kodelinjen nedenfor skriver overskriften
print("<h3>Dette er en overskrift</h3>");
Programkoden er ikke alltid selvforklarende.
print( "<p>Nå følger en liste med innførsler</p>");
Det tar ofte tid å utvikle et program. Vi kan glemme hva vi "ville med" en kodebit (selv om den
fungerer fint).
//Kodelinjene nedenfor skriver innførslene
print("<ul>");
print(" <li>Første innførsel</li>");
Andre som overtar utviklingen av vårt program kan ha problemet med å forstå hvirdan vi tenkte.
print(" <li>Andre innførsel</li>");
Kommentarer er gode å ha! Påvirker ikke programmets funksjon. Blir ikke tolket!
print(" <li>Tredje innførsel </li>");
print("</ul>");
PHP tillater to typer kommentarer: énlinjet og flerlinjet.
?>
</body>
En linje i en PHP-blokk som begynner med to skråstreker er en kommentarlinje:
</html>
<?php
// Neste kodelinje printer en linje med tekst til nettleseren
print("<p> Denne linjen skrives til nettleseren</p>");
?>
Denne linjen skrives til nettleseren
En blokk-kommentar, mellom /* og */ kan strekke seg over flere linjer:
<?php
/* Neste kodelinje printer
en linje med tekst til nettleseren */
print("<p> Denne linjen skrives til nettleseren</p>");
?>
Sidevisningen blir ikke påvirket av kommentarer.
7 of 12
13.12.2013 14:42
8 of 12
13.12.2013 14:42
Utvikling av dynamiske nettsteder med PHP og databaser: Introduksjon
http://bibin.hioa.no/~michaelp/Web-publisering/V14/innledning/innled...
Utvikling av dynamiske nettsteder med PHP og databaser: Introduksjon
Kode for en dynamisk nettside
Tekniske detaljer
Eksempel 5: Kode for den dynamiske webklokken
Lagring av filer
http://bibin.hioa.no/~michaelp/Web-publisering/V14/innledning/innled...
Det kreves ennå ikke at dere forstår PHP-koden for den dynamiske webklokken.
Dere Må lagre alle deres filer et sted under M:\public_html (bibin-maskinen).
Men siden vi snakket en del om den idag - kan det være greit å vise den...
Filer med PHP-blokker skal ha ".php" til etternavn.
Merk linenummerne: ikke en del av koden!!
Maskinen bibin.hioa.no er webtjeneren, som kjører våre PHP-programmer og sender den
ferdig tilrettelagte nettsiden til nettleseren
Jeg kommer til å bruke linjenumre i noen av eksemplene i fremtiden.
1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org
For eksempel: M:\public_html\minfil.php :
/TR/xhtml1/DTD/xhtml12. <html>
filen er synlig gjennom http://bibin.hioa.no/~s<ditt studentnummer>/minfil.php
Den må tolkes av webtjeneren for å vises riktig!!!
3. <head>
4.
<title>Dynamisk klokke</title>
5. </head>
6. <body>
7. <p> klokka er
8.
<?php
9.
// Hent klokkslettet fra tjeneren, og plasser i en tekststreng
10.
$klokke_streng=date("g\.i\.s");
11.
12.
// Vis streng med klokkeslett i nettleservinduet
13.
print($klokke_streng);
14.
?>
15. </p>
16. </body>
17.</html>
I motsetning til (X)HTML-filer, får dere ikke
vist filer som har ".php" til etternavn ved å dobbelklikke dem i windows utforsker
vist filer med adresse som M:\public_html\minfil.php
Dere må skrive hele adressen til filen: "http://bibin.hioa.no/~s123456/minfil.php" (eller klikke på
en lenke til den)
Oppsummering
Med hjelp av programmeringsspråket PHP skal vi få vår tjenermaskin (bibin.hioa.no) til å lage
dynamisk HTML-innhold.
Instruksjonene i PHP er vevd sammen med "vanlige" HTML-koder og tekst.
De skrives i PHP-blokker innenfor disse sidene.
En PHP-blokk begynner med "<?php" og avsluttes med "?>".
Innholdet som genereres av PHP-blokker er dynamisk:
det genereres hver gang vi henter fram nettsiden, og kan være forskjellig fra gang til gang
Filen som viser 12.00.00 hele tiden heter, for eksempel, klokke_s.htm
Filen som viser et annet (og riktigere) klokkeslett heter klokke_d.php
PHP-skrevne nettsider kan også være interaktive, ved å bruke FORM-elementer
9 of 12
13.12.2013 14:42
10 of 12
13.12.2013 14:42
Utvikling av dynamiske nettsteder med PHP og databaser: Introduksjon
http://bibin.hioa.no/~michaelp/Web-publisering/V14/innledning/innled...
Utvikling av dynamiske nettsteder med PHP og databaser: Introduksjon
Om øvelser og løsning av oppgaver
Om ukens lab-øvelser:
Programmering læres gjennom beina! Man lærer ved å programmere!
Lab-ø velsene denne uken omhandler følgende:
Vi har prøvd å bygge opp lab-øvelsene gradvis, dvs. at vi starter med meget enkle oppgaver
(kanskje kjedelige?), og bygger opp til litt mer krevende oppgaver. Det vil si at:
http://bibin.hioa.no/~michaelp/Web-publisering/V14/innledning/innled...
Forståelse av infrastrukturen:
Viktig: PHP trenger en webtjener for å bli tolket
Dere må løse enkle oppgaver, bl.a. for å bli fortrolig med verktøy og infrastruktur
Plassere filer på webtjeneren: Hvor de skal plasseres og hvordan de skal vises
Dere må ta den tiden det tar å prøve og feile
Vise XHTML-avsnitt skrevet med print() på deres nettleser
Dere må balansere mellom å gi dere for fort på den ene siden, og stange hodet unødvendig
mot veggen på den andre siden.
Skriving av linjeskift og kommentarer
Denne balansegangen er individuell
Dere finner fort ut hva dere trenger
Utover det: Bruk oss (undertegnede og lab-instruktørene)
Sist oppdatert 04/01-13 av Michael Preminger, michael.preminger@hioa.no
Valgfrie oppgaver
Noen av oppgavene i oppgavetekstene er valgfrie, og er merket med (*) .
løs "ustjerna" oppgaver først
prøv de "stjerna" oppgaver etterpå (hvis dere får tid / lyst)
Vi har forsøkt å organisere det slik at de valgfrie oppgaver gir enten ekstra øvelse i obligatoriske
kunnskaper, eller, en utfordring for de ekstra interesserte.
Deltakelse på labøvelser er å ta ansvar for egen læring
Vi bruker ressurser på å gi dere mulighet til veiledet oppgaveløsning. Bruk muligheten!!
11 of 12
13.12.2013 14:42
12 of 12
13.12.2013 14:42