ΣΔΥΝΟΛΟΓΙΚΟ ΔΚΠΑΙΓΔΤΣΙΚΟ ΙΓΡΤΜΑ ΚΡΗΣΗ ΥΟΛΗ ΣΔΥΝΟΛΟΓΙΚΧΝ ΔΦΑΡΜΟΓΧΝ ΣΜΗΜΑ ΔΦΑΡΜΟΜΔΝΗ ΠΛΗΡΟΦΟΡΙΚΗ & ΠΟΛΤΜΔΧΝ ΠΣΤΥΙΑΚΗ ΔΡΓΑΙΑ

Transcript

1 ΣΔΥΝΟΛΟΓΙΚΟ ΔΚΠΑΙΓΔΤΣΙΚΟ ΙΓΡΤΜΑ ΚΡΗΣΗ ΥΟΛΗ ΣΔΥΝΟΛΟΓΙΚΧΝ ΔΦΑΡΜΟΓΧΝ ΣΜΗΜΑ ΔΦΑΡΜΟΜΔΝΗ ΠΛΗΡΟΦΟΡΙΚΗ & ΠΟΛΤΜΔΧΝ ΠΣΤΥΙΑΚΗ ΔΡΓΑΙΑ Web εθαπμογή για ηην δήλωζη διαθεζιμόηηηαρ επγαζίαρ. πνπδαζηήο : Παηεξάθεο Γεψξγηνο Επιβλέπων Καθηγηηές : Μαλάμος Αθανάζιος Καπεηανάκης Κωνζηανηίνος

2 Σηην οικογένειά μος, 2

3 Δςσαπιζηίερ Σίποηα δεν είναι ακαηόπθυηο, απλώρ δεν ξέποςμε ηον ηπόπο για να ηο πεηύσοςμε Thomas Edison Δθεπξέηεο ηνπ ζεξκνειεθηξηθνχ θαηλφκελνπ, ειεθηξηθνχ ιακπηήξα δηαπχξσζεο κε ζχξκα απφ άλζξαθα. Απηή ηε θξάζε ζθεθηφκνπλ θάζε θνξά, πνπ κε ηελ πξψηε δπζθνιία πνπ ζπλαληνχζα, πειάγσλα θαη πίζηεπα φηη δελ ζα θαηαθέξσ πνηέ λα νινθιεξψζσ ηελ πηπρηαθή εξγαζία. Απηή ε θξάζε κνπ έδηλε θνπξάγην θαη κε έθαλε λα ςάρλσ λα βξσ ηνπο ηξφπνπο γηα λα ην πεηχρσ. Καη λα πνπ ηψξα πνπ βξίζθνκαη εδψ λα ζπγγξάθσ απηφ ην θείκελν γεγνλφο πνπ δειψλεη φηη ηα δχζθνια πέξαζαλ. ιν απηφλ ηνλ θαηξφ ζε απηήλ ηελ πξνζπάζεηα δελ ήκνπλ κφλνο. Τπήξμαλ πνιινί άλζξσπνη πνπ κε βνήζεζαλ λα ηα θαηαθέξσ, ν θαζέλαο κε ηνλ ηξφπν ηνπ. Με ηελ νινθιήξσζε ηεο πηπρηαθήο κνπ εξγαζίαο ινηπφλ, ζα ήζεια λα επραξηζηήζσ ηνπο αλζξψπνπο νη νπνίνη βνήζεζαλ ζηελ πξαγκαηνπνίεζή ηεο. Θα ήηαλ παξάιεηςε λα κελ αλαθεξζψ ζε φινπο εθείλνπο πνπ ζπκπαξαζηάζεθαλ ζε απηήλ ηελ πξνζπάζεηα θαη κε ζηήξημαλ ςπρνινγηθά απηνχο ηνπο κήλεο. Θα ήζεια λα πσ έλα πνιχ κεγάιν επραξηζηψ ζηνπο γνλείο κνπ θαη ζηελ αδεξθή κνπ, πνπ πάληα πίζηεπαλ ζε εκέλα θαη κε ζηήξηδαλ ηα ρξφληα ησλ ζπνπδψλ κνπ. Σνπο επραξηζηψ πνπ θαηαθέξλνπλ λα είλαη πάληα ζην πιεπξφ κνπ. πλερίδνληαο, ζα ήζεια λα επραξηζηήζσ ζεξκά ηνπο εηζεγεηέο θαζεγεηέο κνπ θχξην Μαιάκν Αζαλάζην θαη θχξην Καπεηαλάθε Κσλζηαληίλν, ηφζν γηαηί κνπ πξφηεηλαλ απηφ ην ζέκα φζν θαη γηαηί πάληα ήηαλ εθεί φηαλ ηνπο ρξεηαδφκνπλ, πξφζπκνη λα ιχζνπλ ηηο απνξίεο κνπ θαη αθαηξψληαο κνπ ην άγρνο λα κε βνεζήζνπλ λα νινθιεξψζσ απηήλ ηελ εξγαζία. Δπραξηζηψ πάξα πνιχ φινπο κνπ ηνπο θίινπο, παιηνχο θαη λένπο, πνπ αζρνιήζεθαλ καδί κνπ, κε ζηήξημαλ θαη κε άληεμαλ φινλ απηφλ ηνλ θαηξφ θαη έθαλαλ ηελ θνηηεηηθή κνπ δσή κηα επράξηζηε θαη λνζηαιγηθή αλάκλεζε πνπ ζα κε ζπληξνθεχεη ηα επφκελα ρξφληα. 3

4 Πεπίλητη Σν πεδίν εθαξκνγήο ηεο παξνχζα πηπρηαθήο είλαη, ε ζρεδίαζε κηαο web εθαξκνγήο γηα ηελ δήισζε δηαζεζηκφηεηαο εξγαζίαο. Πην ζπγθεθξηκέλα ην πεδίν ηεο ζπγθεθξηκέλεο δηαηξηβήο είλαη ε αλάπηπμε ελφο δηθηπαθνχ ηφπνπ κε ρξήζε γισζζψλ πξνγξακκαηηζκνχ δηαδηθηχνπ html 5, JavaScript θαη php πνπ λα ζπλδέεηαη ζε Βάζε δεδνκέλσλ, γηα ηελ παξνπζίαζε θαη ηελ δηαρείξηζε ελφο δηαδηθηπαθνχ ηφπνπ φπνπ άλζξσπνη πνπ αλαδεηνχλ εξγαζία κπνξνχλ λα εηζαγάγνπλ ηα ζηνηρεία ηνπο έηζη ψζηε νη εξγνδφηεο νη νπνίνη αλαδεηνχλ πξνζσπηθφ κπνξνχλ λα εμεξεπλήζνπλ ηνπο ήδε θαηαρσξεκέλνπο ψζηε λα δηαπηζηψζνπλ αλ ππάξρεη θάπνηνο πνπ λα θαιχπηεη ηηο απαξαίηεηεο πξνυπνζέζεηο θάζε θνξά. 4

5 Abstract The scope of this project is designing a web application stating job availability. More specifically, the scope of this thesis is the development of a website using programming languages such as html 5, JavaScript θαη php, which is connected to a database, with a view to present and manage a social network in which people seeking employment will be able to import their data so that possible employers seeking for personnel can find an employee who qualifies for the respective job. 5

6 Πεπιεσόμενα 1. ΔΙΑΓΧΓΗ ηφρνη πηπρηαθήο εξγαζίαο Η εξγαζία ζηελ αλζξψπηλε δσή Δχξεζε εξγαζίαο θαη Γηαδίθηπν ΙΣΟΔΛΙΓΔ ηαηηθέο Ιζηνζειίδεο Γπλακηθέο Ιζηνζειίδεο Πιενλεθηήκαηα θαη Μεηνλεθηήκαηα ηαηηθέο Ιζηνζειίδεο Γπλακηθέο Ιζηνζειίδεο ΣΔΥΝΟΛΟΓΙΔ ΑΝΑΠΣΤΞΗ ΔΦΑΡΜΟΓΗ Html θαη δεκηνπξγία αξρείσλ Php Πιενλεθηήκαηα ηεο PHP PhpMyAdmin MySQL Πιενλεθηήκαηα ηεο MySQL JavaScript CSS (Cascading Stylesheets) Πιενλεθηήκαηα CSS έλαληη ηεο κνξθνπνίεζεο κέζσ HTML attributes χληαμε CSS Apache server Adobe Dreamweaver Adobe Photoshop ΣΡΟΠΟ ΤΛΟΠΟΙΗΗ ΠΣΤΥΙΑΚΗ ΔΡΓΑΙΑ Γεκηνπξγία ηεο Ιζηνζειίδαο ΒΙΒΛΙΟΓΡΑΦΙΑ

7 Πίνακαρ Δικόνυν Δηθφλα : Πίλαθαο απνηειεζκάησλ απφ έξεπλα ηνπ Google Δηθφλα : Η θεληξηθή ζειίδα ηεο phpmyadmin ζην localhost κέζσ ηνπ wamp Δηθφλα : Γηαθνκηζηή βάζεο δεδνκέλσλ Δηθφλα : Γεκνηηθφηεηα ηνπ Apache ζε ζρέζε κε παξφκνηνπο server κε ην πέξαζκα ηνπ ρξφλνπ Δηθφλα : Home Page Δηθφλα : Μέξνο α απφ ην Sign Up Page Δηθφλα : Μέξνο β απφ ην Sign Up Page Δηθφλα : Login Page Δηθφλα : Search Page

8 1. ΔΙΑΓΩΓΗ 1.1 ηόσοι πηςσιακήρ επγαζίαρ Ο ζηφρνο ηεο πηπρηαθήο εξγαζίαο είλαη λα δείμνπκε πσο θαηαζθεπάδνπκε κηα δπλακηθή ηζηνζειίδα γηα ηελ νπνία δελ είλαη αξθεηή ε ρξήζε ηεο γιψζζαο HTML καδί κε ηελ JavaScript αιιά ζα ρξεηαζηνχκε θάπνηα γιψζζα γηα λα πεηχρνπκε απηφ πνπ θαιείηαη δπλακηθφ θαη απηή είλαη ε PHP ( Hypertext Preproccesor). Σν site καο είλαη γηα φινπο εθείλνπο πνπ ςάρλνπλ λα βξνπλ εξγαζία αιιά θαη γηα φζνπο έρνπλ λα πξνζθέξνπλ θάπνηα ζέζε εξγαζίαο. Ο θάζε ρξήζηεο κπνξεί λα κπαίλεη ζην site θαη λα δεκηνπξγεί ην δηθφ ηνπ ινγαξηαζκφ κε ηα δηθά ηνπ ζηνηρεία θαη ηε δηθή ηνπ εξγαζηαθή ηδηφηεηα ψζηε φηαλ θάπνηνο εξγνδφηεο αλαδεηά θάπνηνλ ππάιιειν λα κπνξεί λα ηνλ βξίζθεη κέζσ ησλ ζηνηρείσλ πνπ έρεη θαηαρσξήζεη. Θα κπνξνχζακε λα πνχκε πσο ην site καο θπξίσο εμππεξεηεί ηνπο εξγνδφηεο πνπ πξνζθέξνπλ θάπνηα ζέζε εξγαζίαο θαη ζε δεπηεξεχνλ επίπεδν ηνπο ρξήζηεο νη νπνίνη αλαδεηνχλ θάπνηα ζέζε εξγαζίαο., θαζψο λαη κελ κπνξνχλ λα δνπλ πξνζθεξφκελεο ζέζεηο εξγαζίαο θαη λα θαηαρσξήζνπλ ηα ζηνηρεία ηνπο ζην πξνζσπηθφ ηνπο ινγαξηαζκφ, αιιά δελ έρνπλ ηελ δπλαηφηεηα λα έξζνπλ εθείλνη ζε επαθή κε ηνπο εξγνδφηεο θαζψο πέξα απφ ηηο ζέζεηο ηα ζηνηρεία ησλ εξγνδνηψλ δε είλαη νξαηά ζε εθείλνπο. 8

9 1.2 Η επγαζία ζηην ανθπώπινη ζυή Ση απνθαιείηαη Δξγαζία; Δξγαζία απνθαιείηαη θάζε αλζξψπηλε δξαζηεξηφηεηα πνπ αζθείηαη κε ζηφρν ηε δεκηνπξγία ελφο ρξήζηκνπ απνηειέζκαηνο. Μπνξεί λα είλαη είηε ρεηξσλαθηηθή είηε πλεπκαηηθή, δελ απνθιείεηαη δε λα ζπλδπάδεη θαη ηα δχν. Σν απνηέιεζκά ηεο είλαη ε δεκηνπξγία, κέζσ ηεο νπνίαο ην άηνκν έρεη θαηνξζψζεη λα δηαθξηζεί απφ ηα ππφινηπα φληα γχξσ ηνπ θαη λα παξάγεη πνιηηηζκφ. Η ζεκαζία ηεο απνδεηθλχεηαη θαζεκεξηλά εθφζνλ απνηειεί βαζηθφ ζέκα ζπδήηεζεο θαη πξνβιεκαηηζκνχ γηα ην άηνκν. Δπεξεάδεη ηελ ζπλαηζζεκαηηθή ηνπ θαηάζηαζε, ηελ αληίιεςε ηνπ Δαπηνχ ηνπ, ηελ εθηίκεζε πνπ ιακβάλεη απφ ηνπο γχξσ ηνπ. Ο Freud, παηέξαο ηεο Φπρνινγίαο, ν νπνίνο κφιηο ζηηο αξρέο ηνπ πεξαζκέλνπ αηψλα, αλαθέξζεθε ζηε ζεκαζία ηεο Δξγαζίαο ζηε δσή ηνπ αλζξψπνπ. πγθεθξηκέλα ηφληζε φηη βαζηθνί παξάκεηξνη γηα ηελ θπζηνινγηθή ιεηηνπξγία ελφο ππνθεηκέλνπ δελ είλαη παξά ν ζπλδπαζκφο θαη ε ζπλχπαξμε ζε απηφ δχν βαζηθψλ ηθαλνηήησλ: ηεο ηθαλφηεηαο λα Αγαπά θαη ηεο ηθαλφηεηαο λα Δξγάδεηαη. Αγάπε θαη Δξγαζία εγγπψληαη ζχκθσλα κε απηφλ θαη φρη κφλν, ηελ ςπρηθή ηζνξξνπία ηνπ αηφκνπ, εθφζνλ κέζα απφ ηελ επίηεπμε ηεο Αγάπεο ηθαλνπνηεί ηε κέγηζηε ζπλαηζζεκαηηθή αλάγθε ηνπ θαη κέζα απφ ηελ Δξγαζία επηηπγράλεη ηηο πξνυπνζέζεηο πνπ νδεγνχλ ζηελ απηνπξαγκάησζε ηνπ. Η ζρέζε αλάκεζα ζηελ Δξγαζία θαη ηελ ςπρηθή ηζνξξνπία απνηειεί ινηπφλ ην θξηηήξην αμηνιφγεζεο ηεο ζεκαληηθφηεηαο ηεο πξψηεο. Γηαηί φκσο ππάξρεη απηή ε άξξεθηε ζρέζε αλάκεζα ζηηο δχν έλλνηεο; Γηαηί ε 9

10 Δξγαζία δελ είλαη απιά ην κέζν γηα ηελ βηνινγηθή επηβίσζε ελφο αηφκνπ. Απνηειεί έλαλ βαζηθφ παξάγνληα πνπ εμαζθαιίδεη ηελ απνδνρή ηνπ απφ ηνπο γχξσ ηνπ θαη ηαπηφρξνλα ηελ δηαθνξνπνίεζε απφ απηνχο, αλάγθεο πνπ ην άηνκν απνδεηά εμίζνπ. Κάζε άλζξσπνο κεηαθέξεη ζηελ εξγαζία ηηο αλάγθεο ηνπ θαη αλακέλεη ηελ εθπιήξσζή ηνπο κέζα απφ απηήλ. Δπηπιένλ, ζα κπνξνχζακε λα πνχκε πσο ε επηινγή εξγαζίαο γηα θάζε άλζξσπν έρεη λα θάλεη θαη κε ηα ζηνηρεηά ηεο πξνζσπηθφηεηάο ηνπ. Η έλλνηα ηεο πξνζσπηθφηεηαο ζην ρψξν ηεο Φπρνινγίαο πεξηιακβάλεη κηα ζεηξά απφ γλσξίζκαηα φρη κφλν ζσκαηηθά αιιά θαη ζε εμίζνπ κεγάιν βαζκφ ςπρηθά. Γηαθξίλεηαη γηα ηε κνλαδηθφηεηά ηεο, αθνχ νθείιεηαη ζε κηα αζχιιεπηε αιιειεπίδξαζε θιεξνλνκηθψλ θαηαβνιψλ θαη πεξηβαιινληηθψλ εξεζηζκάησλ, δηαθνξεηηθψλ γηα ηνλ θαζέλα. Γηαθξίλεηαη επίζεο θαη γηα ηε ζηαζεξφηεηά ηεο, αθνχ βαζηθά ραξαθηεξηζηηθά θαη θίλεηξά ηεο, πνπ έρνπλ δηακνξθσζεί ζε δηάζηεκα κηαο κεγάιεο ρξνληθήο πεξηφδνπ ή σο απνηέιεζκα έληνλσλ ςπρηθά εκπεηξηψλ, δε κπνξνχλ εχθνια λα αιιάμνπλ. Η πξνζσπηθφηεηά καο, ζην ζχλνιφ ηεο, επεξεάδεη δξαζηηθά ηηο επαγγεικαηηθέο καο επηινγέο θαη ηφζν ηα ζσκαηηθά φζν θαη ηα ςπρηθά ηεο ραξαθηεξηζηηθά παίδνπλ ζεκαληηθφ ξφιν, κε ζπλεηδεηφ θαη αζπλείδεην πνιιέο θνξέο ηξφπν. ε φ, ηη αθνξά ηα ςπρηθά ραξαθηεξηζηηθά κπνξνχκε λα αλαθέξνπκε παξαδεηγκαηηθά θαη κε παξάζεζε ησλ αληηζέησλ ηνπο ηα εμήο: Αξξελσπφηεηα -Θειπθφηεηα, Κνηλσληθφηεηα - Απνκφλσζε, Δμάξηεζε - Αλεμαξηεζία, Γηαίζζεζε - Αίζζεζε, Γηαλφεζε - πλαίζζεκα, Δζσζηξέθεηα - Δμσζηξέθεηα. Η χπαξμε θαη ν ζπλδπαζκφο ηνπο, φληαο κνλαδηθά ζε θάζε άηνκν, ην θάλνπλ λα αληηδξά κε ζπγθεθξηκέλνπο ηξφπνπο ζηηο δηάθνξεο θαηαζηάζεηο κε ηηο νπνίεο θαζεκεξηλά έξρεηαη αληηκέησπν. Δλδεηθηηθά, θάπνηα βαζηθά ζηνηρεία ηεο πξνζσπηθφηεηαο πνπ είζηζηαη λα επεξεάδνπλ ηηο επηινγέο ηνπ ζην ζέκα ηεο εξγαζίαο είλαη: ζε ζσκαηηθφ επίπεδν: ε γεληθή πγεία ηνπ, ε εκθάληζε, ε αξηηκέιεηα, ε κεησκέλε απφδνζε ησλ αηζζεηήξησλ νξγάλσλ ηνπ (π.ρ. πεξηνξηζκέλε αθνή θ.α. ) ζε ςπρηθφ επίπεδν: ε γεληθή πγεία ηνπ, ε απηνεθηίκεζε, νη ηθαλφηεηεο (π.ρ. κεησκέλε ηθαλφηεηα δηαπξνζσπηθψλ ζπλδηαιιαγψλ θ.α. ) 10

11 1.3 Δύπεζη επγαζίαρ και Γιαδίκηςο Σν Ίληεξλεη, ζχκθσλα κε ηελ κειέηε, αμηνπνηείηαη δεφλησο γηα ηελ αλαδήηεζε αγγειηψλ εξγαζίαο, ηελ απνζηνιή βηνγξαθηθψλ ζεκεησκάησλ θαη ηε ζπκπιήξσζε ειεθηξνληθψλ αηηήζεσλ πξφζιεςεο ζε δπλεηηθνχο εξγνδφηεο, φια απηά κε πνιχ κεησκέλν θφζηνο γηα φπνηνλ ςάρλεη δνπιεηά, ζε ζρέζε κε ηηο παξαδνζηαθέο κεζφδνπο, πνπ θνζηίδνπλ πεξηζζφηεξν ζε ρξφλν θαη ρξήκα. Οη πεξηζζφηεξνη λένη ζήκεξα πξνηηκνχλ λα ρξεζηκνπνηνχλ απνθιεηζηηθά θαη κφλν ην δηαδίθηπν γηα ηελ εχξεζε ζέζεσλ εξγαζίαο. Χζηφζν δελ πξέπεη ζε θακία πεξίπησζε λα ππνηηκάηαη ε αμία ησλ εθεκεξίδσλ σο πεγή λέσλ ζέζεσλ εξγαζίαο, δηφηη αξθεηνί εξγνδφηεο πεγαίλνπλ θφληξα ζην θχκα ηεο επνρήο θαη επηιέγνπλ λα δεκνζηεχνπλ ηηο αγγειίεο ηνπο ζηνλ έληππν ηχπν. Αμίδεη λα αλαθεξζνχκε πσο πιένλ πέξα απφ εθείλνπο πνπ αλαδεηνχλ εξγαζία νη πεξηζζφηεξνη εξγνδφηεο πιένλ ρξεζηκνπνηνχλ ην δηαδίθηπν γηα εχξεζε πξνζσπηθνχ θαη ηέινο ζα ζεκεηψζνπκε πσο Η ρξεζηκνπνίεζε ηνπ Ίληεξλεη γηα λα βξεη θαλείο δνπιεηά, κεηψλεη πεξίπνπ 25% θαηά κέζν φξν ηνλ ρξφλν παξακνλήο ηνπ ζηελ αλεξγία, ζχκθσλα κε κηα λέα ακεξηθαληθή έξεπλα. 11

12 2. ΙΣΟΔΛΙΓΔ 2.1 ηαηικέρ Ιζηοζελίδερ Με ηελ παγθφζκηα άλζεζε ηνπ δηαδηθηχνπ, ηε ρξήζε ηνπ απφ φιν θαη πεξηζζφηεξνπο αλζξψπνπο σο βαζηθφ µέζν µαδηθήο επηθνηλσλίαο, είλαη πιένλ πξνθαλέο φηη ην θάζε λνµηθφ ή θπζηθφ πξφζσπν επηβάιιεηαη λα έρεη παξνπζία ζε απηφ. Ο ζπλεζέζηεξνο ηξφπνο παξνπζίαζεο ησλ πξντφλησλ µηαο επηρείξεζεο ή ε πξνβνιή ηδεψλ ελφο αηφµνπ είλαη µέζσ µηαο ηζηνζειίδαο. Σα είδε µηαο ηζηνζειίδαο πνηθίινπλ, αλάινγα µε ηηο αλάγθεο ηνπ θαζελφο. Οη δπν µεγαιχηεξεο θαη βαζηθφηεξεο θαηεγνξίεο ηζηνζειίδσλ είλαη νη ζηαηηθέο (static) θαη νη δπλαµηθέο (dynamic). ζνλ αθνξά ηελ φςε / εµθάληζή ηνπο, δελ έρνπλ µεγάιεο δηαθνξέο µεηαμχ ηνπο, αιιά φζνλ αθνξά ηελ ιεηηνπξγία θαη ηηο δπλαηφηεηέο ηνπο νη δηαθνξέο είλαη πνιιέο θαη νπζηαζηηθέο. ηαηηθή ηζηνζειίδα είλαη απηή ηεο νπνίαο ην πεξηερφµελν θαη νη εηθφλεο είλαη νη ίδηεο γηα θάζε επηζθέπηε θαη δελ αιιάδνπλ µέζσ θάπνηαο αιιειεπίδξαζεο ηνπ επηζθέπηε µε ηνλ ηζηφηνπν. Δίλαη θαηάιιειεο θπξίσο γηα ηελ δεµηνπξγία «µφληµσλ/ζηαηηθψλ παξνπζηάζεσλ», φπνπ δελ ππάξρεη ζπρλά ε αλάγθε λα ηξνπνπνηείηαη ην πεξηερφµελφ ηνπο. ειαδή, ζα µπνξνχζε λα ρξεζηµνπνηεζεί µηα ζηαηηθή ηζηνζειίδα γηα ηελ γεληθή παξνπζίαζε µηαο επηρείξεζεο θαη ησλ πξντφλησλ ή ππεξεζηψλ ηεο. Η πξψηεο ηζηνζειίδεο πιεζηάδνπλ πεξηζζφηεξν ηηο ζεµεξηλέο ζηαηηθέο, παξά ηηο δπλαµηθέο, πνπ εθεπξέζεθαλ αξγφηεξα. Ο βξεηαλφο Σηµ-Μπέξλεο Λη, εθεπξέηεο ηνπ 12

13 Ιληεξλεη ή ηνπ world wide web ην 1989, δεµνζίεπζε ηνλ Αχγνπζην ηνπ 1991 απηφ πνπ ζεσξνχµε ζήµεξα σο ηελ πξψηε ηζηνζειίδα ε νπνία ήηαλ γξαµµέλε ζε html, δειαδή ζηε γιψζζα πνπ γξάθνληαη νη ζηαηηθέο ηζηνζειίδεο. Πνιινί ππνζηεξίδνπλ φηη νη ζηαηηθέο ηζηνζειίδεο είλαη παιαηνχ ηχπνπ θαη ηερλνινγίαο. Απηφ φµσο είλαη µηα ιαλζαζµέλε εληχπσζε πνπ έρεη δεµηνπξγεζεί. Μεξηθέο απφ ηηο πην «µνληέξλεο» ηζηνζειίδεο ζήµεξα είλαη ζηαηηθέο. Οη ζηαηηθέο ηζηνζειίδεο είλαη νπζηαζηηθά απιά ειεθηξνληθά «έγγξαθα». Μπνξνχλ λα πεξηέρνπλ θείµελα, θσηνγξαθίεο, ζπλδέζµνπο (links), αξρεία γηα download, θηλνχµελα ζρέδηα (animated graphics). Δίλαη θαηάιιειεο θπξίσο γηα ηελ δεµηνπξγία «µφληµσλ/ζηαηηθψλ παξνπζηάζεσλ», φπνπ δελ ππάξρεη ζπρλά ε αλάγθε λα ηξνπνπνηείηαη ην πεξηερφµελφ ηνπο. ειαδή, µηα ζηαηηθή ηζηνζειίδα ζα µπνξνχζε λα ρξεζηµνπνηεζεί γηα ηελ γεληθή παξνπζίαζε µηαο επηρείξεζεο θαη ησλ πξντφλησλ ή ππεξεζηψλ ηεο. 2.2 Γςναμικέρ Ιζηοζελίδερ Οη δπλαµηθέο ηζηνζειίδεο µπνξεί ζηελ εµθάληζε, ζε πνιιέο πεξηπηψζεηο, λα µελ έρνπλ µεγάιε δηαθνξά µε ηηο ζηαηηθέο φµσο νη δπλαηφηεηέο ηνπο είλαη πνιχ πεξηζζφηεξεο, απφ πνιιέο πιεπξέο, θαζψο ζηελ πεξίπησζε απηή νπζηαζηηθά πξφθεηηαη γηα µία εθαξκνγή (πξφγξαµµα) θαη φρη έλα απιφ ειεθηξνληθφ έγγξαθν. πλήζσο νη δπλαµηθέο ηζηνζειίδεο ρξεζηκνπνηνχλ θάπνηα βάζε δεδνκέλσλ (database) φπνπ απνζεθεχνπλ πιεξνθνξίεο θαη απ φπνπ αληινχλ ην πεξηερφµελφ ηνπο αλάινγα µε ην ηη δεηάεη ν ρξήζηεο/επηζθέπηεο ζε θάζε ηνπ «θιηθ». Η ρξήζε ησλ βάζεσλ δεδνµέλσλ είλαη απηή πνπ επηηξέπεη ηελ εχθνιε πξνζζαθαίξεζε πεξηερνκέλνπ ζηηο δπλαµηθέο ηζηνζειίδεο θαζψο δελ απαηηείηαη λα επεμεξγάδεηαη θαλείο θάζε θνξά ηελ ίδηα ηελ ηζηνζειίδα αιιά απιά λα δηαρεηξίδεηαη έµκεζα ην πεξηερφµελν ζηελ βάζε δεδνµέλσλ θαη νη ππφινηπεο δηαδηθαζίεο γίλνληαη απηνκαηνπνηεκέλα απφ ηνλ «µεραληζµφ» ηεο ηζηνζειίδαο. 2.3 Πλεονεκηήμαηα και Μειονεκηήμαηα Η θαηαζθεπή ηζηνζειίδσλ (Web development-design) απφ ηνπο ζρεδηαζηέο (web designers - developers) είλαη ε δηαδηθαζία δεκηνπξγίαο παξνπζηάζεσλ πεξηερνκέλνπ 13

14 (ζπλήζσο ππεξθεηµέλνπ ή πνιπµέζσλ), νη νπνίεο πξνβάιινληαη ζηνλ ηειηθφ ρξήζηε ηνπ ηαδηθηχνπ µέζσ ελφο πξνγξάκκαηνο πεξηήγεζεο (browser). ιεο νη ηζηνζειίδεο είλαη έλα ειεθηξνληθφ αξρείν ή έλα ζχλνιν απφ ειεθηξνληθά αξρεία απνζεθεπκέλα ζε ζθιεξνχο δίζθνπο πνπ ιέγνληαη servers. Σα ειεθηξνληθά αξρεία µπνξεί λα είλαη εηθφλεο (.jpeg,.gif,.png,.bmp) ηα νπνία ηνπνζεηνχληαη ζηε ζειίδα µαο µε ηε ρξήζε ησλ θαηάιιεισλ θσδηθψλ ζήµαλζεο (html/xhtml/xml), ψζηε λα αλαγλσξίδνληαη απφ ηνλ πεξηεγεηή µαο ν νπνίνο µε ηε ζεηξά ηνπ ζα µαο ηα απεηθνλίζεη ζηελ νζφλε µαο. Βέβαηα ζήµεξα ηα πξάγµαηα δελ είλαη ηφζν απιά. Έρνπλ εμειηρζεί ζε µεγάιν βαζµφ. Η απιή γιψζζα ζήµαλζεο html έρεη ζπλδπαζηεί µε εθαξκνγέο JavaScript θαη µε CSS, θαη έηζη ηα πξάγµαηα έρνπλ γίλεη πνιχ πην πεξίπινθα. Πάλησο ζε γεληθέο γξαµµέο, νη browsers αθνινπζνχλ ηα εληαία πξφηππα θαη πξνδηαγξαθέο πνπ έρεη ζέζεη ην W3C. Κη νη browsers ζήµεξα ελζσκαηψλνπλ πάλσ ηνπο ηα πξφζζεηα (plugins), πνπ άιινηε ζα έπξεπε λα ηα εγθαηαζηήζνπλ νη ρξήζηεο μερσξηζηά. Η ζηαηηθή ηζηνζειίδα έρεη πιενλεθηήκαηα πνπ δελ έρνπλ νη δπλαµηθέο θαη ην αληίζεην. Γη απηφ δελ µπνξνχµε λα πνχµε φηη ε µία είλαη θαιχηεξε απφ ηελ άιιε. Απηφ ην ιάζνο ην θάλνπλ πνιινί, πνπ ιέλε φηη νη δπλαµηθέο είλαη θαιχηεξεο απφ ηηο ζηαηηθέο, ίζσο επεηδή έρνπλ πην πνιιά πιενλεθηήκαηα. Η βαζηθή δηαθνξά είλαη φηη νη ζηαηηθέο ηζηνζειίδεο δελ αιιειεπηδξνχλ µε ηνλ επηζθέπηε, πξάγµα πνπ θάλνπλ νη δπλαµηθέο ηαηικέρ Ιζηοζελίδερ Οη ζηαηηθέο ηζηνζειίδεο ραξαθηεξίδνληαη απφ ηελ µνληµφηεηα ηνπ πεξηερνκέλνπ ηνπο θαη ηεο δηάηαμήο ηνπο (layout), ηα νπνία µπνξνχλ λα αιιάμνπλ/λα ηξνπνπνηεζνχλ µφλν µε αίηεµα γηα αλαβάζκηζε (update) απφ ηνλ πξνγξακκαηηζηή/δηαρεηξηζηή ηεο ζειίδαο απηήο. Μηα απιή ζειίδα html (έγγξαθν html) πνπ πεξηιακβάλεη γηα παξάδεηγκα θείκελν, ζπλδέζµνπο θαη θσηνγξαθίεο, είλαη έλα απιφ παξάδεηγκα ζηαηηθήο ζειίδαο. Σα δεδνµέλα ζε µηα ζηαηηθή ηζηνζειίδα δελ αιιάδνπλ δπλαµηθά. Έρνπλ ζηαζεξφ, ακεηάβιεην πεξηερφµελν. ηα ππέξ ηεο ζηαηηθήο ζειίδαο είλαη ην ραµειφ θφζηνο θαηαζθεπήο θαη ζπληήξεζεο, γηαηί µηα ζηαηηθή ζειίδα, δελ απαηηεί µεγάιν ρψξν ζε θηινμελία απφ webserver. Μηα ζηαηηθή ζειίδα αλαπηχζζεηαη/ζρεδηάδεηαη γξεγνξφηεξα απφ φηη µηα δπλαµηθή. Δπίζεο νη ζηαηηθέο ζειίδεο θνξηψλνπλ πην γξήγνξα απφ φηη νη δπλαµηθέο. 14

15 Μεγάιν πιενλέθηεκα ησλ ζηαηηθψλ ηζηνζειίδσλ έλαληη ησλ δπλαµηθψλ είλαη επίζεο φηη είλαη πην SEO friendly. To SEO ζεµαίλεη Search engine optimization θαη ζηα ειιεληθά «Βειηηζηνπνίεζε ειίδαο γηα ηηο κεραλέο αλαδήηεζεο». Οη ζηαηηθέο ζειίδεο, ινηπφλ, είλαη πην θηιηθέο πξνο ηηο κεραλέο αλαδήηεζεο. Απηφ ζπκβαίλεη γηαηί ζηηο ζηαηηθέο ηζηνζειίδεο ππάξρεη δπλαηφηεηα ηνπνζέηεζεο ζηνλ θψδηθα html, ησλ meta tags ηα νπνία αλαγλσξίδνπλ νη κεραλέο αλαδήηεζεο θαη θαηαηάζζνπλ ηελ ζηαηηθή ζειίδα πάλσ απφ µηα δπλαµηθή πνπ δελ έρεη αθξηβψο απηή ηελ δπλαηφηεηα. Απηφ είλαη πνιχ ηζρπξφ πιενλέθηεκα ησλ ζηαηηθψλ ηζηνζειίδσλ, γηαηί έρεη άµεζε ζρέζε µε ηελ επηζθεςηµφηεηά ηνπο. Καη ε επηζθεςηµφηεηα ζε έλαλ ηζηφηνπν µπνξεί λα µεηαθξαζηεί ζε θέξδνο. Καη φπσο είλαη γλσζηφ, νη µεραλέο αλαδήηεζεο είλαη απηέο πνπ παξαπέµπνπλ ηνπο ρξήζηεο ζηηο ηζηνζειίδεο. Οπφηε φζν θαιχηεξα θαηαηαγµέλε είλαη ε ζειίδα ζηηο µεραλέο αλαδήηεζεο ζε δηάθνξεο ιέμεηο-θιεηδηά, ηφζν κεγαιχηεξν πιενλέθηεκα έρεη έλαληη ησλ αληαγσληζηψλ ηεο. ηελ αγνξά γίλεηαη ζθιεξή µάρε αλάµεζα ζηνπο SEO experts γηα δηάθνξεο ιέμεηο-θιεηδηά. Δίλαη αμηνζεµείσην, φηη µφλν ζηελ ειιεληθή αγνξά γηα ιέμεηο-θιεηδηά φπσο (fashion, gadgets, ξνχρα), γηα λα επηηεπρζεί ε πξψηε ζέζε ζηηο µεραλέο αλαδήηεζεο, δαπαλνχληαη µέρξη θαη 20 ρηιηάδεο επξψ. Γη απηέο ηηο θξάζεηο ζηελ παγθφζκηα αγνξά ηα πνζά εθηνμεχνληαη ζηα χςε. ηα θαηά µηαο ζηαηηθήο ηζηνζειίδαο είλαη φηη ρξήζηεο πξέπεη λα έρεη γλψζεηο πξνγξακκαηηζκνχ, γηα λα µπνξεί λα αλαλεψζεη ην πεξηερφµελν ηεο ζειίδαο. Κη απηφ γηαηί ζα πξέπεη λα επεκβαίλεη ζηνλ θψδηθα. ε µηα ζηαηηθή ηζηνζειίδα ν ρξήζηεο δελ έρεη θαλέλα είδνπο αιιειεπίδξαζε µε ηε ζειίδα θαη φπνηα άιια µκεηνλεθηήκαηα ζπλεπάγνληαη ζε απηφ. Η θαηαζθεπή µηαο ζηαηηθήο ηζηνζειίδαο απφ ηνπο web designers έρνπλ ρακειφηεξν θφζηνο, ζε ζρέζε µε ηηο δπλαµηθέο, θαη απηφ είλαη ινγηθφ γηαηί είλαη πην απιή ε θαηαζθεπή ηνπο Γςναμικέρ Ιζηοζελίδερ Οη δπλαµηθέο ηζηνζειίδεο πξνζαξκφδνπλ ην πεξηερφµελν ηνπο θαη ηελ εµθάληζή ηνπο ζχµθσλα µε ηελ θαηαρψξεζε/αιιειεπίδξαζε ή ηηο αιιαγέο ηνπ ηειηθνχ ρξήζηε ζην πεξηβάιινλ πξνγξακκαηηζκνχ (ρξήζηεο, ψξα, ηξνπνπνηήζεηο ζηε βάζε δεδνµέλσλ θηι.). Σν πεξηερφµελν µπνξεί λα αιιάδεη ζηνλ ππνινγηζηή ηνπ ηειηθνχ ρξήζηε µε ηε 15

16 ρξήζε ησλ γισζζψλ πξνγξακκαηηζκνχ πνπ εθηεινχληαη ζηνλ ππνινγηζηή ηνπ ρξήζηε (JavaScript, VBScript, Actionscript, etc.). Σν πεξηερφµελν ζηηο δπλαµηθέο ζειίδεο ζπρλά κεηαθξάδεηαη ζηνλ εμππεξεηεηή (server), πνπ εθεί απνζηέιιεηαη µέζσ ηνπ δηαθνµηζηή (Apache), µέζσ γισζζψλ πξνγξακκαηηζκνχ πνπ εθηεινχληαη ζηνλ εμππεξεηεηή (Perl, PHP, ASP, JSP, ColdFusion,.NET θηι). Πίζσ απφ δπλαµηθά websites θξχβνληαη πάληα βάζεηο δεδνµέλσλ (databases) φπνπ εθεί απνζεθεχνληαη δεδνµέλα θαη πιεξνθνξίεο ηνπ ελ ιφγσ website. Καη µε εληνιή ηνπ ρξήζηε ην website επηθνηλσλεί µε ηελ database απφ φπνπ ζα αληιήζεη ην πεξηερφµελν πνπ απαίηεζε λα δεη ν ρξήζηεο. Λφγσ ησλ databases θαζίζηαηαη εχθνιε ε πξνζζαθαίξεζε πεξηερνκέλνπ ζηηο δπλαµηθέο ηζηνζειίδεο, αθφµα θαη απφ ηνλ ρξήζηε επηζθέπηε ηεο ζειίδαο πνπ έρεη έιιεηςε ζε γλψζεηο πξνγξακκαηηζκνχ. ηφηη ζε µηα ζηαηηθή ζειίδα γηα λα αιιάμεη ή λα ηξνπνπνηήζεη θαλείο ην πεξηερφµελν ηεο ζειίδαο ζα πξέπεη λα επέµβεη ζηνλ θψδηθα. Άξα, πξέπεη λα μέξεη πξνγξακκαηηζκφ. Δλψ ζε µηα δπλαµηθή ζειίδα απιά πξέπεη λα μέξεη πσο λα δηαρεηξίδεηαη ην πεξηερφµελν ζηε βάζε δεδνµέλσλ θαη φια ηα ππφινηπα γίλνληαη απηνκαηνπνηεκέλα απφ ην πξφγξαµµα. πσο είπαµε νη ζηαηηθέο ζειίδεο είλαη απιά html έγγξαθα. Οη δπλαµηθέο ηζηνζειίδεο είλαη εθαξµνγέο - πξνγξάµµαηα. Γηα ηελ δεµηνπξγία ελφο δπλαµηθνχ site ρξεηάδνληαη πνιιέο-πνιιέο γξαµµέο θψδηθα πξνγξακκαηηζκνχ. Παξφιν φµσο πνπ είλαη ζρεηηθά δχζθνιν λα θαηαζθεπαζηεί έλα δπλαµηθφ site, είλαη εχθνιν λα δηαρεηξηζηεί θαη λα αλαλεσζεί. Δδψ είλαη θαη ην µεγάιν πιενλέθηεκα, έλαληη ησλ ζηαηηθψλ. Γηα λα µπνξεί έλαο απιφο ρξήζηεο επηζθέπηεο λα δηαρεηξίδεηαη (λα αιιάδεη, λα ηξνπνπνηεί ή λα δηαγξάθεη) ην πεξηερφµελν µηαο δπλαµηθήο ζειίδαο εχθνια, ρσξίο γλψζεηο πξνγξακκαηηζκνχ, ππάξρνπλ ηα CMS. Σα CMS (Content Management System) είλαη εχρξεζηνη µεραληζµνί δηαρείξηζεο πεξηερνκέλνπ. Έηζη, ζηελ πεξηνρή δηαρείξηζεο ηεο ζειίδαο, µπνξνχλ λα δηαρεηξηζηνχλ ην πεξηερφµελφ ηεο απιά µέιε, ζπληάθηεο, δηαρεηξηζηέο θ.α. Ο θαζέλαο έρεη ηνλ δηθφ ηνπ θσδηθφ πξφζβαζεο θαη ην ηη πξνλφµηα έρεη θαζψο θαη ην θαηά πφζν µπνξεί λα αιιάμεη ην πεξηερφµελν ηεο ζειίδαο, ην νξίδεη ν ππεξδηαρεηξηζηήο ηεο ζειίδαο. Κάπνηνο ζα επηιέμεη µηα δπλαµηθή ηζηνζειίδα αλ ζέιεη λα έρεη µηα δπλαµηθή παξνπζία ζην δηαδίθηπν. Αλ έρεη ζθνπφ λα αλαλεψλεη ζπρλά ην πεξηερφµελφ ηεο θαη λα ζέιεη λα έρεη απεξηφξηζην αξηζµφ δηαθνξεηηθψλ ζειίδσλ. ηα ππέξ είλαη φηη ην πεξηερφµελφ ηεο µπνξεί λα αλαλεσζεί θαη λα ηξνπνπνηεζεί απφ αλζξψπνπο πνπ δελ γλσξίδνπλ πξνγξακκαηηζκφ, ζε αληίζεζε µε ηηο ζηαηηθέο, φπνπ απηφ θαζίζηαηαη 16

17 αδχλαηνλ. Δπίζεο ζε µηα δπλαµηθή ηζηνζειίδα είλαη πνιχ εχθνιε ε δηαρείξηζε ρξεζηψλ, δηαρεηξηζηψλ θαη µειψλ ηεο ηζηνζειίδαο. ηα θαηά ελφο δπλαµηθνχ site είλαη αλακθίβνια ην θαηά πνιχ πςειφηεξν θφζηνο θαηαζθεπήο αιιά θαη ζπληήξεζεο, θαζψο ιφγσ ησλ µκεγαιχηεξσλ απαηηήζεσλ, απαηηεί πνιχ µεγαιχηεξν ρψξν θηινμελίαο ζε webserver. πλήζσο θνξηψλεη πην αξγά απφ µηα ζηαηηθή ζειίδα θαη γηα λα θαηαζθεπαζζεί µηα δπλαµηθή ζειίδα απφ θάπνηνλ web designer ή απφ θάπνηνλ πξνγξακκαηηζηή απαηηείηαη πνιχο ρξφλνο, γηαηί απαηηνχληαη πνιιέο ζεηξέο θψδηθα. Δλδείθλπληαη γηα µεγάιεο επηρεηξήζεηο πνπ ζέινπλ λα θηηάμνπλ ειεθηξνληθφ θαηάζηεµα (eshop), φπνπ ζα δηαζέηνπλ πξνο πψιεζε ηα πξντφληα ηνπο, γηα μελνδνρεία ηα νπνία ζέινπλ ν επηζθέπηεο λα θάλεη ειεθηξνληθέο θξαηήζεηο ησλ δσµαηίσλ ηνπο θαη γεληθφηεξα γηα µεγάια εηδεζενγξαθηθά portals ηα νπνία αλαλεψλνπλ ζπρλά ην πεξηερφµελφ ηνπο θαη ζέινπλ ν ρξήζηεο επηζθέπηεο λα γίλεηαη µέινο ζηε ζειίδα, λα αθήλεη ζρφιηα, λα ιαµβάλεη newsletter θαη γεληθφηεξα λα αιιειεπηδξά µε ηελ ζειίδα. εθεχξεζε ησλ δπλαµηθψλ ηζηνζειίδσλ απνηέιεζε ζηαζµφ ζηε πνξεία ηνπ internet. Με ηελ αλαθάιπςε απηή, πιένλ ν ρξήζηεο απφ απιφο αλαγλψζηεο ζα µπνξνχζε λα γίλεη µέινο ζε µηα ζειίδα, λα ηελ πξνζαξµφζεη ζηα µέηξα ηνπ, λα πξνζζέζεη ηηο δηθέο ηνπ πιεξνθνξίεο ζε απηή θαη γεληθψο µε ηηο δπλαµηθέο ηζηνζειίδεο δεκηνπξγήζεθαλ ηα µεγαιχηεξα ζε επηζθεςηµφηεηα ζεκεξηλά sites. Απηή ε αλαθάιπςε είρε ζεκαληηθφηαηεο επηπηψζεηο ζε δηάθνξνπο ηνµείο. Πιένλ πνιινί ζχιινγνη θαη νµάδεο έρνπλ µφλν δηαδηθηπαθή παξνπζία. Ιδίσο νη άλζξσπνη µε αλαπεξίεο µπνξνχλ λα θάλνπλ πξάγµαηα, πνπ δελ ζα µπνξνχζαλ λα ηα θάλνπλ µε άιινλ ηξφπν. 17

18 3. ΣΔΥΝΟΛΟΓΙΔ ΑΝΑΠΣΤΞΗ ΔΦΑΡΜΟΓΗ 3.1 Html και δημιοςπγία απσείυν Γενικά Σα αξρηθά HTML πξνέξρνληαη απφ ηηο ιέμεηο HyperText Markup Language. Η html δελ είλαη κηα γιψζζα πξνγξακκαηηζκνχ είλαη κηα γιψζζα ζήκαλζεο (markup language), δειαδή έλαο εηδηθφο ηξφπνο γξαθήο θεηκέλνπ. Ο θαζέλαο κπνξεί λα δεκηνπξγήζεη έλα αξρείν HTML ρξεζηκνπνηψληαο απιψο έλαλ επεμεξγαζηή θεηκέλνπ. Απνηειεί ππνζχλνιν ηεο γιψζζαο SGML (Standard Generalized Markup Language) πνπ επηλνήζεθε απφ ηελ IBM πξνθεηκέλνπ λα ιπζεί ην πξφβιεκα ηεο κε ηππνπνηεκέλεο εκθάληζεο θεηκέλσλ ζηα δηάθνξα ππνινγηζηηθά ζπζηήκαηα. Ο browser αλαγλσξίδεη απηφλ ηνλ ηξφπν γξαθήο θαη εθηειεί ηηο εληνιέο πνπ πεξηέρνληαη ζε απηφλ. Αμίδεη λα ζεκεησζεί φηη ε html είλαη ε πξψηε θαη πην δηαδεδνκέλε γιψζζα πεξηγξαθήο ηεο δνκήο κηαο ηζηνζειίδαο. Η html ρξεζηκνπνηεί ηηο εηδηθέο εηηθέηεο (ηα tags) λα δψζεη ηηο απαξαίηεηεο νδεγίεο ζηνλ browser. Σα tags είλαη εληνιέο πνπ ζπλήζσο νξίδνπλ ηελ αξρή ή ην ην ηέινο κηαο ιεηηνπξγίαο. Σα tags βξίζθνληαη πάληα κεηαμχ ησλ ζπκβφισλ < θαη >. Π.ρ. <BODY> Οη νδεγίεο είλαη case insensitive, δελ επεξεάδνληαη απφ ην αλ έρνπλ γξαθηεί κε πεδά (κηθξά) ή θεθαιαία. Έλα αξρείν HTML πξέπεη λα έρεη θαηάιεμε htm ή html. Γηα λα κπνξνχλ νη browser λα εξκελεχνπλ ζρεδφλ απφιπηα ζσζηά ηελ html έρνπλ ζεζπηζηεί θάπνηνη θαλφλεο. Απηνί νη θαλφλεο είλαη γλσζηνί σο πξνδηαγξαθέο. Δπνκέλσο ζρεδφλ θάζε είδνο ππνινγηζηή κπνξεί λα δείμεη ην ίδην θαιά κηα ηζηνζειίδα. Οη πξψηεο πξνδηαγξαθέο ήηαλ ε html 2.0. Πξφβιεκα πξνέθπςε φηαλ ε Μicrosoft θαη ε Νetscape πξφζζεζαλ ζηελ html ηέηνηεο δπλαηφηεηεο πνπ ζηελ αξρή ηνπιάρηζηνλ ήηαλ ζπκβαηέο κφλν κε ζπγθεθξηκέλνπο browser. Αθφκε θαη ζήκεξα ππάξρνπλ δηαθνξέο ζηελ απεηθφληζε θάπνηαο ζειίδαο απφ δηαθνξεηηθνχο browsers. Ιδηαίηεξν είλαη ην πξφβιεκα φηαλ ε ηζηνζειίδα, εθηφο απφ "θαζαξή" HTML πεξηιακβάλεη θαη εθαξκνγέο Javascript (ζα κηιήζνπκε αξγφηεξα γη απηή). ήκεξα πνιινί είλαη εθείλνη πνπ δεκηνπξγνχλ κηα ηζηνζειίδα ζε θάπνην πξφγξακκα πνπ επηηξέπεη ηελ δεκηνπξγία ρσξίο ηελ ζπγγξαθή θψδηθα. Η θνηλή άπνςε πάλσ ζην ζέκα φκσο είλαη φηη θάηη ηέηνην είλαη αξλεηηθφ επεηδή ν δεκηνπξγφο δελ έρεη ηνλ απφιπην έιεγρν ηνπ θψδηθα κε απνηέιεζκα πνιιέο θφξεο λα ππάξρεη νπηηθφ ράνο ζηελ πξνζπάζεηα ησλ browser λα εκθαλίζνπλ ηελ ηζηνζειίδα. Γηα ην ζθνπφ απηφ έρεη 18

19 δεκηνπξγεζεί εηδηθφ ινγηζκηθφ, πνπ επηηξέπεη ην "ζηήζηκν" ηεο ζειίδαο νπηηθά, ρσξίο ηε ζπγγξαθή θψδηθα, δίλεη φκσο ηε δπλαηφηεηα παξέκβαζεο ΚΑΙ ζηνλ θψδηθα. Υαξαθηεξηζηηθφ παξάδεηγκα ην ινγηζκηθφ Dreamweaver ηεο Adobe θαη ην FrontPage ηεο Microsoft. Γημιοςπγία απσείος Γηα ηελ δεκηνπξγία αξρείσλ πνπ ζα πεξηέρνπλ θψδηθα html αξθεί απιά λα αλνίμνπκε έλα notepad, λα γξάςνπκε ηνλ θψδηθα html κέζα θαη αιιάμνπκε ηελ θαηάιεμε ηνπ αξρείνπ ζε.html ή.htm θαη κεηά απιά αλνίγνπκε ην αξρείν κε θάπνηνλ browser γηα λα δνχκε ην απνηέιεζκα ηνπ θψδηθα καο. πλήζσο ρξεζηκνπνηνχκε ηελ επέθηαζε.html γηα ζπζηήκαηα UNIX. 3.2 Php H PHP (Hypertext PreProcessor) είλαη κηα γιψζζα γηα ηελ εγγξαθή script αξρείσλ πνπ καο βνεζνχλ ζηε δεκηνπξγία ζειίδσλ web κε δπλακηθφ πεξηερφκελν. Μέζα ζε κηα HTML ζειίδα κπνξείηε λα ελζσκαηψζεηε PHP θψδηθα, πνπ ζα εθηειείηαη ζηελ πιεπξά ηνπ server (server-side scripting). Η ζειίδα πνπ είλαη ζε PHP πεξλά απφ επεμεξγαζία απφ έλα ζπκβαηφ δηαθνκηζηή ηνπ Παγθφζκηνπ Ιζηνχ (π.ρ. Apache), ψζηε λα παξαρζεί ζε πξαγκαηηθφ ρξφλν ην ηειηθφ πεξηερφκελν, πνπ ζα ζηαιεί ζην πξφγξακκα πεξηήγεζεο ησλ επηζθεπηψλ ζε κνξθή θψδηθα HTML. Έλα παξάδεηγκα : <html> <head> <title>example</title > </head> <body> <?php echo "Hi, I'm a PHP script!";?> </body> </html> 19

20 Παξαηεξήζηε πσο απηφ είλαη δηαθνξεηηθφ απφ έλα script γξακκέλν ζε άιιεο γιψζζεο πξνγξακκαηηζκνχ φπσο ε Perl ή ε C. Αληί λα γξάθεηε έλα πξφγξακκα κε πνιιέο εληνιέο γηα λα εμάγεηε HTML, γξάθεηε έλα HTML script κε θάπνην ελζσκαησκέλν θψδηθα γηα λα θάλεη θάηη (ζε απηή ηελ πεξίπησζε, λα εκθαλίδεη θάπνην θείκελν). Ο θψδηθαο PHP είλαη εζψθιεηζηνο ζε εηδηθά tags (εηηθέηεο) αξρήο θαη ηέινπο πνπ ζαο επηηξέπνπλ λα κεηαθέξεζηε κέζα θαη έμσ απφ ην script ηεο PHP. Απηφ πνπ δηαρσξίδεη ηελ PHP απφ αληίζηνηρεο γιψζζεο (π.ρ. client-side Javascript) είλαη φηη ν θψδηθαο εθηειείηαη ζηνλ server (εμππεξεηεηή). Αλ είραηε έλα script ζαλ ην παξαπάλσ ζηνλ server ζαο, ν client ζα έπαηξλε ηα απνηειέζκαηα ηεο εθηέιεζεο απηνχ ηνπ script, ρσξίο λα ππάξρεη θαλέλαο ηξφπνο λα θαηαιάβεη ηη θψδηθαο ππάξρεη απφ θάησ. Μπνξείηε αθφκε λα ξπζκίζεηε ηνλ web server ζαο λα ρεηξίδεηαη φια ηα HTML αξρεία ζαο κε ηελ PHP, θαη ηφηε ν ρξήζηεο πξαγκαηηθά δελ ζα κπνξεί λα θαηαιάβεη κε πνηφλ ηξφπν ιεηηνπξγεί απηφ πνπ βιέπεη. Σα θαιχηεξν πξάγκα ζηελ PHP είλαη φηη είλαη εμαηξεηηθά απιή γηα έλα λέν πξνγξακκαηηζηή αιιά πξνζθέξεη πνιιά πξνεγκέλα ραξαθηεξηζηηθά γηα έλα επαγγεικαηία. Η καθξνζθειήο ιίζηα κε ηα ραξαθηεξηζηηθά ηεο PHP κπνξεί λα θαίλεηε θνπξαζηηθή θαη ηφζν κεγάιε ψζηε λα ζαο απνκαθξχλεη, αιιά αλ ηεο δψζεηε ιίγν ρξφλν κπνξείηε λα εμνηθεησζείηε γξήγνξα θαη λα αξρίζεηε λα γξάθεηε απιά script ζε ιίγεο ψξεο. Αλ θαη ε αλάπηπμε ηεο PHP εζηηάδεηαη ζε server-side scripting, κπνξείηε λα θάλεηε πνιχ πεξηζζφηεξα κε απηή. Έλα αξρείν κε θψδηθα PHP ζα πξέπεη λα έρεη ηελ θαηάιιειε επέθηαζε (π.ρ. *.php, *.php4, *.phtml θ.ά.). Η ελζσκάησζε θψδηθα ζε έλα αξρείν επέθηαζεο.html δελ ζα ιεηηνπξγήζεη θαη ζα εκθαλίζεη ζηνλ browser ηνλ θψδηθα ρσξίο θακία επεμεξγαζία, εθηφο αλ έρεη γίλεη ε θαηάιιειε ξχζκηζε ζηα MIME types ηνπ server. Δπίζεο αθφκε θη φηαλ έλα αξρείν έρεη ηελ επέθηαζε.php, ζα πξέπεη ν server λα είλαη ξπζκηζκέλνο γηα λα επεμεξγάδεηαη θψδηθα PHP. Ο δηαθνκηζηήο Apache, πνπ ρξεζηκνπνηείηαη ζήκεξα επξέσο ζε ζπζηήκαηα κε ηα ιεηηνπξγηθά ζπζηήκαηα Linux θαη Microsoft Windows, ππνζηεξίδεη εμ νξηζκνχ ηελ εθηέιεζε θψδηθα PHP. Η ηζηνξία ηεο PHP μεθηλά απφ ην 1995, φηαλ έλαο θνηηεηήο, ν Rasmus Lerdorf δεκηνχξγεζε ρξεζηκνπνηψληαο ηε γιψζζα πξνγξακκαηηζκνχ Perl έλα απιφ script κε φλνκα php.cgi, γηα πξνζσπηθή ρξήζε. Σν script απηφ είρε ζαλ ζθνπφ λα δηαηεξεί κηα ιίζηα ζηαηηζηηθψλ γηα ηα άηνκα πνπ έβιεπαλ ην online βηνγξαθηθφ ηνπ ζεκείσκα. Αξγφηεξα απηφ ην script ην δηέζεζε θαη ζε θίινπο ηνπ, νη νπνίνη άξρηζαλ λα ηνπ δεηνχλ λα πξνζζέζεη πεξηζζφηεξεο δπλαηφηεηεο. Η γιψζζα ηφηε νλνκαδφηαλ PHP/FI 20

21 απφ ηα αξρηθά Personal Home Page/Form Interpreter. Σν 1997 ε PHP/FI έθζαζε ζηελ έθδνζε 2.0, βαζηδφκελε απηή ηε θνξά ζηε γιψζζα C θαη αξηζκψληαο πεξηζζφηεξνπο απφ ηζηφηνπνπο πνπ ηε ρξεζηκνπνηνχζαλ, ελψ αξγφηεξα ηελ ίδηα ρξνληά νη Andi Gutmans θαη Zeev Suraski μαλαέγξαςαλ ηε γιψζζα απφ ηελ αξρή, βαζηδφκελνη φκσο αξθεηά ζηελ PHP/FI 2.0. Έηζη ε PHP έθζαζε ζηελ έθδνζε 3.0 ε νπνία ζχκηδε πεξηζζφηεξν ηε ζεκεξηλή κνξθή ηεο. ηε ζπλέρεηα, νη Zeev θαη Andi δεκηνχξγεζαλ ηελ εηαηξεία Zend (απφ ηα αξρηθά ησλ νλνκάησλ ηνπο), ε νπνία ζπλερίδεη κέρξη θαη ζήκεξα ηελ αλάπηπμε θαη εμέιημε ηεο γιψζζαο PHP. Αθνινχζεζε ην 1998 ε έθδνζε 4 ηεο PHP, ηνλ Ινχιην ηνπ 2004 δηαηέζεθε ε έθδνζε 5, ελψ απηή ηε ζηηγκή έρνπλ ήδε δηαηεζεί θαη νη πξψηεο δνθηκαζηηθέο εθδφζεηο ηεο επεξρφκελεο PHP 6, γηα νπνηνλδήπνηε πξνγξακκαηηζηή ζέιεη λα ηε ρξεζηκνπνηήζεη. Οη πεξηζζφηεξνη ηζηφηνπνη επί ηνπ παξφληνο ρξεζηκνπνηνχλ θπξίσο ηηο εθδφζεηο 4 θαη 5 ηεο PHP Πλεονεκηήμαηα ηηρ PHP ε ζχγθξηζε κε HTML, XML θαη ASP, ε PHP έρεη ηα δηθά ηεο πιενλεθηήκαηα. Απφδνζε: Έλα απφ ηα ζεκαληηθά ραξαθηεξηζηηθά ηεο PHP είλαη φηη κε ηε ρξήζε ελφο νηθνλνκηθνχ δηαθνκηζηή είλαη ζε ζέζε λα κπνξεί λα εμππεξεηήζεη εθαηνκκχξηα επηζθέπηεο. Δχθνιν ζηε ρξήζε: Οη Γηθηπαθνί ηφπνη πνπ έρνπλ ζρεδηαζηεί θαη θαηαζθεπαζηεί ζε PHP είλαη πην εχθνινη ζηε ρξήζε, ζε ζχγθξηζε κε απηνχο ηεο ASP ηεο Microsoft. H Php επηηξέπεη ζηνπο ρξήζηεο λα ζρεδηάζνπλ θαη λα αλαπηχμνπλ ηηο ηζηνζειίδεο θαηά ηελ θξίζε ηνπο. Απηφ δίλεη ηε δπλαηφηεηα ζηνπο ρξήζηεο λα ηξνπνπνηήζνπλ ηνπο ηζηνρψξνπο ηνπο ζχκθσλα κε ηηο πξνηηκήζεηο ηνπο. Δληζρχεη ηελ παξαγσγηθφηεηα ηεο επηρείξεζεο θαη κεηψλεη πνιχ ρξφλν θαηαλάισζεο κε ηαπηφρξνλε πξνψζεζε ησλ πξντφλησλ θαη ησλ ππεξεζηψλ καο ζην δηαδίθηπν. Αλνηθηφο-πεγή Γιψζζα: Η PHP είλαη έλα απφ ηα θαιχηεξα παξαδείγκαηα γηα αλνηθηή γιψζζα πεγή. Σν πιενλέθηεκα είλαη φηη ν πεγαίνο θψδηθαο ηεο PHP είλαη πάληα ζηε δηάζεζε ηνπ θνηλνχ. ε αληίζεζε, ηνλ πεγαίν θψδηθα ησλ πξντφλησλ, φπσο ASP ηεο Microsoft δελ κπνξεί λα βξεζεί ζην δεκφζην ηνκείο. Κξαηψληαο ηνλ πεγαίν θψδηθα δεκφζην, ζπκβάιιεη ζηελ αληαιιαγή θψδηθα 21

22 απφ έλα άηνκν ζε έλα άιιν γηα ηελ θαιχηεξε απφδνζε. Οη ζπιινγηθέο πξνζπάζεηεο έρνπλ πάληνηε σο απνηέιεζκα ηελ ηαρεία ηερλνινγηθή αλαβάζκηζε ζηελ πνηφηεηα ηνπ θψδηθα θαζψο θαη ηελ χπαξμε πνιιψλ βηβιηνζεθψλ κε πνιιά έγγξαθα πνπ λα παξέρνπλ ηελ πιήξε θαηαλφεζε ζρεηηθά κε ην πξντφλ ή ηελ ππεξεζία. Πξνζηαζία θαη Αζθάιεηα: Γπζηπρψο, ην Γηαδίθηπν δελ είλαη αζθαιέο κέξνο γηα ηε θηινμελία ησλ ζεκαληηθψλ δεδνκέλσλ. Μεξηθέο θνξέο είλαη πνιχ δχζθνιν γηα ηελ πξνζηαζία ησλ δεδνκέλσλ απφ ηε ρσξίο άδεηα ρξεζηψλ. Υάξε ζε έλα κηθξφ πνζνζηφ ησλ ρξεζηψλ πνπ βξίζθνπλ ηελ επραξίζηεζε ζηελ επίζεζε άιια ειεθηξνληθά. Οη επηζέζεηο απηέο νθείινληαη θπξίσο ζε δχν ιφγνπο. Γηα κεξηθνχο, είλαη έλαο πξνεηδνπνηεηηθφο παηρλίδη γηα λα βξνπλ ηηο ηξχπεο ζηνλ θψδηθά ζαο θαη λα εθκεηαιιεπηνχλ απηφ πξνο φθειφο ηνπο. Γηα άιινπο είλαη απιψο κηα δηαζθεδαζηηθή. Χζηφζν, ε αζθάιεηα ζην Γηαδίθηπν έρεη απνηειέζεη ζέκα ζπδήηεζεο. Χο εθ ηνχηνπ, ε αζθάιεηα ηνπ ππνινγηζηή σο ζχλνιν έπξεπε λα είλαη ζε θίλδπλν. Γηα ηα ηειεπηαία πνιιά ρξφληα, ε αζθάιεηα ζην Γηαδίθηπν δελ θαίλεηαη λα βειηηψλεηαη πνιχ. Η PHP έρεη πνιιαπιά επίπεδα αζθαιείαο θαη έηζη θάλεη πην δχζθνιε ηελ επίηεπμε κηαο πηζαλήο θαθφβνπιεο επίζεζεο. Γξεγνξφηεξε επεμεξγαζία: Η PHP ρξεζηκνπνηεί ηελ δηθή ηεο κλήκε θαη απηφ έρεη ζαλ απνηέιεζκα λα κεηψλεη ην ρξφλν πνπ απαηηείηε γηα ηελ θφξησζε θάπνηαο ζειίδαο. Η ηαρχηεηα επεμεξγαζίαο ηεο είλαη αξθεηά γξήγνξε θαη web εθαξκνγέο φπσο Ecommerce, CRM, CMS θαη Forums επεμεξγάδνληαη πην γξήγνξα απφ απηή. Τπνζηεξίδεη φια ηα είδε εγγξάθσλ: Δθηφο απφ ηελ ππνζηήξημε γηα multimedia, PHP δηθηπαθνχο ηφπνπο κπνξεί λα ππνζηεξίμεη απνηειεζκαηηθά θαη δηαθνξεηηθνχο ηχπνπο εγγξάθσλ, φπσο RTF, PDF, θιπ. Τπνζηήξημε γηα βάζεηο δεδνκέλσλ: Πνιινί άλζξσπνη πηζηεχνπλ φηη ε ζηήξημε ηεο βάζεο δεδνκέλσλ είλαη ην πην ζεκαληηθφ ραξαθηεξηζηηθφ φισλ. Πξάγκαηη, νη πξνγξακκαηηζηέο PHP έρνπλ θάλεη ηνλ θαιχηεξν εαπηφ ηνπο γηα ηελ παξνρή θαιχηεξεο ππνζηήξημεο γηα δηάθνξεο βάζεηο δεδνκέλσλ φπσο MySQL, dbase, IBM DB2, InterBase, FrontBase, ODBC, PostgreSQL, SQLite θαη πνιιέο άιιεο. 22

23 Τπνζηεξίδεη XML & HTML: Πνιινί απφ εκάο έρνπλ επίγλσζε ζρεηηθά κε ηα ζεκαληηθά ραξαθηεξηζηηθά γλσξίζκαηα ηεο XML θαη HTML. Έρνπλ πνιιά πιενλεθηήκαηα, είλαη αλαγλψζηκε απφ ηνλ άλζξσπν, cross-platform, θαη εχθνια λα κεηαηξαπνχλ ζε άιιεο κνξθέο. Δθηφο απφ φια ηα πιενλεθηήκαηα ηεο PHP πνπ αλαθέξνληαη αλσηέξσ, ε PHP ππνζηεξίδεη επξέσο φιεο ηηο πηπρέο ηεο HTML θφξκεο, αξρεία, θηλνχκελα ζρέδηα, ηαηλίεο, γξαθηθά, εηθφλεο θαη νχησ θαζεμήο. Χο εθ ηνχηνπ, PHP σο έλα open source γιψζζα πξνγξακκαηηζκνχ, αληηθαζηζηά εχθνια φιεο ηηο εκπνξηθέο εθαξκνγέο ζε φιεο ηηο πηπρέο ηεο ηερλνινγίαο. Η ρξήζε ηεο γίλεηαη πεξίπνπ δχν δεθαεηίεο θαη ρξεζηκνπνηείηαη επξέσο απφ ρηιηάδεο websites θαη πξνγξακκαηηζηέο θαη ε ρξήζε ηεο ζπλερίδεη λα απμάλεηε. Έρεη απνδεηρηεί ε ηθαλφηεηα θαη ε ηαρχηεηα επεμεξγαζίαο δεδνκέλσλ ηεο κε ην λα επεμεξγάδεηαη θαη λα ζπληεξεί κεξηθά απφ ηα πην δεκνθηιή site. χκθσλα κε κηα έξεπλα ηεο google ην 2007 γηα ηηο γιψζζεο πξνγξακκαηηζκνχ δηαδηθηχνπ: PHP, ASP, Perl, Python θαη JSP, ε ρξήζε ηεο PHP ήηαλ πξψηε κε δηαθνξά απφ ηηο ππφινηπεο. Εικόνα : Πίνακας αποηελεζμάηων από έρεσνα ηοσ Google 23

24 3.2.2.PhpMyAdmin Σν PhpMyAdmin είλαη έλα εξγαιείν γξακκέλν ζε Php ην νπνίν δηαρεηξίδεηαη ηελ MySQL ζην δίθηπν. Τπνζηεξίδεη κηα κεγάιε πνηθηιία ιεηηνπξγηψλ ηεο MySQL, MariaDB kai Drizzle. Μπνξεί λα ρεηξίδεηαη πιήξσο βάζεηο δεδνκέλσλ, πίλαθεο, πεδία πηλάθσλ αιιά θαη νιφθιεξν ηνλ MySQL Server. Τπνζηεξίδεη 47 γιψζζεο κεηαμχ ησλ νπνίσλ θαη ηα Διιεληθά θαη είλαη ινγηζκηθφ αλνηρηνχ θψδηθα. Οη δπλαηφηεηεο ηνπ PhpMyAdmin είλαη νη εμήο: Γεκηνπξγεί θαη λα δηαγξάθεη βάζεηο δεδνκέλσλ Γεκηνπξγεί, ηξνπνπνηεί, δηαγξάθεη, αληηγξάθεη θαη κεηνλνκάδεη πίλαθεο Κάλεη ζπληήξεζε ηεο βάζεο Πξνζζέηεη, δηαγξάθεη θαη ηξνπνπνηεί πεδία πηλάθσλ Δθηειεί Sql εξσηήκαηα, αθφκα θαη νκαδηθά (batch) Γηαρεηξίδεηαη θιεηδηά ζε πεδία Φνξηψλεη αξρεία θεηκέλνπ ζε πίλαθεο Γεκηνπξγεί θαη δηαβάδεη πίλαθεο (πνπ πξνέξρνληαη απφ dump βάζεο) Δμάγεη δεδνκέλα ζε κνξθή CVS, PDF, Word, XML Γηαρεηξίδεηαη πνιινχο δηαθνκηζηέο Γηαρεηξίδεηαη ηνπο ρξήζηεο MySQL θαη ηα δηθαηψκαηά ηνπο Διέγρεη ηελ αλαθνξηθή αθεξαηφηεηα ησλ δεδνκέλσλ ησλ MyISAM πηλάθσλ Γεκηνπξγεί PDF γξαθηθψλ ηνπ layout ηεο βάζεο δεδνκέλσλ Δθηειεί αλαδεηήζεηο ζε φιε ηε βάζε ή κέξνο απηήο Τπνζηεξίδεη πίλαθεο InnoDB θαη μέλα θιεηδηά Τπνζηεξίδεη MySQLi, κηα βειηησκέλε επέθηαζε ηεο MySQL Γεκηνπξγία βάζεο δεδνκέλσλ MySQL Δξγαιεία δηαρείξηζεο ηεο phpmyadmi n Εικόνα : Η κενηρική ζελίδα ηης phpmyadmin ζηο localhost μέζω ηοσ easyphp Δθδφζεηο ησλ εξγαιείσλ δηαρείξηζεο ηεο phpmyadmin 24

25 3.3 MySQL Η MySQL είλαη έλα ζχζηεκα δηαρείξηζεο ζρεζηαθήο βάζε αλνηθηνχ θψδηθα φπσο ιέγεηαη (relational database management system - RDBMS) πνπ ρξεζηκνπνηεί ηελ Structured Query Language (SQL), ηελ πην γλσζηή γιψζζα γηα ηελ πξνζζήθε, ηελ πξφζβαζε θαη ηελ επεμεξγαζία δεδνκέλσλ ζε κία Βάζε Γεδνκέλσλ. Δπεηδή είλαη αλνηθηνχ θψδηθα (open source), νπνηνζδήπνηε κπνξεί λα θαηεβάζεη ηελ MySQL θαη λα ηελ δηακνξθψζεη ζχκθσλα κε ηηο αλάγθεο ηνπ ζχκθσλα πάληα κε ηελ γεληθή άδεηα πνπ ππάξρεη. Η MySQL είλαη γλσζηή θπξίσο γηα ηελ ηαρχηεηα, ηελ αμηνπηζηία, θαη ηελ επειημία πνπ παξέρεη. Οη πεξηζζφηεξνη ζπκθσλνχλ σζηφζν φηη δνπιεχεη θαιχηεξα φηαλ δηαρεηξίδεηαη πεξηερφκελν θαη φρη φηαλ εθηειεί ζπλαιιαγέο. Η MySQL απηή ηε ζηηγκή κπνξεί λα ιεηηνπξγήζεη ζε πεξηβάιινλ Linux, Unix, θαη Windows. Τπνζηεξίδεη έλα ππνζχλνιν ηνπ Ansi SQL θαη πεξηιακβάλεη πνιιέο επεθηάζεηο. Μεξηθά ραξαθηεξηζηηθά γλσξίζκαηα: πνιπλεκαηψδεο. φιε ε θπθινθνξία θσδηθνχ πξφζβαζεο θξππηνγξαθείηαη. φιεο νη ζηήιεο πεξηιακβάλνπλ πξνθαζνξηζκέλεο ηηκέο. έιεγρνο θαη ηξνπνπνίεζε πηλάθσλ. ςεπδψλπκα πηλάθσλ θαη ζηειψλ ζχκθσλα κε ηα πξφηππα SQL92. κε δηαξξνή κλήκεο. φιεο νη ζπλελψζεηο (joins) γίλνληαη ζε έλα πέξαζκα. εγγξαθέο ζηαζεξνχ θαη κεηαβιεηνχ κήθνπο. 25

26 Γηεπαθέο: SQL, ODBC, C, Perl, JAVA, C++, Python, command line Μέζνδνη πξφζβαζεο: B-tree ζην δίζθν, hash tables ζηε κλήκε Πνιπρξεζηηθφ: Ναη Γνζνιεςίεο: Ναη, ππνζηεξίδεη θαη foreign key constraints Καηαλεκεκέλν: ρη, ππάξρεη ε δπλαηφηεηα γηα mirroring Γιψζζα Δξσηεκάησλ: SQL ξηα: Πάλσ απφ 32 indexes / table. Κάζε index απνηειείηαη απφ 1 έσο 16 ζηήιεο. Σν κέγηζην πιάηνο ηνπ index είλαη 500 bytes Αλζεθηηθφηεηα: Ο θψδηθαο ηνπ B-tree είλαη εμαηξεηηθά ζηαζεξφο, εθηθηή ε 24-σξε ιεηηνπξγία Τπνζηεξηδφκελεο Πιαηθφξκεο: BSDOS, SunOS, Solaris, Linux, IRIX, AIX, OSF1, BSD/OS, FreeBSD Πλεονεκηήμαηα ηηρ MySQL Μεξηθνί απφ ηνπο θχξηνπο αληαγσληζηέο ηεο MySQL είλαη νη PostgreSQL, Microsoft SQL θαη Oracle. H MySQL έρεη πνιιά πιενλεθηήκαηα, φπσο ρακειφ θφζηνο, εχθνιε δηακφξθσζε θαη κάζεζε θαη ν θψδηθαο πξνέιεπζεο είλαη δηαζέζηκνο. Απφδνζε. Η MySQL είλαη ρσξίο ακθηβνιία γξήγνξε. Μπνξείηε λα δείηε ηελ ζειίδα δνθηκψλ Πνιιέο απφ απηέο ηηο δνθηκέο δείρλνπλ φηη ε MySQL είλαη αξθεηά πην γξήγνξε απφ ηνλ αληαγσληζκφ. Υακειφ θφζηνο. Η MySQL είλαη δηαζέζηκε δσξεάλ, κε άδεηα αλνηθηνχ θψδηθα (Open Source) ή κε ρακειφ θφζηνο, αλ πάξεηε εκπνξηθή άδεηα, αλ απαηηείηαη απφ ηελ εθαξκνγή ζαο. Δπθνιία Υξήζεο. Οη πεξηζζφηεξεο κνληέξλεο βάζεηο δεδνκέλσλ ρξεζηκνπνηνχλ SQL. Αλ έρεηε ρξεζηκνπνηήζεη έλα άιιν ζχζηεκα δηαρείξηζεο βάζεσλ δεδνκέλσλ δελ ζα έρεηε πξφβιεκα λα πξνζαξκνζηείηε ζε απηφ. 26

27 Μεηαθεξζηκφηεηα. Η MySQL κπνξεί λα ρξεζηκνπνηεζεί ζε πνιιά δηαθνξεηηθά ζπζηήκαηα Unix φπσο επίζεο θαη ζηα Microsoft Windows. Κψδηθαο Πξνέιεπζεο. πσο θαη κε ηελ ΡΗΡ, κπνξείηε λα πάξεηε θαη λα ηξνπνπνηήζεηε ηνλ θψδηθα πξνέιεπζεο ηεο MySQL. Νέα έθδνζε. Η λέα έθδνζε MySQL 5 έρεη έξζεη κε λέεο εληππσζηαθέο ιεηηνπξγίεο. Δίλαη πιένλ ηθαλή λα ππνζηεξίμεη πνιχ κεγάια projects κε πςειή αμηνπηζηία. 3.4 JavaScript Η JavaScript είλαη γιψζζα πξνγξακκαηηζκνχ ε νπνία έρεη ζαλ ζθνπφ ηελ παξαγσγή δπλακηθνχ πεξηερνκέλνπ θαη ηελ εθηέιεζε θψδηθα ζηελ πιεπξά ηνπ πειάηε (clientside) ζε ηζηνζειίδεο. To πξφηππν ηεο γιψζζαο θαηά ηνλ νξγαληζκφ ηππνπνίεζεο ECMA νλνκάδεηαη ECMAscript. πσο θαη ε PHP, ε Javascript έρεη βαζηζηεί φζνλ αθνξά ηνλ ηξφπν ζχληαμεο ηνπ θψδηθά ηεο ζηε γιψζζα πξνγξακκαηηζκνχ C, κε ηελ νπνία παξνπζηάδεη πνιιέο νκνηφηεηεο. κσο ελψ ε PHP είλαη κηα server side γιψζζα πξνγξακκαηηζκνχ, ε Javascript είλαη client side. Απηφ ζεκαίλεη φηη ε επεμεξγαζία ηνπ θψδηθα Javascript θαη ε παξαγσγή ηνπ ηειηθνχ πεξηερνκέλνπ HTML δελ πξαγκαηνπνηείηαη ζηνλ server, αιιά ζην πξφγξακκα πεξηήγεζεο ησλ επηζθεπηψλ. Απηή ε δηαθνξά έρεη θαη πιενλεθηήκαηα θαη κεηνλεθηήκαηα γηα θαζεκηά απφ ηηο δχν γιψζζεο. πγθεθξηκέλα, ε Javascript δελ έρεη θακία απαίηεζε απφ πιεπξάο δπλαηνηήησλ ηνπ server γηα λα εθηειεζηεί (επεμεξγαζηηθή ηζρχ, ζπκβαηφ ινγηζκηθφ δηαθνκηζηή), αιιά βαζίδεηαη ζηηο δπλαηφηεηεο ηνπ browser ησλ επηζθεπηψλ. Δπίζεο κπνξεί λα ελζσκαησζεί ζε 27

28 ζηαηηθέο ζειίδεο HTML. Παξφια απηά, νη δπλαηφηεηέο ηεο είλαη ζεκαληηθά κηθξφηεξεο απφ απηέο ηεο PHP θαη δελ παξέρεη ζπλδεζηκφηεηα κε βάζεηο δεδνκέλσλ. Η Javascript δελ ζα πξέπεη λα ζπγρέεηαη κε ηε Java, πνπ είλαη δηαθνξεηηθή γιψζζα πξνγξακκαηηζκνχ θαη κε δηαθνξεηηθέο εθαξκνγέο. Σνλίδεηαη φηη ν ζσζηφο ηξφπνο γξαθήο ηεο είλαη "Javascript" θαη φρη 'Java script' ζαλ δχν ιέμεηο, φπσο ιαλζαζκέλα γξάθεηαη νξηζκέλεο θνξέο. Ο θψδηθαο Javascript κηαο ζειίδαο πεξηθιείεηαη απφ ηηο εηηθέηεο ηεο HTML <script language="javascript"> θαη </script>. Σελ απεηθφληζε θεηκέλνπ αλαιακβάλεη ε εληνιή document.write. Γηα παξάδεηγκα, ν αθφινπζνο θψδηθαο Javascript: <script language="javascript"> document.write('hello world!'); </script> Η JavaScript κνηάδεη πνιχ κε κηα θαλνληθή γιψζζα πξνγξακκαηηζκνχ θαζψο πεξηιακβάλεη: Αξηζκεηηθνχο ηχπνπο δεδνκέλσλ, φπσο αθέξαηνπο, θαζψο θαη strings. Έλα κεγάιν αξηζκφ ηειεζηψλ πνπ κπνξνχλ λα εθαξκνζηνχλ ζηνπο δηάθνξνπο ηχπνπο δεδνκέλσλ. Γνκέο ειέγρνπ, φπσο νη if θαη while. πλαξηήζεηο: θνκκάηηα θψδηθα πνπ κπνξνχλ λα θιεζνχλ επαλεηιεκκέλα θαη αλεμάξηεηα φπνηε ρξεηάδεηαη λα εθηειεζηεί ε ζπγθεθξηκέλε ιεηηνπξγία πνπ κέζνδνο πινπνηεί. Πίλαθεο πνπ πεξηέρνπλ ζπιινγέο δεδνκέλσλ. Απηφ πνπ ηελ μερσξίδεη πάλησο είλαη ε ηθαλφηεηα, ρξεζηκνπνηψληαο ηελ ηερλνινγία ηεο δπλακηθήο HTML (DHTML), λα αιιειεπηδξά κε ηα ζηνηρεία κίαο ηζηνζειίδαο, γηα παξάδεηγκα κπνξεί λα έρεη πξφζβαζε ζηα ζηνηρεία κηαο θφξκαο HTML ή λ' αιιάμεη ηελ εκθάληζε ελφο ζηνηρείνπ θεηκέλνπ. 28

29 3.5 CSS (Cascading Stylesheets) To CSS (Cascading Style Sheets = Δπηθαιππηφκελα θχιια ζηπι) είλαη κηα απιή γιψζζα πνπ καο βνεζάεη λα νξίζνπκε κε ζαθήλεηα θαη ηδηαίηεξε επειημία ηνλ ηξφπν κε ηνλ νπνίν ζα εκθαλίδνληαη ηα δηάθνξα ζηνηρεία ζηελ ηζηνζειίδα καο. ηε ζηήιε απηή ζα μεθηλήζνπκε απφ ηα βαζηθά ηνπ θαη ζηγά ζηγά ζα θηάζνπκε ζε αξθεηά πξνρσξεκέλα ζέκαηα ζρεηηθά κε απηφ. Έρεηε ππφςηλ φηη ε γλψζε βαζηθήο HTML είλαη απαξαίηεηε γηα ηελ θαηαλφεζε απηψλ ησλ άξζξσλ. Θα βξείηε κηα εηζαγσγή ζηελ HTML ζηηο πξνεγνχκελεο ζειίδεο απφ ηνλ Γηάλλε Καηζηψηε, αλ θαη γηα λα αμηνπνηήζεηε ηα άξζξα ζην κέγηζην, θαιφ ζα ήηαλ λα έρεηε αζρνιεζεί θαη πξνζσπηθά κε απηή Πλεονεκηήμαηα CSS ένανηι ηηρ μοπθοποίηζηρ μέζυ HTML attributes Πνιχ κεγαιχηεξε επειημία. Σν CSS θαηέζηεζε εθηθηέο κνξθνπνηήζεηο νη νπνίεο ήηαλ αδχλαηεο ή πνιχ δχζθνιεο κε ηελ θιαζζηθή HTML. Δπθνιφηεξε ζπληήξεζε ησλ ηζηνζειίδσλ. Η εκθάληζε ελφο νιφθιεξνπ site κπνξεί λα ειέγρεηαη απφ έλα κφλν εμσηεξηθφ αξρείν CSS. Έηζη, θάζε αιιαγή ζην ζηπι ηεο ηζηνζειίδαο κπνξεί λα γίλεηαη κε κηα κνλαδηθή αιιαγή ζε απηφ ην αξρείν, αληί γηα ηελ επεμεξγαζία πνιιψλ ζεκείσλ ζε θάζε ζειίδα πνπ ππάξρεη ζην site. Μηθξφηεξν κέγεζνο αξρείνπ, δεδνκέλνπ φηη ν θάζε θαλφλαο κνξθνπνίεζεο γξάθεηαη κφλν κηα θνξά θαη φρη ζε θάζε ζεκείν πνπ εθαξκφδεηαη. Καιχηεξν SEO (Search engine optimization). Οη κεραλέο αλαδήηεζεο δελ «κπεξδεχνληαη» αλάκεζα ζε πεξηερφκελν θαη ηε κνξθνπνίεζε ηνπ, αιιά έρνπλ πξφζβαζε ζην πεξηερφκελν ζθέην, νπφηε είλαη πνιχ επθνιφηεξν λα ην θαηαγξάςνπλ θαη λα ην αξρεηνζεηήζνπλ (indexing). Γξεγνξφηεξεο ζειίδεο. ηαλ ρξεζηκνπνηνχκε εμσηεξηθφ αξρείν CSS (βι. Πσο εηζάγνπκε CSS ζηε ζειίδα καο;), ν browser ηελ πξψηε θνξά πνπ ζα θνξηψζεη θάπνηα ζειίδα ηνπ site καο ην απνζεθεχεη ζηελ cache ηνπ, νπφηε δελ ρξεηάδεηαη λα ην θαηεβάζεη μαλά θάζε θνξά πνπ θαηεβάδεη ν ρξήζηεο ηνπ θάπνηα άιιε ζειίδα ηνπ site καο. 29

30 3.5.2.ύνηαξη CSS Έλαο «θαλφλαο» CSS απνηειείηαη απφ 2 κέξε: Σνλ επηινγέα (CSS selector) ν νπνίνο αθνξά ην ΣΙ ζα κνξθνπνηεζεί θαη ηηο ηδηφηεηεο (CSS properties) νη νπνίεο αθνξνχλ ην ΠΧ απηφ ζα κνξθνπνηεζεί. Η ζχληαμε ελφο CSS rule είλαη ε εμήο: επιλογέας { ιδιότητα1: τιμή1; ιδιότητα2: τιμή2; ιδιότητα3: τιμή3;... } Πσο εηζάγνπκε CSS ζηε ζειίδα καο; Μπνξνχκε λα εηζάγνπκε CSS ζηε ζειίδα καο κε ηξεηο δηαθνξεηηθνχο ηξφπνπο, αλαιφγσο ηελ πεξίπησζε. Οη ηξφπνη απηνί, θαηά ζεηξά θζίλνπζα πξνηεξαηφηεηαο, εμεηάδνληαη παξαθάησ: Ιnline CSS. Αλ επηζπκνχκε λα κνξθνπνηήζνπκε έλα ζηνηρείν κφλν, θαη δελ πξφθεηηαη λα ρξεηαζηνχκε απηφ ην είδνο κνξθνπνίεζεο γηα ηίπνηε άιιν ζην site, κπνξνχκε λα γξάςνπκε «ρχκα» (δει. ρσξίο ην θνκκάηη ηνπ CSS selector θαη ρσξίο αγθχιεο) CSS properties κέζα ζην attribute style, ην νπνίν ην δηαζέηεη ζρεδφλ θάζε ζηνηρείν html. Παξαδείγκαηνο ράξηλ, γηα λα θάλνπκε κηα ζπγθεθξηκέλε παξάγξαθν θφθθηλε, κπνξνχκε λα πξνζζέζνπκε style= color:red; ζηο <p> tag (ολοκληπωμένα: <p style= color:red; >). Αμίδεη λα ζεκεησζεί, φηη αλ θάπνηεο απφ ηηο ηδηφηεηεο πνπ ζα γξάςνπκε εληφο ηεο attribute style ελφο ζηνηρείνπ «ζπγθξνχνληαη» κε θαλφλεο CSS πνπ έρνπλ νξηζηεί γηα απηφ αιινχ θαη ην αθνξνχλ, ηφηε ν browser ζα επηιέμεη λα εθαξκφζεη απηά πνπ γξάςακε εληφο ηνπ attribute style, σο πην ζπγθεθξηκέλα γηα ην ζηνηρείν απηφ. CSS γηα κηα ζπγθεθξηκέλε ζειίδα 30

31 Πνιιέο θνξέο, κπνξεί λα ζέινπκε λα εθαξκφζνπκε θάπνηνπο θαλφλεο CSS κφλν γηα ηε ζπγθεθξηκέλε ζειίδα θαη φρη γηα φιν ην site (ή λα δηαθνξνπνηήζνπκε ζε θάπνηεο ηδηφηεηεο ηνπο ππάξρνληεο). Έλαο ηξφπνο λα ην θάλνπκε απηφ, γηα λα κελ δεκηνπξγήζνπκε μερσξηζηφ αξρείν CSS είλαη λα εηζάγνπκε εληφο ησλ tags <head>...</head> ηεο ζειίδαο ηνπο θαλφλεο CSS καο κέζα ζε <style> tags (κε ηελ html attribute type ηνπο ζε text/css). Παξαδείγκαηνο ράξηλ, γηα λα θάλνπκε ην ρξψκα γξακκάησλ κηαο ζπγθεθξηκέλεο ζειίδαο γθξη, ζα γξάθακε ζην head ηεο: <style type= text/css > body { color:gray; } </style> Αμίδεη λα ζεκεησζεί φηη ζπλήζσο φηαλ μεθηλάκε ηελ αλάπηπμε ελφο site, είλαη πην βνιηθφ λα ρξεζηκνπνηήζνπκε απηφ ηνλ ηξφπν, κηαο θαη πξέπεη λα επεμεξγαδφκαζηε κφλν έλα αξρείν αληί γηα δχν. ηαλ ηειεηψλνπκε ηελ πξψηε ζειίδα, ζπλήζσο κεηαθέξνπκε ην CSS πνπ έρνπκε γξάςεη ζε εμσηεξηθφ αξρείν (βι. παξαθάησ) ψζηε λα κπνξνχκε λα ρξεζηκνπνηήζνπκε ηνπο ίδηνπο θαλφλεο CSS θαη ζηηο άιιεο ζειίδεο ηνπ site καο, ρσξίο λα πξέπεη θπζηθά λα ηνπο θάλνπκε copy-paste ζε θάζε ζειίδα. Δμσηεξηθφ αξρείν CSS Η πην «ζσζηή» ρξήζε ηνπ CSS θαη απηή πνπ ζα έπξεπε λα είλαη ε πξψηε ιχζε ζηελ νπνία ζα θαηαθχγνπκε, είλαη ε ρξήζε εμσηεξηθνχ αξρείνπ CSS. Γηα λα ηε ρξεζηκνπνηήζνπκε, γξάθνπκε ηνπο θαλφλεο CSS καο ζε έλα αξρείν κε επέθηαζε css (πρ main.css) θαη εληφο ηνπ head ηεο θάζε ζειίδαο ηνπ site καο γξάθνπκε <link rel= stylesheet href= main.css type= text/css /> (αλ ην φλνκα ηνπ αξρείνπ CSS είλαη main.css, αιιηψο πξνθαλψο γξάθνπκε ην ζσζηφ φλνκα αξρείνπ). Αμίδεη λα ζεκεησζεί φηη κπνξνχκε λα έρνπκε πνιιά αξρεία CSS ζηελ ίδηα ζειίδα, θαη κεγαιχηεξε πξνηεξαηφηεηα έρεη πάληα απηφ πνπ έρεη γξαθηεί ηειεπηαίν. 3.6 Apache server 31

32 Ο Apache HTTP γλσζηφο θαη απιά ζαλ Apache είλαη έλαο εμππεξεηεηήο ηνπ παγθφζκηνπ ηζηνχ (web). πνηε έλαο ρξήζηεο επηζθέπηεηαη έλα ηζηφηνπν ην πξφγξακκα πινήγεζεο (browser) επηθνηλσλεί κε έλαλ δηαθνκηζηή (server) κέζσ ηνπ πξσηνθφιινπ HTTP, ν νπνίνο παξάγεη ηηο ηζηνζειίδεο θαη ηηο απνζηέιιεη ζην πξφγξακκα πινήγεζεο. O Apache είλαη έλαο απφ ηνπο δεκνθηιέζηεξνπο, ελ κέξεη γηαηί ιεηηνπξγεί ζε δηάθνξεο πιαηθφξκεο φπσο ηα Windows, ην Linux, ην Unix θαη ην Mac OS X. πληεξείηαη ηψξα απφ κηα θνηλφηεηα αλνηθηνχ θψδηθα κε επηηήξεζε απφ ην Ίδξπκα Λνγηζκηθνχ Apache (Apache Software Foundation). Εικόνα : Διακομιζηή βάζης δεδομένων Σν παξαπάλσ ζρήκα είλαη πνιχ απιφ κηαο θαη παξνπζηάδεη κφλν έλαλ δηαθνκηζηή βάζεο δεδνκέλσλ, κπνξεί λα ππάξρνπλ πνιινί πεξηζζφηεξνη κέζα ζ' έλα δίθηπν. Απηφ κπνξεί λα πεξηπιέμεη ζεκαληηθά ηνλ πξνγξακκαηηζκφ ελφο ηέηνηνπ ζπζηήκαηνο. Χζηφζν, είλαη ξεαιηζηηθφ γηα κηα κνληέξλα εθαξκνγή ειεθηξνληθνχ εκπνξίνπ. Ο Apache ρξεζηκνπνηείηαη θαη ζε ηνπηθά δίθηπα ζαλ δηαθνκηζηήο ζπλεξγαδφκελνο κε ζπζηήκαηα δηαρείξηζεο Βάζεο Γεδνκέλσλ π.ρ. Oracle, MySQL. Η πξψηε ηνπ έθδνζε, γλσζηή σο NCSA HTTP, δεκηνπξγήζεθε απφ ηνλ Robert McCool θαη θπθινθφξεζε ην Θεσξείηαη φηη έπαημε ζεκαληηθφ ξφιν ζηελ αξρηθή επέθηαζε ηνπ παγθφζκηνπ ηζηνχ. Ήηαλ ε πξψηε βηψζηκε ελαιιαθηηθή επηινγή πνπ παξνπζηάζηεθε απέλαληη ζηνλ εμππεξεηεηή http ηεο εηαηξείαο Netscape θαη απφ ηφηε έρεη εμειηρζεί ζην ζεκείν λα αληαγσλίδεηαη άιινπο εμππεξεηεηέο βαζηζκέλνπο ζην Unix ζε ιεηηνπξγηθφηεηα θαη απφδνζε. Απφ ην 1996 ήηαλ απφ ηνπο πην 32

33 δεκνθηιείο φκσο απφ ηνλ Μάξηην ηνπ 2006 έρεη κεησζεί ην πνζνζηφ ηεο εγθαηάζηαζήο ηνπ θπξίσο απφ ηνλ Microsoft Internet Information Services θαη ηελ πιαηθφξκα.net. Σνλ Οθηψβξην ηνπ 2007 ην κεξίδην ηνπ ήηαλ 47.73% απφ φινπο ηνπο ηζηνηφπνπο. Εικόνα : Δημοηικόηηηα ηοσ Apache ζε ζτέζη με παρόμοιοσς server με ηο πέραζμα ηοσ τρόνοσ Κάπνηα γεληθά ραξαθηεξηζηηθά γηα ην Apache είλαη ηα παξαθάησ: Unix treading: Τπνζηήξημε ζπζηεκάησλ Unix κε λήκαηα POSIX, φπνπ ν Apache κπνξεί λα ηξέρεη πνιιέο δηεξγαζίεο ηαπηφρξνλα. Υποζηήπιξη πολλαπλών ππωηοκόλλων: Τπνζηεξίδεη πην γξήγνξα θαη πην ζηαζεξά ιεηηνπξγηθά φπσο BeOS, OS/2 θαη Windows. Φίληπα: Τπνζηήξημε θίιηξσλ πνπ δηαλέκνληαη απφ θαη πξνο ηνπο δηαθνκηζηέο. Λάθη: Σα κελχκαηα ιαζψλ κπνξνχλ λα εκθαλίδνληαη ζε δηάθνξεο γιψζζεο. Απλοποιημένη παπαμεηποποίηζη: Έρνπλ απινπνηεζεί θάπνηα directives πνπ σο ηψξα ήηαλ θάπσο κπεξδεκέλα. Υποζηήπιξη unicode: Ο Apache 2 ζε Windows NT ρξεζηκνπνηεί κφλν utf 8 θσδηθνπνίεζε. Κανονικέρ εκθπάζειρ: Τπνζηήξημε ηεο βηβιηνζήθεο PCRE δειαδή φιεο νη θαλνληθέο εθθξάζεηο πνπ ππνζηεξίδεη ε Perl 5. 33

34 3.7 Adobe Dreamweaver To Dreamweaver απνηειεί ην θνξπθαίν πξφγξακκα δεκηνπξγίαο website θαη δηαδηθηπαθψλ εθαξκνγψλ, πξνζθέξεη δπλαηφηεηεο δεκηνπξγίαο πξνεγκέλσλ γξαθηθψλ, νπηηθά εξγαιεία πεξηγξάκκαηνο, ραξαθηεξηζηηθά αλάπηπμεο εθαξκνγψλ θαη ππνζηήξημε επεμεξγαζίαο θψδηθα κέζσ ελφο πεξηβάιινληνο ηερλνινγίαο αλεμαξηήηνπ πιαηθφξκαο. To Dreamweaver είλαη έλαο επεμεξγαζηήο HTML (Hypertext Markup Language) κέζα ζηνλ νπνίν κπνξνχκε λα δεκηνπξγήζνπκε κία ηνπνζεζία WEB ρσξίο λα ρξεηαζηεί λα δνχκε θαζφινπ ηελ γιψζζα HTML. Βέβαηα αλ ζέινπκε καο δίλεη ηελ δπλαηφηεηα αλά πάζα ζηηγκή λα ειέγρνπκε ηελ HTML ψζηε λα έρνπκε κία άπνςε γηα ην ηη γξάθεηαη εθεί. Μπνξνχκε λα δεκηνπξγήζνπκε ζηα γξήγνξα θφξκεο (forms), πιαίζηα (frames), πίλαθεο (tables) θαη άιια αληηθείκελα ηεο HTML. Μπνξεί λα ρξεζηκνπνηεζεί θαη γηα ηε δεκηνπξγία εθαξκνγψλ πνιπκέζσλ. Σν DreamWeaver έρεη δπλαηφηεηεο γηα δεκηνπξγία δπλακηθήο HTML (DHMTL) θαη επηηξέπεη θίλεζεο γξακκήο ρξφλνπ, απφιπηε ηνπνζέηεζε πεξηερνκέλσλ, δεκηνπξγία επηπέδσλ (layers) θαη ζπγγξαθή ζελαξίσλ (scripts). Σν DreamWeaver πεξηέρεη δηθέο ηνπ ζπκπεξηθνξέο (behaviors), πνπ είλαη έηνηκα scripts ηα νπνία κπνξνχκε λα πξνζζέζνπκε πνιχ εχθνια ζ έλα αληηθείκελν. 34

35 Δπίζεο είλαη εχρξεζην εξγαιείν αλάπηπμεο web εθαξκνγψλ, απνηειείηαη απφ πιήζνο παξαζχξσλ θαη ππνκελνχ. Τπνζηήξημε πνιιψλ δηαθνξεηηθψλ γισζζψλ πξνγξακκαηηζκνχ (PHP, ASP, JavaScript, CSS) θαζψο θαη νινθιεξσκέλε δηαρείξηζε ηζηνηφπνπ. Σέινο ην Dreamweaver ηεο Macromedia μεθίλεζε σο πξφγξακκα επεμεξγαζίαο θψδηθα HTML θαη έρεη πιένλ κεηαηξαπεί ζε κηα πνιχπινθε ζνπίηα δεκηνπξγίαο θάζε είδνπο sites, ζπκπεξηιακβάλνληαο ζην δπλακηθφ ηνπ ππνζηήξημε γηα δπλακηθέο ηερλνινγίεο (ASP, PHP). πλνπηηθά ην Dreamweaver: Δίλαη έλα πεξηβάιινλ ζπγγξαθήο ζηαηηθψλ ή δπλακηθψλ ζειίδσλ. Τπνζηεξίδεη αξθεηέο ηερλνινγίεο φπσο JSP, PHP, ASP, ColdFusion θ.α. Σφζν ν θψδηθαο, φζν θαη ε εκθάληζε ησλ ζειίδσλ κπνξνχλ λα επηζεσξεζνχλ. Γίλεηαη ζπληνληζκφο ηεο κεραλήο πινπνίεζεο κε ηνλ εμππεξεηεηή δνθηκψλ ή ηνλ εμππεξεηεηή δεκνζίεπζεο. Γηεπθφιπλζε ζπλεξγαζίαο κε άιινπο πξνγξακκαηηζηέο/ζρεδηαζηέο (check in/check out) 3.8 Adobe Photoshop Σν 1987 ν Σφκαο Κλνι, έλαο θνηηεηήο ηνπ Παλεπηζηεκίνπ ηνπ Μίζηγθαλ, αλέπηπμε έλα πξφγξακκα πνπ εκθάληδε εηθφλεο ζε απνρξψζεηο ηνπ γθξίδνπ (grayscale) ζε 35

36 κνλνρξσκαηηθφ πεξηβάιινλ. Απηφ ην πξφγξακκα, ην νπνίν νλφκαζε Display, ηξάβεμε ηελ πξνζνρή ηνπ αδεξθνχ ηνπ Σδνλ Κλνι, ν νπνίνο πξφηεηλε ζηνλ Σφκαο λα αλαπηχμεη έλα πιήξεο πξφγξακκα επεμεξγαζίαο εηθφλαο. Ο Σφκαο έθαλε δηάιεηκκα έμη κελψλ απφ ηηο ζπνπδέο ηνπ ην 1988 θαη, ζε ζπλεξγαζία κε ηνλ αδεξθφ ηνπ, αλέπηπμε ην πξφγξακκα, ην νπνίν νλφκαζαλ ImagePro. Αξγφηεξα ην ίδην έηνο, ν Σφκαο κεηνλφκαζε ην πξφγξακκα ηνπ ζε Photoshop θαη έπεηηα απφ ζπκθσλία κε ηελ θαηαζθεπάζηξηα εηαηξία ζαξσηψλ Barneyscan, ην πξφγξακκα δηαλεκήζεθε καδί κε κεξηθνχο ζαξσηέο. πλνιηθά δηαλεκήζεθαλ 200 αληίγξαθα ηνπ πξνγξάκκαηνο. Δλ ησ κεηαμχ, ν Σδνλ ηαμίδεςε ζην ίιηθνλ Βάιετ θαη παξνπζίαζε ην πξφγξακκα ηνπ ζηνπο κεραληθνχο ηεο Apple θαη ζηελ Adobe. Καη νη δχν παξνπζηάζεηο ήηαλ επηηπρείο, θαζψο ε Adobe απνθάζηζε λα αγνξάζεη ηελ άδεηα λα δηαλείκεη ην πξφγξακκα ηνλ επηέκβξην ηνπ Η επφκελε έθδνζε ηνπ πξνγξάκκαηνο, ε Photoshop 1.0, θπθινθφξεζε ην 1990 απνθιεηζηηθά γηα ζπζηήκαηα Macintosh θαη είρε κέγεζνο 1.44 MB. To Photoshop, είλαη έλα πξφγξακκα επεμεξγαζίαο γξαθηθψλ πνπ αλαπηχρζεθε θαη θπθινθφξεζε απφ ηελ Adobe Systems. Με ξηδνζπαζηηθά δεκηνπξγηθά εξγαιεία πνπ ζαο βνεζνχλ λα επηηχρεηε εμαηξεηηθά απνηειέζκαηα, ην Photoshop ελζσκαηψλεηαη κε πξσηνθαλή πξνζαξκνζηηθφηεηα ζηνλ ηξφπν πνπ δνπιεχεηε. Απηή ηε ζηηγκή απνηειεί εγέηε ηεο αγνξάο (market leader) ησλ πξνγξακκάησλ επεμεξγαζίαο εηθφλσλ, θαη είλαη ην πξντφλ - ζήκα θαηαηεζέλ ηεο Adobe Systems. Υαξαθηεξίδεηαη σο "απαξαίηεην εξγαιείν γηα ηνπο επαγγεικαηίεο γξαθίζηεο" θαη ζεσξείηαη πσο πξνψζεζε ηηο αγνξέο ησλ Macintosh, θαη ζηε ζπλέρεηα ησλ Windows. Πξφθεηηαη νπζηαζηηθά γηα έλα ζθνηεηλφ ζάιακν ζηνλ ππνινγηζηή. Με ην PhotoShop κπνξνχκε: Να ζπλζέζνπκε εηθφλεο (πξνζζήθε θεηκέλνπ, πξνζζήθε άιισλ εηθφλσλ, αιιαγή θφληνπ ή πιαηζίνπ). Να αιιάμνπκε ηελ αλάιπζε, ηηο δηαζηάζεηο ή ην πιήζνο ησλ ρξσκάησλ κηαο εηθφλαο. Να ηξνπνπνηήζνπκε ηελ θσηεηλφηεηα θαη ην θνληξάζη ηνπο. Να δεκηνπξγήζνπκε θσηνζθηάζεηο θαη πθέο κε δηάθνξα θίιηξα. Να δεκηνπξγήζνπκε δηάθαλα γξαθηθά γηα ην δίθηπν. 36

37 ηελ πξάμε νη δπλαηφηεηεο ηνπ PhotoShop είλαη αηειείσηεο, φπσο αηειείσηνη είλαη θαη νη δηαθνξεηηθνί ηξφπνη λα γίλεη κηα εξγαζία. Θα πξνζπαζήζνπκε λα πεξηγξάςνπκε ηνπο απινχζηεξνπο κε κεξηθά πξαθηηθά παξαδείγκαηα ζηελ ζπλέρεηα. 4. ΣΡΟΠΟ ΤΛΟΠΟΙΗΗ ΠΣΤΥΙΑΚΗ ΔΡΓΑΙΑ 4.1 Γημιοςπγία ηηρ Ιζηοζελίδαρ. Αξρηθά, ζα αλαθέξνπκε πσο γηα ηελ παξαθάησ πινπνίεζε ηεο εθαξκνγήο πνπ πεξηγξάθνπκε καο θάλεθαλ ρξήζηκα πιεξνθνξίεο πνπ αληιήζακε απφ ην internet (video, forum, e-library) θαη απφ βηβιία ζρεηηθνχ πεξηερνκέλνπ. Πξψην καο βήκα ήηαλ λα δεκηνπξγήζνπκε ην γξαθηθφ πεξηβάιινλ ηεο ηζηνζειίδαο ην νπνίν δεκηνπξγήζεθε φπσο θαίλεηαη ζηελ παξαθάησ εηθφλα. 37

38 Home Page: Εικόνα : Home Page Ο θψδηθαο πνπ ρξεζηκνπνηήζεθε γηα ηελ δεκηνπξγία ηεο αξρηθήο ζειίδαο θαίλεηαη παξαθάησ: 38

39 Φνξηψλνπκε ηα css θαη ηα js αξρεία πνπ ρξεηαδφκαζηε γηα ηε ζειίδα καο Φνξηψλνπκε ην logo ηεο ζειίδαο. Σνπνζέηεζε θεηκέλνπ αξρηθήο ζειίδαο. πσο βιέπνπκε θαη απφ ην home page έρνπκε ηξεηο επηπιένλ θαξηέιεο εθηφο ηνπ Home ηηο νπνίεο κπνξνχκε λα δνχκε θαη είλαη νη εμήο : Καρηέλα Signup: πνπ αξρηθά ζε απηή ηε θαξηέια δεηείηαη λα ζπκπιεξσζνχλ ηα ζηνηρεία ηνπ ελδηαθεξφκελνπ γηα εξγαζία φπσο είλαη φλνκα, επίζεην θηι έηζη ψζηε λα δεκηνπξγεζεί έλα πξνθίι. 39

40 Εικόνα : Μέρος α από ηο Sign Up Page Ο θψδηθαο γηα ηελ εηζαγσγή ζηνηρείσλ ηνπ ρξήζηε φπσο θαίλεηαη ζηελ παξαπάλσ εηθφλα είλαη : 40

41 Παξαηεξνχκε πσο ππάξρεη πεδίν φπνπ ν ρξήζηεο κπνξεί λα επηιέμεη ηνλ επαγγεικαηηθφ θιάδν πνπ ηνλ ελδηαθέξεη. Κψδηθαο απφ ην php αξρείν : 41

42 Κψδηθαο πνπ ηξέρεη γηα λα πάξνπκε ηα δεδνκέλα απφ ηε βάζε: ηελ ζπλέρεηα ηεο θαξηέιαο sign up ππάξρεη ε δπλαηφηεηα λα δειψζεη ν ρξήζηεο ην φλνκα θαη ην θάπνηνπ αηφκνπ πνπ κπνξεί λα ηνπ δψζεη ζπζηάζεηο. Δπίζεο κπνξεί λα επηζπλάςεη ην πξφγξακκά ηνπ φπνπ αλαγξάθνληαη νη δηαζέζηκεο θαη κε ψξεο ηνπ κέζσ ηνπ Google Calendar (Δθαξκνγή ηεο Google φπνπ δίλεηαη ε δπλαηφηεηα λα δεκηνπξγήζεη ν ρξήζηεο ην πξφγξακκα απαζρφιεζήο ηνπ). Δπηπιένλ, κπνξεί λα δειψζεη ηα ελδηαθέξνληα ηνπ φπσο θαη θαίλεηαη ζηελ επφκελε εηθφλα. 42

43 Εικόνα : Μέρος β από ηο Sign Up Page Κψδηθαο πνπ δεκηνπξγήζεθε : 43

44 JavaScript γηα ηα popup κελχκαηα Κείκελα επεμήγεζεο γηα ην πεξηερφκελν ησλ popup κελπκάησλ. ε πεξίπησζε πνπ ν ρξήζηεο πξνζπαζήζεη λα θάλεη signup κε ειιεηπή ζηνηρεία καο εκθαλίδεηε ε θαξηέια κε ηα πεδία πνπ είηε έρνπλ ζπκπιεξσζεί ιάζνο είηε είλαη θελά. 44

45 Καρηέλα Login : Η ρξήζε ηεο θαξηέιαο απηήο πξνυπνζέηεη ν ρξήζηεο λα έρεη δεκηνπξγήζεη ινγαξηαζκφ. Πιεθηξνινγεί ην username θαη ην password ηνπ ψζηε λα θάλεη εηζαγσγή θαη έπεηηα λα θάλεη εηζαγσγή ζην πξνθίι ηνπ. Εικόνα : Login Page 45

46 Ο θψδηθαο γηα ην login είλαη : Παηψληαο ην θνπκπί login δίλεηε ε εληνιή λα πξνζπειαζηεί ην αξρείν login_exec.php. Σππψλνπκε ηα ζθάικαηα πνπ ηπρψλ πξνθχςνπλ θαηά ην login. ε πεξίπησζε εηζαγσγήο ιάζνο ζηνηρείσλ ζε username θαη password καο εκθαλίδεη : πσο αλαθέξακε παξαπάλσ κε ην πάηεκα ηνπ θνπκπηνχ login εθηειείηαη ην αξρείν login_exec.php ζηε πεξίπησζε ηνπ error ν θψδηθαο είλαη : 46

47 Έλα παξάδεηγκα επηηπρεκέλνπ login θαίλεηαη παξαθάησ : Καρηέλα Search : ε απηή ηε θαξηέια κπνξεί ν θάζε ελδηαθεξφκελνο εξγνδφηεο λα ςάμεη δηαζέζηκα άηνκα πξνο εξγαζία αλάινγα κε ηνλ ηνκέα εξγαζίαο πνπ ελδηαθέξεηαη λα ηνπο απαζρνιήζεη. 47

48 Εικόνα : Search Page Ο θψδηθαο γηα ηελ ζειίδα ηνπ Search είλαη : ηαλ παηήζνπκε search ζα εθηειεζηεί ην αξρείν displayclients.php 48

49 Έζησ φηη έρνπκε θάλεη ηελ επηινγή γηα θάπνηα επαγγέικαηα γηα ηελ αλαδήηεζή καο. Σα απνηειέζκαηα πνπ εκθαλίδνληαη είλαη : Παξαηεξνχκε φηη απφ εδψ κπνξνχκε λα δνχκε ην profile ηνπ ρξήζηε Μαο εκθαλίδεη ινηπφλ φινπο ηνπο ελδηαθεξφκελνπο πξνο εξγαζία ρξήζηεο απν ηνπο επαγγεικαηηθνχο ηνκείο πνπ επηιέμακε θαηά ηελ αλαδήηεζε καο. 49

50 Ο θψδηθαο γηα ηα απνηειέζκαηα πνπ παίξλνπκε απφ ην Search : 50

51 Σα query γηα ηα απνηειέζκαηα ηνπ Search. Αλάγλσζε θαη ηχπσζε ησλ απνηειεζκάησλ ην Search ζηνλ πίλαθα. 51

52 Κψδηθαο γηα ηα css αξρεία πνπ δίλνπλ style ζηελ θάζε ζειίδα μερσξηζηά: Css γηα ην layout πνπ είλαη θνηλφ ζε φιεο ηηο ζειίδεο: 52

53 Css γηα ην style ηνπ login: 53

54 Css γηα ην search: 54

55 Css γηα ην signup form: 55

56 Css γηα ην displayclients: 56

57 Css γηα ην profile: 57

58 Η βάζε καο καδί κε ηα tables πνπ πεξηέρεη: Πίλαθαο ζπζρεηίζεσλ ηεο βάζεο: 58