Datakurser
Aktuell vecka: 48

Tillbaka till toppen

Veckoplanering 20TE

Basinfo

Vecka
Dag
Lektionspass Läxa
00 Ordinarie veckolektion yyy
00 Tisdagslektion yyy
00 LOV, Studiedag, etc. yyy
00 PROV yyy

Planering

Läxan ska vara klar INNAN nästa lektionspass om inget annat anges.

85 h (fredagar + tisdagar)

Webbserverprogrammering 1
Vecka
Dag
Lektionspass Läxa
33 Fredag 19/8 flyttad till tisdag v34, dvs tisdag fm nästa vecka. Dvs ingen lektion idag.

34 10.15-12.15 B45

Introduktion av webbserverprogrammering 1

Planering, material, portfolio-miniramverk 1 2, slutproj (Henry, Adam H, Michaela, Linda, Oliver Li, Paul)
Grunder
Demon (1-7)

Övningar Grunder

Onlinesida att testa php-sidor, w3schools "Try it"-exempelmiljö.
Eller "write php online"-sandbox

Teori extra:
w3schools.com/php Det mesta under PHP Tutorial (EJ functions, superglobals)

13.15-16.15

Funktioner

olika funktioner och hur de kan användas
variabler: lokala-globala-superglobala

Funktioner
Variabler: lokala-globala-superglobala
Demon (21-24)

Installera Laragon

Starta Laragon, var/hur köra php-filer
Felhanteringkod alltid med i php-filen

Övningar Funktioner

Teori:
w3schools.com/php Under PHP Tutorial: functions, superglobals


Övning Grunder: Göra klart MINST
uppgift 1-5
(C:även 6-7)

Övning Funktioner:
Göra klart MINST
uppgift 1-6
(C:även 7-9)

Läsa igenom teorin
34 Formulär

Formulär, skicka data mellan webbsidor
(Skicka mejl från PHP)
Demon (resten)

Övningar Formulär

Teori:
w3schools.com/php Under PHP Forms: Handling, Validation
Formulär
Göra klart MINST
uppgift 1-8


Läsa igenom teorin
35 Inkludera andra filer i en fil

Inkludera filer

Övning Inkludera filer

================================
Ramverk-mini

Ramverk mini

Dagens övning är att bygga upp ramverket, stoppa in dina övningar, länka upp dom och se till att allt fungerar.

Nästa steg är att ladda upp allt på en webbserver kopplad till internet.

Du använder såklart ditt labbserver-konto.


Moment 1 (E)- Hantering av ramverk och grundläggande webbsidor
På ditt konto på labbservern ligger en snygg prydlig startsida där man ser ditt namn, från den sidan kan man komma till alla 3 webbutvecklingskurserna.
När man går till webbserverprogrammering1-sidan kommer man antingen direkt till ramverket eller till en välkomstsida med en länk till ramverket. Startsidan på ditt ramverk visar ditt namn och en bild på dig.
Dina övningar ska läggas in i "excersise"-mappen och länkas upp på "övningar"-sidan. Så här långt räcker det med formulär och stränghanteringsövningarna.
Checkar av detta fredag vecka 37
Se till att allt är klart och fungerar.
36 Textsträngar
Lös övningarna med hjälp av teori-sidan och dess länkar

Göra klart MINST
uppgift 1-4
37
Tisdag

10.15-12.15 B47

Arbete med formulär
Övning Frågetest med formulär


Formulärquiz: Göra klart MINST
uppgift 1-3
(C:även 4-6)

37 Fortsättning: Arbete med formulär
Övning Frågetest med formulär
Formulärquiz: Göra klart MINST
uppgift 1-3
(C:även 4-6)
38 Cookie och session

Övningar
Övning 1-5


Sessions: Göra klart MINST
uppgift 1-5
39 Klasser

Övningar
Göra klart MINST
uppgift 1-5
40 Genomgång: static
Lite mer övning på klasser
Lös först förra veckans uppgifter, sen kör du övningen nedan

Följ instruktionerna, titta på koden, försök lösa uppgifterna, demon finns att titta på
Övning Tärning 1-5 (klasser och lite session i Övning Tärning 6-8)
Lös ALLA uppgifter.
41 Teorifrågor till teoriprovet (30min)

Datum och tid
Övningar (30min)

Gör klart övningar från Cookie o Session lektionen

1) Svara på teori-frågorna
2) Lös datum och tid uppgifterna
3) Repetera formulär och sessions
42 Tisdag

13.15-15.15 B45

Repetera Formulär och Sessions
Repetitionsuppgifter (1-8)

 
42 Databasintro:
  • Installera phpMyAdmin i Laragon, se Övrigt/Databaser
  • Skapa en databas "dbintrotest" med hjälp av phpMyAdmin (localhost/phpmyadmin/)
  • Skapa en mapp "dbintrotest" i din mapp "exercises" i ditt ramverk i Laragon
  • Skapa databasuppkopplingsfilen dbconnection.php för Laragon. Lägg den i mappen "dbintrotest". Se Övrigt/Databasuppkoppling .
  • Ta koden här, dbintrotestkod.htm, som skapar tabell/lägger in data/hämtar och skriver ut. Lägg den i samma mapp som databasuppkopplingsfilen. Spara den som dbintrotest.php .
  • Testkör!
  • Titta i phpMyAdmin på tabellerna som skapats och innehållet i tabellerna.
  • Visa Per
Lokalt klart, nu till labbservern :-)

  • Tanka ner "phpMyAdmin-5.2.0-all-languages"(packa upp, ändra namn på mappen till "phpMyAdmin" eller "phpmyadmin", ladda upp i roten på labbservern, du loggar in med ditt användarnamn och MySQL lösenord kopplat till labbservern.
  • Du har redan en databas på labbservern med samma namn som ditt användarnamn. Skapa en databasuppkopplingsfil för labbservern, se info i avsnitt "Databasuppkoppling", för över uppkopplingsfilen och dbintrotest.php filen till lämplig plats som i detta fall är mappen dbintrotest som ligger i mappen exercises i ditt ramverk.
  • Testa databasen på labbservern genom att köra dbintrotest.php och titta därefter i phpMyAdmin hur det ser ut.
  • Checka att användarnamn och lösenord för databasuppkopplingen filtreras bort i vyn där du kan se källkoder.
  • Visa Per
Om vi behöver ladda ner ett eget phpmyadmin till Laragon:
To fix this and be able to login to PHPMyAdmin without entering the password. Copy the file named config.sample.inc.php to config.inc.php and change the following property to true.
**For the usual phpmyadmin installation, config.sample.inc.php file is usually located at /etc/phpmyadmin/config.inc.php
$cfg['Servers'][$i]['AllowNoPassword'] = true;

 
43 Tisdag 10.15-16.45 C22
10.15-12.15 Öva inför provet


13.15-14.00 TeoriPROV - PHP
del 1, teorifrågor
del 2, kodfrågor

14.15-16.15
Praktiskt PROV - PHP (Formulär, Sessions)

Du skriver provet på en provdisk som i åk 1o2.
Du kommer komma åt bestonline, w3schools, php.net och ditt eget konto på labbservern.
 
43 PDO MySQL Intro

Övningar SQL
Tips till arbetet
Göra klart MINST
uppgift 1
44 HÖSTLOV  
45 PDO MySQL Intro fortsättning
kör vidare med övningarna (idag uppgift 2)
==========================
Programmeringsolympiad
Göra klart MINST
uppgift 2
46 Mer PDO MySQL - Sortering

vidare med uppgift 3a-c
Göra klart MINST
uppgift 3c
47 Mer PDO MySQL - INNER JOIN

öva vidare med uppgift 3d-e
 
48 SACOMÄSSA  
49 Göra klart uppgift 3, nivå efter eget mål
Se till att uppgift 3 ligger på labbservern, snyggt och prydligt i ert ramverk, senast söndag.
 
50 Teori: Kryptering
Titta på Krypterings-teorin (långt ner till vänster i menyn) och gör övningen nedan

Loginsystem utbyggnad:
Uppgift 1 (Obligatorisk): Utnyttja uppgift 2(Övning SQL), bygg ut(eventuellt ta en kopia först) så lösenordet sparas krypterat med Bcrypt
Uppgift 2: Bygg ut så att när man registrerar sig måste man bekräfta via en länk som skickas(fungerar bara på labbservern) via email (t ex spara en aktiveringskod och användare i en ny tabell eller utvidga befintlig tabell, finns många olika alternativ), Info (från v34) om att skicka mejl med PHP
Uppgift 3: Bygg ut så att aktiveringskoden endast är möjlig att använda inom 15 minuter från att mejlet skickas
 
51 JULLOV  
52 JULLOV  
1 JULLOV  
2 Projekt QUIZ
Mer träning på att bygga tabeller i databasen och få ett system att fungera.

Vi övar även inför slutprojektet på att få med alla delar.
Innan du sätter igång och koda ska du TÄNKA och PLANERA. 
Du kan INTE sätta igång och koda innan din planering är färdig. 

Projekt QUIZ
 
3 Fortsättning QUIZ  
4 Fortsättning QUIZ  
5 AJAX mot databas (Teori Övrigt Ajax)
Övning Ajax
Mer AJAX (Login/Registrering och Chat)
Övning Ajax mer

Start Slutprojekt!!!!
 
6 Eget projekt: Slutprojekt - Projektinstruktioner

17TE: Annonssajt, Aktiesajt, Blocket, Bloggsajt, Livechattar, StenSaxPåse, Quiz-de-lux, Sänka skepp, Tinder, Forum, Webbshop, Kanoot
16TE: Forum, Bloggportal, Schackmatcher, Typewriter-testare, Restaurangbokning, 5 i rad, Auktion, Snakematcher, Webbshop

Innan du sätter igång och koda ska du TÄNKA och PLANERA.

Du kan INTE sätta igång och koda innan din planering ligger på nedanstående länk.

Fas 1

En projektplanering ska vara klar senast nästa vecka och ligga som en webbsida på länken
http://labb.vgy.se/~dittNamn/wspprojekt/plan.html .
    Planeringen innehåller:
  • Vad ska ditt projekt handla om? Beskriv tjänsten, funktionalitet, finesser. (Avgränsa, vad ska inte vara med.)
  • Vilka sidor! Innehåll, utseende, färger, teckensnitt, teckenstorlek, finesser! Vad är gemensamt på sidorna? Logga, rubriker, bilder. (Skissa sidorna som komplement till beskrivningen.). Rita gärna upp flödet mellan sidorna, dvs hur sidorna hänger ihop.
  • Beskriv strukturen på tabellerna i databasen, rita upp kopplingar mellan tabellerna, vad lagras i tabellerna.
  • Tidsplanering, vad ska vara klart respektive vecka. (Se till att du på slutet hinner testa, validera och korrigera brister.)

Enligt betygskriterierna
E
Eleven gör en enkel projektplan för en tänkt produkt. I projektplanen beskriver eleven översiktligt produktens funktion. Utifrån projektplanen utvecklar eleven i samråd med handledare produkten.
C
Eleven gör en genomarbetad projektplan för en tänkt produkt. I projektplanen beskriver eleven utförligt produktens funktion och arkitektur. Utifrån projektplanen utvecklar eleven efter samråd med handledare produkten.
A
Eleven gör en genomarbetad projektplan för en tänkt produkt. Vid behov reviderar eleven planen. I projektplanen beskriver eleven utförligt och nyanserat produktens funktion, arkitektur och mjukvarugränssnitt. Utifrån projektplanen utvecklar eleven efter samråd med handledare produkten.

Fas 2

Sätt igång att utveckla

 
7 Slutprojekt

Mejlfunktionen fungerar men bara till varmdogymnasium.se-konton

filhantering, PHP => inga konstigheter, det finns en mapp "filhantering" på ditt konto som har vissa rättigheter, där kan du ladda upp bild och text-filer (ej php-filer). Det finns kodexempel på avsnittet "Filhantering" i kursmaterialet, det räcker med några få rader för att ladda upp bilder(filer).


Från och med idag ska du lägga ut ditt projekt på labbservern efter varje pass. Se till att din sajt nås via länken
http://labb.vgy.se/~dittNamn/wspprojekt/index.html
(Även om ditt projekt inte ligger där ska du lägga en länk där, till ditt projekt.)

Dessutom ska du skriva en "loggbok", på följande adress:
http://labb.vgy.se/~dittNamn/wspprojekt/redovisning.html
(Där kommer du senare även skriva redovisningen av projektet.)
Skriv datum och vad du gjort, problem som uppstått, om du gjort något bra, vad som står på tur.
.
 
8 Inarbetad lektion - LEDIGA idag  
9 SPORTLOV  
Tisdag
10
13.15-16.15: SQL-prov
SQLprov
(typ enklare och svårare delar av uppgift 3 i MySQL Intro övningar samt Quizzen)
Du kommer komma åt bestonline, w3schools, php.net och dina egna övningar.
 
10 Slutprojekt
Statuscheck:
2 stycken ska genomföras under lektionstid med Per innan vecka 14.
Vi går igenom kod, tittar på vad som är klart och vad som ska bli nästa steg.

Till att börja med, lägg upp och skriv loggbok i slutet på dagens lektion. Så har vi något att utgå ifrån nästa vecka.

OM INTE DESSA GENOMFÖRS SÅ VET JAG INTE VEM SOM SKRIVIT ER KOD OCH DÅ KAN JAG INTE BEDÖMA ERT PROJEKT.
 
11 Fortsättning Slutprojekt, statusläge 1


 
12 Fortsättning Slutprojekt  
Tisdag
13

13.15-16.45 B43
Fortsättning Slutprojekt, statusläge 2

Vissa har mentorssamtal under tiden. Då är det bara att kila iväg.

Ladd upp filer:

$text="kalle.jpg"; //byt till olika namn! eller använd orginalnamnet: $_FILES["selectedFile"]["name"]
if(isset($_FILES["selectedFile"]["tmp_name"]) && $_FILES["selectedFile"]["tmp_name"] != "") //isset funktionen returnerar true om filen är definierad och ej tom sträng
{
copy($_FILES["selectedFile"]["tmp_name"], "filer/".$text); //kopiera den temporära filen till filer-katalogen som med sitt riktiga namn.
unlink($_FILES["selectedFile"]["tmp_name"]); //avlänkar filen
}

echo ('<form action="" method="post" enctype="multipart/form-data">');
echo ('<input name="selectedFile" type="file" size="40">');
echo ('<input name="submit" type="submit" value="Ladda upp" class="knapp1">');
echo ('</form>');


 
13 Fortsättning Slutprojekt

Säkerhet - Webbhacking

Övning
0) Läs om "Säkerhet - Webhacking"
1) Vad XSS?
2) Vad är sql-injection?
2) Fundera över något sätt att hantera "Brute Force Attacs"?
3) Vad är CAPTCHA, vad är bättre?
-------------------------------------------
4) Hur skyddar du din "logga in"-sida?

OBS! Säkerhet MÅSTE vara inbyggt i slutprojektet, annars F på projektet.


 
14 PÅSKLOV  
15 PÅSKLOV  
16 Fortsättning Slutprojekt  
17 Slutprojekt
Senaste inlämning söndag v 17
  • Projektrapport med kommentarer om:

    • Vilka deluppgifter/moment från projektinstruktionerna har du gjort?
    • Beskriv i stora drag hur ditt program fungerar? Hur är koden strukturerad?
    • Beskriv några delar detaljerat, t ex delar som du är extra nöjd med
    • Har du några extra finesser, bra lösningar på någon del?
    • Reflektera över ditt eget arbete, ditt program, din kod, dina lösningar. Bra/dåligt/bättre/utveckling!
    • Skriv något om hur du upplevt projektet, lätt/svårt, kul/tråkigt, något annat? Beskriv gärna lite med egna ord.
    • Har du tips på hur projektet kan göras bättre?
    • Övriga synpunkter!

  • Tydlig kommentering i koden
  • ReadMe-fil som förklarar struktur, funktionalitet och innehåller användarbeskrivning
  • Alla filer zippade , inklusive rapporten och ReadMe-fil. Låt den ligga i projekt-mappen.
  • Mejla Per, bifoga länk till labbservern, där allt ska vara installerat och fungera. Det ska ligga i ert "miniramverk" så att jag kan titta på koden.
    Bifoga även länken till zip-filen i mejlet.
 
18 Redovisning
Genomgång av projekt, status/läge, betyg
 
19 Redovisning
Genomgång av projekt, status/läge, betyg

PHP: Repetitionsuppgifter Special
 
20 LOV  
21 - Komplettering PHP, endast kallade (övriga lediga)  
22 - Komplettering SQL, endast kallade (övriga lediga)  
23 Komplettering reserv, endast kallade (övriga lediga)  

SLUT

Timmar: 85h

Projekt: Miniramverk, Quiz, Sluprojekt


      

Utvecklingsmiljöer

Labbservern

PHP 7.2, MariaDB 5.5 och Apache 2.4.6

Laragon

Apache 2.4, MySQL 5.7, PHP 7.4

Lösningsförslag

Alrik's