Πεξηερόκελα. Πίνακασ περιεχομένων

Transcript

1 1

2 Πεξηερόκελα Πίνακασ περιεχομένων Πεξίιεςε :... 4 Abstract :... 5 ΚΕΦΑΛΑΙΟ 1 Ο - Βαζικέρ Έννοιερ (Ηλεκηπονικού Δμποπίος)... 6 Ση είλαη ην ειεθηξνληθφ εκπφξην... 6 Δίδε ειεθηξνληθνχ εκπνξίνπ:... 6 Σερλνινγίεο Ηιεθηξνληθνχ εκπνξίνπ :... 7 Πιενλεθηήκαηα ηνπ ειεθηξνληθνχ εκπνξίνπ γηα ηνλ θαηαλαισηή... 9 Πιενλεθηήκαηα ηνπ ειεθηξνληθνχ εκπνξίνπ γηα ηελ εηαηξία... 9 ΚΔΦΑΛΑΙΟ 2 Ο Βαζικέρ έννοιερ για ηην λειηοςπγία ηος Γιαδικηύος Παγθφζκηνο Ιζηφο (World Wide Web, WWW) Ο ηζηφηνπνο Domain Name Domain πςεινχ επηπέδνπ (TLD) Web browser (θπιινκεηξεηήο ηζηνζειίδσλ) Γηθηπαθφο Δμππεξεηεηήο ( Web Server ) Σερλνινγίεο θαη εξγαιεία αλάπηπμεο ηζηνζειίδσλ Πξσηφθνιιν HTTP Request κέζνδνη Τπεξθείκελν ( Hypertext) HTML (HyperText Markup Language) ΚΔΦΑΛΑΙΟ 3o - ΒΑΗ ΓΔΓΟΜΔΝΩΝ - ΓΛΩΔ ΠΡΟΓΡΑΜΜΑΣΙΜΟΤ ΣΔΥΝΟΛΟΓΙΔ CSS (Cascading Style Sheets) SQL Η ηζηνξία ηεο SQL MySQL Apache

3 PHP Η Ιζηνξία ηεο PHP PhpMyAdmin JavaScript AJAX XML Extended Markup Language ΚΔΦΑΛΑΙΟ 4 Ο Σι είναι ηο Framework και πώρ σπηζιμοποιείηαι Framework: CSS framework: ΚΕΦΑΛΑΙΟ 5 Ο Καηηγοπίερ Ιζηοζελίδων & Φιλοξενία ιζηοζελίδων ηαηηθέο Ιζηνζειίδεο Γπλακηθέο Ιζηνζειίδεο Φηινμελία ηζηνζειίδσλ ( Web Hosting ) Παθέηα Φηινμελίαο XAMPP ΚΔΦΑΛΑΙΟ 6 Ο Γημιοςπγία ηλεκηπονικού καηαζηήμαηορ Απαηηήζεηο ζπζηήκαηνο: Μνληέια: Views ή αιιηψο εηθφλεο ηζηφηνπνπ: Register: Log In: Καιάζη: ΠΑΡΑΡΣΗΜΑΣΑ - ΚΩΔΙΚΑ Κεληξηθή ζειίδα <<index>> (Παξάξηεκα 2) <<Brands Mobile>> (Παξάξηεκα 3) <<Search (Αλαδήηεζε)>> (Παξάξηεκα 4) <<Log in>> (Παξάξηεκα 5) <<Register>> (Παξάξηεκα 6) <<Contact us>> πκπεξάζκαηα ΒΙΒΛΙΟΓΡΑΦΙΑ

4 Πεξίιεςε : Η ζπγθεθξηκέλε πηπρηαθή εξγαζία έρεη σο ζέκα θαη ζθνπφ ηνλ ζρεδηαζκφ θαη ηελ αλάπηπμε ελφο ειεθηξνληθνχ θαηαζηήκαηνο (e-shop) κε είδε έμππλεο θηλεηήο ηειεθσλίαο (smart-phones). Σν πεξηβάιινλ ζα είλαη επράξηζην θαη θηιηθφ πξνο ηνλ πειάηε, ν νπνίνο ζα κπνξεί εχθνια λα πεξηεγεζεί, λα ελεκεξσζεί θαη λα δηαιέμεη ην πξντφλ πνπ επηζπκεί απφ ηελ κεγάιε γθάκα πξντφλησλ ηνπ θαηαζηήκαηνο. Η πξφζβαζε θάζε πειάηεο ηα πξντφληα ζα γίλεηαη κε άλεζε, αθνχ φια ζα είλαη νκαδνπνηεκέλα αλάινγα κε ηελ θαηεγνξία ηνπ θηλεηνχ. Γηα θάζε πξντφλ ζα ππάξρεη κηα ζχληνκε πεξηγξαθή, θσηνγξαθίεο, θαζψο θαη φια ηα ηερληθά ραξαθηεξηζηηθά κε δηεμνδηθή αλαθνξά ζε επηκέξνπο ιεπηνκέξεηεο. Έηζη,ν πειάηεο ζα κπνξεί λα έρεη ζθα ηξηθή άπνςε γηα ην πξντφλ πνπ αλαδεηά θαζψο θαη λα ζπγθξίλεη ηηο δπλαηφηεηεο ηνπ κε νπνηνδήπνηε άιιν. Αλ ν πειάηεο ςάρλεη γηα θάηη ζπγθεθξηκέλν, ρξεζηκνπνηψληαο ηελ εηδηθή θφξκα αλαδήηεζεο ζα νδεγεζεί θαηεπζείαλ ζηελ ζπγθεθξηκέλε επηινγή. Αθνχ ηειηθά επηιέμεη απηά πνπ ζέιεη, ηα ζπκπεξηιακβάλεη ζην θαιάζη ησλ αγνξψλ ηνπ. Καηφπηλ, γηα λα νινθιεξψζεη ηελ παξαγγειία ηνπ θαη λα πξνρσξήζεη ζηελ αγνξά ζα πξέπεη απαξαηηήησο λα είλαη κέινο ηνπ θαηαζηήκαηνο. Απηφ θπζηθά επηηπγράλεηαη κε κηα απιή εγγξαθή φπνπ ν πειάηεο απνθηά φλνκα ρξήζηε θαη θσδηθφ πξφζβαζεο. ε απηφ ην ζεκείν φιεο νη κεηαγελέζηεξεο ελέξγεηεο είλαη ηειείσο απινπζηεπκέλεο. Σα ζηνηρεία, δειαδή, είλαη απνζεθεπκέλα πάληα κεηά απφ θάζε είζνδν ηνπ πειάηε ζηνλ ινγαξηαζκφηνπ, νπφηε ε παξαγγειία γίλεηαη ζρεδφλ απηφκαηα. Η παξάδνζε ηνπ πξντφληνο γίλεηαη άκεζα θαη πάληα κε εγγχεζε πνηφηεηνο. Σν ειεθηξνληθφ θαηάζηεκα θαηαζθεπάζηεθε ζε κνξθή ηζηνηφπνπ. Γηα ην fontend ρξεζηκνπνηήζεθε HTML, CSS, θαη Javascript, ελψ γηα ηνλ πξνγξακκαηηζκφ ηνπ δηαθνκηζηή (back-end) ε γιψζζα πξνγξακκαηηζκνχ PHP. 4

5 Abstract : The subject and purpose of the following diploma thesis is the design and development of an e-shop dealing in smart-phones. The environment is going to be pleasant and userfriendly for the customer, who will be able to browse through it, get informed and choose the product they wish from the wide range of products sold by the e-shop. The customer will be able to access the products with considerable ease since they will be classified according to their distinct characteristics. For each product, there will be a short description, photographs, as well as a detailed reference to their technical characteristics. In this way, the customer will be enabled to form a concise opinion of the product they are interested in as well as compare the product's capabilities with any other product's. If the customer is searching for something specific, they will be able to find it by filling in a search form. After having selected what they want to buy, the customer will put them in their cart. After that, and in order for the customer to complete their order and their purchase, they will have to become members of the online store. This can be achieved by a simple subscription through which the customer obtains a user name and a password. After that, every subsequent step is simplified. The personal details of the customer are saved so every transaction the customer makes is done automatically after they access their personal account. The delivery of the product is made immediately and always with the quality guaranteed. The e-shop was designed as a website. For the font-end, HTML, CSS and Javascript have been used, while for the back-end programming PHP has been used. 5

6 ΚΕΦΑΛΑΙΟ 1 Ο - Βαζικέρ Έννοιερ (Ηλεκηπονικού Δμποπίος) Ση είλαη ην ειεθηξνληθό εκπόξην Ηιεθηξνληθφ εκπφξην είλαη θάζε είδνο εκπνξηθήο ζπλαιιαγήο κεηαμχ πξνζψπσλ (θπζηθψλ θαη κε) πνπ πξαγκαηνπνηείηαη κε ειεθηξνληθά κέζα. Δίλαη ε δηάζεζε θαη αγνξαπσιεζία πξντφλησλ ειεθηξνληθά, ε δηεθπεξαίσζε εκπνξηθψλ ιεηηνπξγηψλ θαη ζπλαιιαγψλ ρσξίο ηε ρξήζε ραξηηνχ, ζπλήζσο κέζσ δηθηχσλ ειεθηξνληθψλ ππνινγηζηψλ. Πξφθεηηαη γηα ηελ αγνξαπσιεζία αγαζψλ, πιεξνθνξηψλ θαη ππεξεζηψλ κέζα απφ δίθηπα ειεθηξνληθψλ ππνινγηζηψλ. Γηα ηελ πξαγκαηνπνίεζε κηαο ηέηνηαο ζπλαιιαγήο ρξεζηκνπνηνχληαη πνιχπινθνη πξνγξακκαηηζηηθνί κεραληζκνί θαη ην θαηάιιειν ινγηζκηθφ ην νπνίν επηηξέπεη ηελ Ηιεθηξνληθή Αληαιιαγή Γεδνκέλσλ (Electronic Data Interchange- EDI) αλάκεζα ζηηο δχν πιεπξέο (κεηαμχ επηρεηξήζεσλ αιιά θαη κεηαμχ επηρεηξήζεσλ θαη θαηαλαισηψλ) πνπ εκπιέθνληαη ζηε ζπγθεθξηκέλε ζπλαιιαγή. Είδε ειεθηξνληθνύ εκπνξίνπ: 1. Εζσηεξηθό εκπόξην (Intrabusiness EC) : Με ην εζσηεξηθφ εκπφξην γίλεηαη απνηειεζκαηηθφηεξε ε ιεηηνπξγία ησλ δξαζηεξηνηήησλ κηαο επηρείξεζεο, ψζηε λα έρεη ηελ δπλαηφηεηα λα πξνζθέξεη θαιχηεξα πξντφληα θαη ππεξεζίεο ζηνπο πειάηεο ηεο. ηελ θαηεγνξία απηή ζπκπεξηιακβάλνληαη φιεο νη εζσηεξηθέο δξαζηεξηφηεηεο κίαο επηρείξεζεο, νη νπνίεο ζπλήζσο δηελεξγνχληαη κέζα ζε ελδνεηαηξηθά δίθηπα θαη αθνξνχλ αληαιιαγή πξντφλησλ, ππεξεζηψλ θαη πιεξνθνξηψλ. 2. πλαιιαγέο κεηαμύ επηρεηξήζεσλ (Business-to-Business - B2B): Σν είδνο απηνχ ηνπ ειεθηξνληθνχ εκπνξίνπ δίλεη ηελ δπλαηφηεηα ζε επηρεηξήζεηο λα βειηηψζνπλ ηε κεηαμχ ηνπο ζπλεξγαζία, απινπνηψληαο ηηο δηαδηθαζίεο θαη ην θφζηνο ησλ πξνκεζεηψλ, ηελ ηαρχηεξε απνζηνιή ησλ πξνκεζεηψλ θαη ηνλ απνηειεζκαηηθφηεξν έιεγρν ηνπ επηπέδνπ απνζεκάησλ. Αθφκε θαζηζηά επθνιφηεξε ηελ αξρεηνζέηεζε ησλ ζρεηηθψλ εγγξάθσλ θαη πνηνηηθφηεξε ηελ εμππεξέηεζε πειαηψλ. Η δπλαηφηεηα ειεθηξνληθήο ζχλδεζεο κε πξνκεζεπηέο θαη δηαλνκείο, θαζψο θαη ε πξαγκαηνπνίεζε ειεθηξνληθψλ πιεξσκψλ βειηηψλνπλ αθφκε πεξηζζφηεξν ηελ απνηειεζκαηηθφηεηα: νη ειεθηξνληθέο πιεξσκέο πεξηνξίδνπλ ην αλζξψπηλν ζθάικα, απμάλνπλ ηελ ηαρχηεηα θαη κεηψλνπλ ην θφζηνο ησλ ζπλαιιαγψλ. Σν ειεθηξνληθφ εκπφξην πξνζθέξεη ηε δπλαηφηεηα απμεκέλεο πιεξνθφξεζεο ζρεηηθά κε ηα πξνζθεξφκελα πξντφληα - είηε απφ ηνπο πξνκεζεπηέο είηε απφ ελδηάκεζνπο νξγαληζκνχο πνπ πξνζθέξνπλ ππεξεζίεο ειεθηξνληθνχ εκπνξίνπ. 6

7 3. Ληαληθέο πσιήζεηο - Ηιεθηξνληθό εκπόξην κεηαμύ επηρείξεζεο θαη θαηαλαισηώλ (Business-to-Consumer - B2C): Δίλαη ε πην δηαδεδνκέλε κνξθή ειεθηξνληθνχ εκπνξίνπ. ηελ θαηεγνξία απηήλ πεξηιακβάλνληαη νη ζπλαιιαγέο ιηαληθήο πψιεζεο κε αλεμάξηεηνπο, κεκνλσκέλνπο θαηαλαισηέο. Ο θαηαλαισηήο έρεη πξφζβαζε ζε κηα ηεξάζηηα πνηθηιία πξντφλησλ ζε δηθηπαθνχο θφκβνπο-θαηαζηήκαηα, θαη κε ηελ άλεζε ηνπ ρσξίο ηελ πίεζε ρξφλνπ, βιέπεη, επηιέγεη, αλαθαιχπηεη πξντφληα, ζπγθξίλεη ηηκέο θαη ηέινο αγνξάδεη. 4. πλαιιαγέο κεηαμύ Καηαλαισηώλ (Consumer-to-Consumer - C2C): ε απηή ηελ θαηεγνξία ν θαηαλαισηήο πνπιά απεπζείαο ζε άιινπο θαηαλαισηέο. Παξάδεηγκα απνηεινχλ ηα άηνκα πνπ θάλνπλ πσιήζεηο κέζσ θαηαρσξεκέλσλ αγγειηψλ, δηθηπαθνί ηφπνη δεκνπξαζηψλ, φπνπ ν νπνηνζδήπνηε κπνξεί λα πνπιήζεη νηηδήπνηε. Σέινο, πνιιά άηνκα θάλνπλ ρξήζε intranets θαη άιισλ ελδνεηαηξηθψλ δηθηχσλ γηα λα δηαθεκίζνπλ αληηθείκελα, πξντφληα ή ππεξεζίεο. 5. Ηιεθηξνληθό εκπόξην θαηαλαισηή πξνο επηρείξεζε ( Consumer-to-business C2B ) : Απηή ε θαηεγνξία πεξηιακβάλεη θπξίσο άηνκα πνπ πσινχλ πξντφληα ή ππεξεζίεο ζε νξγαληζκνχο. Σερλνινγίεο Ηιεθηξνληθνύ εκπνξίνπ : Ηιεθηξνληθή Αληαιιαγή Γεδνκέλσλ (EDI - Electronic Data Interchange) Η EDI δεκηνπξγήζεθε ζηηο αξρέο ηεο δεθαεηίαο ηνπ '70 θαη είλαη κηα θνηλή δνκή αξρείσλ πνπ ζρεδηάζηεθε ψζηε λα επηηξέςεη ζε κεγάινπο νξγαληζκνχο λα κεηαδίδνπλ πιεξνθνξίεο κέζα απφ κεγάια ηδησηηθά δίθηπα. Πξφθεηηαη γηα ηελ ειεθηξνληθή αληαιιαγή εκπνξηθψλ θαη δηνηθεηηθψλ δεδνκέλσλ απφ ππνινγηζηή ζε ππνινγηζηή, κε ηελ ειάρηζηε παξέκβαζε ρεηξφγξαθσλ δηαδηθαζηψλ. Σα δεδνκέλα απηά είλαη νξγαλσκέλα ζε απηνηειή κελχκαηα (ηηκνιφγηα, παξαγγειίεο, ηηκνθαηάινγνη, θνξησηηθέο θιπ.), ην πεξηερφκελν θαη ε δνκή ησλ νπνίσλ θαζνξίδνληαη απφ θάπνην θνηλψο απνδεθηφ πξφηππν. Σν πξφηππν απηφ είλαη ην EDIFACT (EDI For Administration, Commerce and Transportation) θαη πξνέξρεηαη απφ ηνλ Οξγαληζκφ Ηλσκέλσλ Δζλψλ. Δπίπεδν Αζθαιψλ πλδέζεσλ (SSL - Secure Sockets Layer) : Σν πξσηφθνιιν απηφ ζρεδηάζηεθε πξνθεηκέλνπ λα πξαγκαηνπνηεί αζθαιή ζχλδεζε κε ηνλ εμππεξεηεηή (server). Σν SSL ρξεζηκνπνηεί "θιεηδί" δεκφζηαο θξππηνγξάθεζεο, κε ζθνπφ λα πξνζηαηεχεη ηα δεδνκέλα θαζψο "ηαμηδεχνπλ" ζην Internet. 7

8 Αζθαιείο Ηιεθηξνληθέο πλαιιαγέο (SET - Secure Electronic Transactions) : Σν SET θσδηθνπνηεί ηνπο αξηζκνχο ηεο πηζησηηθήο θάξηαο πνπ απνζεθεχνληαη ζηνλ εμππεξεηεηή ηνπ εκπφξνπ. Σν πξφηππν απηφ, πνπ δεκηνπξγήζεθε απφ ηε Visa θαη ηε MasterCard, απνιακβάλεη κεγάιεο απνδνρήο απφ ηελ ηξαπεδηθή θνηλφηεηα. Γξακκσηόο θώδηθαο (Barcode): Η ηερλνινγία ηνπ γξακκσηνχ θψδηθα απνηειεί ηκήκα ηνπ γεληθφηεξνπ ηνκέα ησλ ηερλνινγηψλ απηφκαηεο αλαγλψξηζεο (Auto ID Technologies). Δίλαη έλα ζχγρξνλν εξγαιείν, ην νπνίν βνεζά θαηαιπηηθά ζηελ νκαιή δηαθίλεζε θαη δηαρείξηζε (logistics) πξντφλησλ θαη ππεξεζηψλ. Έμππλεο θάξηεο (Smart Cards): Οη ''έμππλεο θάξηεο'' κπνξνχλ λα απνζεθεχζνπλ κεγάιε πνζφηεηα δεδνκέλσλ θαη παξέρνπλ δπλαηφηεηεο θξππηνγξάθεζεο θαη ρεηξηζκνχ ειεθηξνληθψλ ππνγξαθψλ γηα ηελ αζθάιεηα ησλ πεξηερνκέλσλ ηνπο. ήκεξα επηθξαηεί ε ιαλζαζκέλε εληχπσζε φηη νη Smart Cards είλαη ηξαπεδηθέο ή πηζησηηθέο θάξηεο, κε απνηέιεζκα λα κελ αλαγλσξίδεηαη ην κεγάιν εχξνο ησλ δπλαηνηήησλ ηνπο. Η ηερλνινγία ησλ έμππλσλ θαξηψλ πξνζθέξεη απεξηφξηζηεο δπλαηφηεηεο ρξήζεο ζηε βηνκεραλία, ην εκπφξην θαη ηε δεκφζηα δηνίθεζε. Πηζηνπνίεζε θαη αζθάιεηα : Γηα ηελ αζθάιεηα ησλ ειεθηξνληθψλ ζπλαιιαγψλ ρξεζηκνπνηνχληαη επξέσο ηα firewalls. Έλα firewall επηηξέπεη ζηνπο εζσηεξηθνχο ρξήζηεο λα έρνπλ πιήξε πξφζβαζε ζηηο παξερφκελεο ππεξεζίεο, ελψ νη εμσηεξηθνί ρξήζηεο πξέπεη λα πηζηνπνηεζνχλ. Τπάξρνπλ πνιινί ηχπνη firewalls, θαζέλαο απφ ηνπο νπνίνπο παξέρεη δηαθνξεηηθά επίπεδα πξνζηαζίαο. Ο ζπλεζέζηεξνο ηξφπνο ρξεζηκνπνίεζεο ελφο firewall είλαη ε ηνπνζέηεζε ελφο ππνινγηζηή ή δξνκνινγεηή κεηαμχ ζπγθεθξηκέλνπ δηθηχνπ θαη ηνπ Internet, θαη ε παξαθνινχζεζε φιεο ηεο θπθινθνξίαο κεηαμχ ηνπ εμσηεξηθνχ θαη ηνπ ηνπηθνχ δηθηχνπ. Η εκπηζηεπηηθή πιεξνθνξία πνπ δηαθηλείηαη ζην δίθηπν κπνξεί λα πξνζηαηεπζεί κε θξππηνγξάθεζε θαη ρξήζε κπζηηθψλ θσδηθψλ. Η αζθάιεηα ηνπ ειεθηξνληθνχ εκπνξίνπ βαζίδεηαη θαηεμνρήλ ζηελ θξππηνγξάθεζε, δειαδή ζηελ θσδηθνπνίεζε ηνπ κεηαδηδφκελνπ θεηκέλνπ θαηά ηέηνην ηξφπν ψζηε λα κπνξεί λα απνθξππηνγξαθεζεί κφλν κε ηε ρξήζε ηνπ εηδηθνχ θιεηδηνχ απνθξππηνγξάθεζεο. Η θξππηνγξάθεζε ζπλνδεχεηαη πνιιέο θνξέο θαη απφ ηελ ςεθηαθή ππνγξαθή ηνπ απνζηνιέα, έηζη ψζηε ν παξαιήπηεο λα κπνξεί λα βεβαησζεί γηα ηελ ηαπηφηεηα ηνπ πξψηνπ. 8

9 Πιενλεθηήκαηα ηνπ ειεθηξνληθνύ εκπνξίνπ γηα ηνλ θαηαλαισηή Γίλεη ηελ δπλαηφηεηα ζηνλ θαηαλαισηή λα δηελεξγεί αγνξέο θαη άιιεο ζπλαιιαγέο 24 ψξεο ην 24σξν απφ φπνπ θαη αλ βξίζθεηε. Δπηηξέπεη ηελ ζπκκεηνρή ζε ειεθηξνληθέο δεκνπξαζίεο Δπαθή κε ειεθηξνληθέο θνηλφηεηεο θαηαλαισηψλ κε ζθνπφ ηελ αληαιιαγή ηδεψλ θαη εκπεηξηψλ. Η αγνξά είλαη παγθφζκηα. Πξάγκα πνπ ζεκαίλεη φηη κπνξνχκε λα αγνξάζνπκε θάηη ην νπνίν δελ θπθινθνξεί ζηελ Διιάδα. Η ζπλαιιαγή είλαη γξήγνξε θαη άκεζε ρσξίο θνχξαζε θαη ζπαηάιε ρξφλνπ. Σν θφζηνο ησλ πξντφλησλ πνπ πσινχληαη κέζσ internet είλαη ρακειφηεξν απφ ηηο ηηκέο ζην εκπφξην, αθνχ έλα ειεθηξνληθφ θαηάζηεκα απαηηεί πνιχ ιηγφηεξν πξνζσπηθφ θαη είλαη απαιιαγκέλν απφ κεγάιν κέξνο ηνπ ιεηηνπξγηθνχ θφζηνπο ελφο πξαγκαηηθνχ θαηαζηήκαηνο. Γηεπθνιχλεη ηνλ αληαγσληζκφ κε απνηέιεζκα ηελ πεξεηαίξσ κείσζε ησλ ηηκψλ. Πιενλεθηήκαηα ηνπ ειεθηξνληθνύ εκπνξίνπ γηα ηελ εηαηξία Δμάπισζε ηεο αγνξάο ζε εζληθφ θαη παγθφζκην επίπεδν κε ειάρηζην ιεηηνπξγηθφ θφζηνο Η εηαηξεία πνπ ρξεζηκνπνηεί ηηο λέεο ηερλνινγίεο θαη ελεκεξψλεηαη γηα ηηο ηξέρνπζεο εμειίμεηο γίλεηαη εμ νξηζκνχ πην αληαγσληζηηθή. Γηαηήξεζε ρακειψλ απνζεκάησλ θαη βηνκεραληθψλ εμφδσλ κε ηελ εηζαγσγή ηεο δηνίθεζεο εθνδηαζηηθήο αιπζίδαο pull (Just In Time). Μείσζε ηνπ ρξφλνπ ηνπνζέηεζεο ελφο πξντφληνο ζηελ αγνξά θαη ηνπ ρξφλνπ δέζκεπζεο θεθαιαίσλ. Βειηίσζε ηεο δεκφζηαο εηθφλαο κηαο επηρείξεζεο. Βειηίσζε ηνπ επηπέδνπ εμππεξέηεζεο ησλ πειαηψλ. Μείσζε ησλ κεηαθνξηθψλ δαπαλψλ. 9

10 ΚΔΦΑΛΑΙΟ 2 Ο Βαζικέρ έννοιερ για ηην λειηοςπγία ηος Γιαδικηύος Παγθόζκηνο Ιζηόο (World Wide Web, WWW) Δίλαη πνιινί απηνί πνπ λνκίδνπλ φηη νη φξνη Γηαδίθηπν θαη Παγθφζκηνο Ιζηφο είλαη ηαπηφζεκνη. Η αιήζεηα φκσο είλαη φηη ν Παγθφζκηνο ηζηφο ( World Wide Web ή WWW ) είλαη έλα κέξνο ηνπ Γηαδηθηχνπ. Απνηειεί σζηφζν ην κεγαιχηεξν, δεκνθηιέζηεξν θαη ην ηαρχηεξα αλαπηπζζφκελν θνκκάηη ηνπ. πγθεθξηκέλα, ν Παγθφζκηνο Ιζηφο είλαη ην κέζν γηα ηελ εχθνιε αλάθηεζε ηνπ ηεξάζηηνπ φγθνπ πιεξνθνξηψλ πνπ δηαηίζεληαη κέζσ ηνπ Γηαδηθηχνπ. Υξεζηκνπνηεί έλα απφ ηα πξσηφθνιια ηνπ δηαδηθηχνπ, ην HyperText Transfer Protocol ( HTTP). Ο ηζηόηνπνο Έλαο ηζηφηνπνο, ηζηνρψξνο ή δηαδηθηπαθφο ηφπνο (web site) είλαη κία ζπιινγή απφ ηζηνζειίδεο, εηθφλεο, βίληεν θαη άιια ςεθηαθά ζηνηρεία, ηα νπνία θηινμελνχληαη ζην ίδην domain (πεξηνρή) ηνπ Παγθφζκηνπ Ιζηνχ νη νπνίεο ζπλδένληαη κεηαμχ ηνπο κε ππεξζπλδέζεηο (Hyperlinks). Βαζίδεηαη ζηελ ππεξεζία www (world wide web - παγθφζκηνο ηζηφο), κηα απφ ηηο ππεξεζίεο πνπ παξέρνληαη ζην Γηαδίθηπν, κε ηε ρξεζηκνπνίεζε ηνπ πξσηνθφιινπ http. Η ππεξεζία απηή δίλεη ηε δπλαηφηεηα ζηνπο ρξήζηεο ηνπ ηληεξλέη λα δεκηνπξγήζνπλ νπνηνπδήπνηε είδνπο πεξηερφκελν ζηηο ηζηνζειίδεο ηνπο. Σν ζχλνιν ησλ ηζηνηφπσλ απνηειεί ην world wide web (www). Η ππεξεζία www ζηεξίδεηαη ζηε ζχξα (port) 80 θαη γη' απηφ κηα ηζηνζειίδα κπνξεί λα έρεη θαη ηε κνξθή Domain Name Όλνκα ρψξνπ ή ηνκέα ή πεξηνρήο (domain name) ζην Γηαδίθηπν είλαη έλαο πεξηνξηζκέλνο ηνκέαο ησλ δηεζλψλ πφξσλ ηνπ πζηήκαηνο Ολνκάησλ Υψξνπ (DNS) ν νπνίνο εθρσξείηαη γηα απνθιεηζηηθή ρξήζε ζε έλα θπζηθφ ή λνκηθφ πξφζσπν. Σν φλνκα ηνκέα / ρψξνπ δελ αλήθεη ζην πξφζσπν πνπ ηνπ έρεη εθρσξεζεί αιιά έρεη κφλν ηελ απνθιεηζηηθή δπλαηφηεηα ρξήζεο ηνπ γηα φζν δηάζηεκα έρεη θαηαβάιεη ηα ηέιε θαηνρχξσζεο. Σν domain name είλαη ε δηεχζπλζε πνπ δίλεηε ζηνλ browser γηα λα πάκε ζε θάπνην website, γξακκέλε κε ηξφπν θαηαλνεηφ γηα ηνλ άλζξσπν. Σν domain name αλαθέξεηαη ζηελ "πξαγκαηηθή" δηεχζπλζε ηνπ server πνπ πεξηέρεη ην θάζε website. Η δηεχζπλζε απηή, θαιείηαη IP δηεχζπλζε θαη είλαη κηα ζεηξά απφ λνχκεξα, π.ρ πκπεξαζκαηηθά, ην domain name αληηπξνζσπεχεη ηελ IP δηεχζπλζε, ε νπνία είλαη ε δηεχζπλζε φπνπ βξίζθνληαη ηα αξρεία ηνπ website ζαο ζηνλ server. 10

11 Domain πςεινύ επηπέδνπ (TLD) Έλα domain πςεινχ επηπέδνπ (top level), είλαη κέξνο ηνπ domain name θαη βξίζθεηαη ζηα δεμηά ηεο ηειείαο ("."). Σα πην γλσζηά Ltd είλαη ηα:.com,.org,.net,.biz,.info,.name,.ws. Τπάξρνπλ θαη εμαηξέζεηο φπσο ηα απζηεξά.aero,.biz,.mil,.museum,.name,.pro. Δπίζεο, ππάξρνπλ θαη Ltd γεσγξαθηθήο ζεκαζίαο φπσο γηα ηα domains απφ Διιάδα, ε θαηάιεμε.gr θιπ. Web browser (θπιινκεηξεηήο ηζηνζειίδσλ) Έλαο Web browser (θπιινκεηξεηήο ηζηνζειίδσλ) είλαη έλα ινγηζκηθφ πνπ επηηξέπεη ζηνλ ρξήζηε ηνπ λα πξνβάιιεη θαη λα αιιειεπηδξά κε, θείκελα, εηθφλεο, βίληεν, κνπζηθή, παηρλίδηα θαη άιιεο πιεξνθνξίεο ζπλήζσο αλαξηεκέλεο ζε κηα ηζηνζειίδα ελφο ηζηφηνπνπ ζηνλ Παγθφζκην Ιζηφ ή ζε έλα ηνπηθφ δίθηπν. Σν θείκελν θαη νη εηθφλεο ζε κηα ηζηνζειίδα κπνξεί λα πεξηέρνπλ ππεξζπλδέζκνπο πξνο άιιεο ηζηνζειίδεο ηνπ ίδηνπ ή δηαθνξεηηθνχ ηζηφηνπνπ. Ο Web browser επηηξέπεη ζηνλ ρξήζηε ηελ γξήγνξε θαη εχθνιε πξφζβαζε ζε πιεξνθνξίεο πνπ βξίζθνληαη ζε δηάθνξεο ηζηνζειίδεο θαη ηζηφηνπνπο ελαιιάζζνληαο ηηο ηζηνζειίδεο κέζσ ησλ ππεξζπλδέζκσλ. Οη θπιινκεηξεηέο ρξεζηκνπνηνχλ ηε γιψζζα κνξθνπνίεζεο HTML γηα ηελ πξνβνιή ησλ ηζηνζειίδσλ, γηα απηφ ε εκθάληζε κηαο ηζηνζειίδαο κπνξεί λα δηαθέξεη αλάινγα κε ηνλ browser. Γηα θάζε browser δηαηίζεληαη θαη αξθεηά πξφζζεηα ζηνηρεία («add-ons» ή «plug-ins»), κε ζηφρν ηελ επαχμεζε ησλ δπλαηνηήησλ ηνπο, ηε βειηίσζε ηεο ρξεζηηθφηεηάο ηνπο θαη ηελ πξνζηαζία ηνπ ρξήζηε ζε ζέκαηα αζθάιεηαο. Οη πεξηζζφηεξν ρξεζηκνπνηνχκελνη browsers είλαη νη : Windows Internet Explorer Mozilla Firefox 24 Apple Safari Opera Google Chrome Δηθηπαθόο Εμππεξεηεηήο ( Web Server ) Γηα λα κπνξέζεη λα ιεηηνπξγήζεη θαη λα είλαη πξνζβάζηκνο έλαο ηζηφηνπνο, απαξαίηεηε πξνυπφζεζε είλαη λα είλαη απνζεθεπκέλνο ζε θάπνην Web Server. Μέζσ ηνπ Web Server γίλεηαη ε δεκνζίεπζε κηαο ηζηνζειίδαο ζην δηαδίθηπν. Οη θπξηφηεξνη ηχπνη δηθηπαθψλ εμππεξεηεηψλ είλαη : Ο Apache πνπ ζπλήζσο ρξεζηκνπνηεί ιεηηνπξγηθφ ζχζηεκα Linux, ν ISS πνπ ρξεζηκνπνηεί ιεηηνπξγηθφ ζχζηεκα Windows θαη ν Nginx πνπ ρξεζηκνπνηεί νπνηνδήπνηε ιεηηνπξγηθφ ζχζηεκα. Σν πνζνζηφ ρξήζεο ηνπο απφ ηζηνηφπνπο παγθνζκίσο είλαη 65,5 %, 18,0 % θαη 11,6 % αληίζηνηρα. 11

12 Σερλνινγίεο θαη εξγαιεία αλάπηπμεο ηζηνζειίδσλ Πξσηόθνιιν HTTP To HTTP είλαη ε ζπληνκνγξαθία ηεο αγγιηθήο θξάζεο < HyperText Transfer Protocol>. Δίλαη έλα πξσηφθνιιν πνπ θαζνξίδεη ηνλ ηξφπν κε ηνλ νπνίν ζα γίλεη ε κεηαθνξά ηνπ ππεξθεηκέλνπ (hypertext) κεηαμχ δχν ή πεξηζζνηέξσλ ππνινγηζηψλ. Αλάιπζε ηνπ HTTP Σν Πξσηφθνιιν Μεηαθνξάο Τπεξθεηκέλνπ (HyperText Transfer Protocol, HTTP) ιεηηνπξγεί ζην επίπεδν Δθαξκνγήο θαη είλαη ην πξσηφθνιιν κεηαθνξάο ηνπ Web, ν ππξήλαο ηνπ. Σν πξσηφθνιιν απηφ ρξεζηκνπνηείηαη απφ ηελ ζπγθεθξηκέλε ππεξεζία ηνπ δηθηχνπ Internet απφ ην Σν HTTP πινπνηείηαη ζε δπν πξνγξάκκαηα: έλα πξφγξακκα πειάηε (ν θπιινκεηξεηήο - browser) θαη έλα πξφγξακκα εμππεξέηε. Σν πξφγξακκα πειάηε θαη ην πξφγξακκα εμππεξέηε, πνπ εθηεινχληαη ζε δηαθνξεηηθά ηεξκαηηθά ζπζηήκαηα, ζπλνκηινχλ κεηαμχ ηνπο αληαιιάζζνληαο κελχκαηα HTTP. Σν HTTP νξίδεη ηελ δνκή απηψλ ησλ κελπκάησλ θαη ην πψο ν πειάηεο θαη ν εμππεξέηεο αληαιιάζζνπλ ηα κελχκαηα. Σν HTTP νξίδεη πσο νη πειάηεο Web δεηνχλ ηζηνζειίδεο απφ ην Web θαη πσο νη εμππεξέηεο κεηαθέξνπλ ηζηνζειίδεο ζε πειάηεο. Όηαλ ν ρξήζηεο δεηάεη κηα ηζηνζειίδα, ην πξφγξακκα πεξηήγεζεο ζηέιλεη κελχκαηα αίηεζεο HTTP γηα ηα αληηθείκελα ηεο ζειίδαο, ζηνλ εμππεξέηε. Ο εμππεξέηεο δέρεηαη αηηήζεηο θαη απνθξίλεηαη κε κελχκαηα απφθξηζεο HTTP, ηα νπνία πεξηέρνπλ ηα αληηθείκελα. Σν ζεκαληηθφηεξν ίζσο ραξαθηεξηζηηθφ ηνπ πξσηνθφιινπ απηνχ είλαη φηη επηηξέπεη ζηα δηάθνξα ζπζηήκαηα κεηάδνζεο δεδνκέλσλ λα πθίζηαληαη αλεμάξηεηα απφ ηα δεδνκέλα πνπ απηά κεηαθέξνπλ. Σν HTTP ρξεζηκνπνηεί ην TCP σο ππνθείκελν πξσηφθνιιν κεηαθνξάο (αληί εθηέιεζεο UDP). Ο πειάηεο HTTP εθθηλεί πξψηα κηα ζχλδεζε TCP κε ηνλ εμππεξέηε. Όηαλ απνθαηαζηαζεί ε ζχλδεζε, νη δηεξγαζίεο ηνπ πξνγξάκκαηνο πεξηήγεζεο θαη ηνπ εμππεξέηε πξνζπειαχλνπλ ην TCP κέζσ ησλ δηεπαθψλ socket ηνπο. Ο εμππεξέηεο HTTP δέρεηαη κελχκαηα αηηήζεσλ απφ ηε δηεπαθή socket ηνπ θαη ζηέιλεη κελχκαηα απφθξηζεο ζηελ δηεπαθή socket ηνπ. Δίλαη γλσζηφ φηη ην TCP παξέρεη κηα ππεξεζία αμηφπηζηεο κεηαθνξάο δεδνκέλσλ ζην HTTP. Απηφ ππνλνεί φηη θάζε κήλπκα αίηεζεο HTTP πνπ εθπέκπεηαη απφ κηα δηεξγαζία πειάηε θηάλεη ηειηθά αλέπαθν ζηνλ εμππεξέηε. Παξφκνηα, θάζε κήλπκα απφθξηζεο HTTP πνπ εθπέκπεηαη απφ ηελ δηεξγαζία εμππεξέηε θηάλεη ηειηθά αλέπαθν ζηνλ πειάηε. Σν πξσηφθνιιν HTTP παξέρεη πξφζβαζε θαη ζε άιια πξσηφθνιια πνπ ρξεζηκνπνηνχληαη ζην Internet, κεηαμχ ησλ νπνίσλ ηα αθφινπζα: File Transfer Protocol (FTP) Simple Mail Transfer Protocol (SMTP) Network News Transfer Protocol (NNTP) Telnet and TN

13 Request κέζνδνη Σν πξσηφθνιιν HTTP νξίδεη νθηψ κεζφδνπο κε ηηο νπνίεο κπνξεί λα γίλεη κηα αίηεζε απνζηνιήο ηνπ επηζπκεηνχ πεξηερνκέλνπ. ηελ πξάμε βέβαηα ρξεζηκνπνηνχληαη θπξίσο νη 2 απφ απηέο, ε POST θαη ε GET. GET Πξαγκαηνπνηεί αίηεζε γηα ιήςε δεδνκέλσλ ζχκθσλα κε ηελ επηζπκία ηνπ ρξήζηε. POST Πξαγκαηνπνηεί απνζηνιή δεδνκέλσλ πξνο επεμεξγαζία (πρ κηα θφξκα html) ζηνλ επηζπκεηφ εμππεξεηεηή. Σα δεδνκέλα εκπεξηέρνληαη ζην ζψκα ηνπ κελχκαηνο. PUT «Αλεβάδεη» δεδνκέλα επηζπκεηνχ πεξηερνκέλνπ ζηελ επηζπκεηή ηνπνζεζία 28 HEAD Γνπιεχεη φπσο ε κέζνδνο GET, κε ηε δηαθνξά φηη κε ηελ HEAD δελ ιακβάλνπκε ην ζψκα ηνπ κελχκαηνο. Δίλαη ρξήζηκε θπξίσο γηα ηελ ιήςε meta-information πεδίσλ, ηα νπνία εκπεξηέρνληαη ζηνπο headers ηνπ request κελχκαηνο. DELETE Πξαγκαηνπνηεί αίηεζε γηα δηαγξαθή ηνπ επηζπκεηνχ πεξηερνκέλνπ TRACE Δπηζηξέθεη ηελ ιεθζείζα http request (δειαδή ηνλ εαπηφ ηεο) έηζη ψζηε θάπνηνο λα κπνξεί λα πνηνη δηαθνκηζηέο κεηαβάινπλ ηηο http request αηηήζεηο ηνπ, πξηλ απηέο θηάζνπλ ζηνλ ηειηθφ πξννξηζκφ ηνπο. OPTIONS Δπηζηξέθεη φιεο ηηο ππνζηεξηδφκελεο http κεζφδνπο πνπ ππνζηεξίδεη ν δεδνκέλνο δηαθνκεζηήο. CONNECT Υξεζηκνπνηείηαη κφλν γηα proxy πνπ ππνζηεξίδεη SSL tunnel. Έλαο http server ζα πξέπεη λα πινπνηεί ηνπιάρηζηνλ ηηο κεζφδνπο GET θαη HEAD. 13

14 Τπεξθείκελν ( Hypertext) Σν ππεξθείκελν (hypertext) είλαη ηξφπνο νξγάλσζεο πιεξνθνξηψλ (πνπ βξίζθνληαη ζε κνξθή θεηκέλνπ) ν νπνίνο ππεξβαίλεη έλαλ βαζηθφ πεξηνξηζκφ ησλ ππαξρφλησλ κέζσλ νξγάλσζεο : ηεο γξακκηθφηεηάο ηνπο. Σν ππεξθείκελν ζεσξείηαη κε γξακκηθφ θείκελν ζε αληίζεζε κε ην βηβιίν πνπ ζεσξείηαη γξακκηθφ. Σν παξαδνζηαθφ θείκελν, είηε απηφ είλαη ηππσκέλν είηε κε ηε κνξθή αξρείσλ ελφο ππνινγηζηή, είλαη γξακκηθφ ή αιιηψο ζεηξηαθφ, ην νπνίν απιά ζεκαίλεη φηη ππάξρεη έλαο κνλαδηθφο ηξφπνο πνπ νξίδεη ηε ζεηξά κε ηελ νπνία ην θείκελν ζα δηαβαζηεί. Ο αλαγλψζηεο νθείιεη λα δηαβάδεη ηε κία ζειίδα (ή παξάγξαθν) κεηά ηελ άιιε πξνθεηκέλνπ λα θαηαλνήζεη ην πεξηερφκελφ ηνπ, δίρσο λα ηνπ δίδεηαη ε δπλαηφηεηα λα "πινεγείηαη" ειεχζεξα εληφο απηνχ. Ο αλαγλψζηεο έηζη αλαγθάδεηαη λα ππαθνχζεη ζηνπο πεξηνξηζκνχο πνπ επηβάιιεη ν ζπγγξαθέαο θαη ην βηβιίν σο κέζν. Σν ππεξθείκελν σο κέζν έξρεηαη λα μεπεξάζεη ηνπο πεξηνξηζκνχο απηνχο επηηξέπνληαο ηελ ειεχζεξε πινήγεζε ηνπ αλαγλψζηε. Η πινήγεζε επηηπγράλεηαη κε ηελ ρξήζε ππεξζπλδέζκσλ. Δπεηδή νη ππεξζχλδεζκνη απνηεινχλ ηνλ θχξην κεραληζκφ απφθιηζεο απφ ηε γξακκηθφηεηα απνηεινχλ ζεκειηψδε έλλνηα ζην ππεξθείκελν. Ωο ηξφπνο νξγάλσζεο, ην ππεξθείκελν ζπλαληηέηαη θπξίσο ζην ρψξν ησλ ππνινγηζηψλ θαη ηεο Πιεξνθνξηθήο. Ο Παγθφζκηνο ηζηφο ρηίζηεθε πάλσ ζηηο ηδέεο ηνπ ππεξθεηκέλνπ θαη απνηειεί κία ελζάξθσζε (πινπνίεζε) ηέηνηνπ ηξφπνπ δηαζχλδεζεο θαη νξγάλσζεο πιεξνθνξηψλ. Ωζηφζν, νη επηπηψζεηο ηεο ππέξβαζεο ησλ πεξηνξηζκψλ απηψλ δελ είλαη απηνλφεηεο, νχηε ηεηξηκκέλεο. Όπσο αθξηβψο ε κεηάβαζε απφ ηνπο παπχξνπο ζην βηβιίν επέθεξε αιιαγέο ζηνλ ηξφπν ζπγγξαθήο, αλάγλσζεο θαη θαηαλφεζεο έηζη θαη ε κεηάβαζε απφ ην βηβιίν ζην ππεξθείκελν έρεη επηπηψζεηο ζε έλα ζχλνιν θαζηεξσκέλσλ θαη δεδνκέλσλ ελλνηψλ νη νπνίεο απαηηνχλ επαλαδηαπξαγκάηεπζε. Γηα παξάδεηγκα, ε δηαρσξηζηηθή γξακκή κεηαμχ αλαγλψζηε θαη ζπγγξαθέα ε νπνία ζηελ πεξίπησζε ηνπ βηβιίνπ είλαη πνιχ ζαθήο θαη κε ηελ νπνία ν άλζξσπνο είλαη εμνηθεησκέλνο ηα ηειεπηαία 500 ρξφληα, ζηελ πεξίπησζε ηνπ ππεξθεηκέλνπ αξρίδεη θαη ράλεηαη ζε ζεκείν λα θαηαξγεζεί. Ωο κέζν, απνηειεί έλα λέν εξγαιείν ζηελ αλζξψπηλε αλάγθε γηα δηαηχπσζε, επηθνηλσλία θαη θαηαλφεζε ζθέςεσλ θαη ηδεψλ. Ο φξνο ππεξθείκελν εηζήρζε απφ ηνλ Σελη Νέιζνλ ην 1965 ζην έξγν ηνπ Literary Machines Η επέθηαζε ηνπ ππεξθεηκέλνπ, πξνθεηκέλνπ λα ελζσκαησζνχλ ηχπνη πιεξνθνξηψλ πέξαλ ηνπ θεηκέλνπ, φπσο εηθφλα, ήρνο θαη βίληεν θαιείηαη ππεξκέζα. Δπεηδή ην ππεξθείκελν εζηηάδεη θπξίσο ζηελ δηαζχλδεζε ησλ πιεξνθνξηψλ θαη δίδεη ιίγε πξνζνρή ζην θαζεαπηφ πεξηερφκελν, νη φξνη "ππεξθείκελν" θαη "ππεξκέζα" ζεσξνχληαη πνιιέο θνξέο ηζνδχλακνη, παξφηη ν φξνο ππεξκέζν ρξεζηκνπνηείηαη γηα ηε δηαζχλδεζε φρη κφλν θεηκέλνπ. Σν ππεξθείκελν (Hypertext) είλαη εηδηθά θσδηθνπνηεκέλν κε ηε ρξήζε ελφο ζπζηήκαηνο πνπ νλνκάδεηαη Hypertext Markup Language (HTML). 14

15 HTML (HyperText Markup Language) H html δελ είλαη γιψζζα πξνγξακκαηηζκνχ. Δίλαη γιψζζα ζήκαλζεο (markup language) ζηελ νπνία ζηεξίρηεθε ην δεκηνχξγεκα ηνπ World Wide Web. Αλαθαιχθηεθε απφ ηελ IBM, ε νπνία ήζειε λα ιχζεη ην πξφβιεκα ηεο γηα κε ηππνπνηεκέλε εκθάληζε θεηκέλσλ ζηα δηάθνξα ππνινγηζηηθά ηεο ζπζηήκαηα. Html ππάξρεη θαη ζηηο δπλακηθέο θαη ζηηο ζηαηηθέο ηζηνζειίδεο. Βαζηθφ ζηνηρείν ηεο HTML απνηεινχλ νη ζχλδεζκνη (links) πνπ κπνξεί λα δεκηνπξγήζεη, δειαδή ζπγθεθξηκέλα ηκήκαηα ηνπ πεξηερνκέλνπ ηεο ζειίδαο ηα νπνία φηαλ επηιεγνχλ απφ ηνλ ρξήζηε νδεγνχλ ζε άιιν ζεκείν ηνπ εγγξάθνπ ή ζε άιιν έγγξαθν πνπ κπνξεί λα βξίζθεηαη ζε θάπνηνλ άιιν ππνινγηζηή ηνπ internet. Σα HTML αξρεία είλαη απιά ASCII αξρεία θεηκέλνπ, ηα νπνία πεξηέρνπλ ην θείκελν πνπ εκθαλίδεηαη θαζψο θαη ηηο εηδηθέο εληνιέο ηεο γιψζζαο γηα ηηο ζπγθεθξηκέλεο ιεηηνπξγίεο. Η html απνηειείηαη απφ θείκελν θαη απφ δηάθνξεο εηηθέηεο (tags) πνπ δίλνπλ εληνιέο ζηνλ browser φπνπ ν ηειεπηαίνο απεηθνλίδεη ηα απνηειέζκαηα απηψλ ησλ εληνιψλ ζηηο νζφλεο καο. Σα tags είλαη εληνιέο πνπ βξίζθνληαη κεηαμχ ησλ ζπκβφισλ < θαη >. Παξαθάησ παξαζέησ κεξηθά παξαδείγκαηα απφ νξηζκέλα tags <b> Σν θείκελφ καο </b> ην παξάδεηγκα απηφ δίλνπκε ηελ εληνιή ζηνλ browser λα εκθαλίζεη θάπνην θείκελν κε έληνλε γξαθή. <Ι> Σν θείκελφ καο </ Ι> ε απηή ηελ πεξίπησζε, νη ιέμεηο κέζα ζηα tags ζα εκθαληζηνχλ ζηελ νζφλε ηνπ ππνινγηζηή καο κε πιάγηα γξαθή. Γηα κνξθνπνίεζε θεηκέλνπ έλα tag πνπ ρξεζηκνπνηείηαη πνιχ ζπρλά είλαη απηφ πνπ θαζνξίδεη ην κέγεζνο ηεο γξακκαηνζεηξάο <Ηn>, φπνπ n ν αξηζκφο πνπ νξίδεη ην κέγεζνο ησλ ραξαθηήξσλ απφ ην κεγαιχηεξν <H1> πξνο ην κηθξφηεξν <Η6>. Οξηζκέλα αθφκα απφ ηα 32 θπξηφηεξα tags είλαη ηα : <ΗΔΑD> ν ηίηινο ηεο ζειίδαο </HEAD>, ν νπνίνο νξίδεηαη απφ ην tag <TITLE> My page </TITLE>. Σν θπξίσο ζψκα ηεο ζειίδαο αξρίδεη ακέζσο κεηά ηελ επηθεθαιίδα κε ην tag <ΒΟDY> </ΒΟDY>. ε απηή ηε πεξηνρή ππάξρνπλ φια ηα ζπζηαηηθά ζηνηρεία ηεο ζειίδαο καο : κνξθνπνηεκέλν θείκελν, εηθφλεο, ήρνη, ζχλδεζκνη θ.α. Καηά ηελ κνξθνπνίεζε ηνπ θεηκέλνπ γηα λα αιιάδνπκε γξακκή, θαζψο δελ ππνινγίδνληαη νη θελέο γξακκέο ζε έλα θείκελν HTML, ζα πξέπεη λα θάλνπκε ρξήζε ηνπ απινχ tag <BR> (line brake) κε ην νπνίν πεηπραίλνπκε ηελ αιιαγή ηεο γξακκήο ζην ζεκείν πνπ εκείο νξίδνπκε. Αθνινπζεί έλα απιφ παξάδεηγκα ρξήζεο ηεο γιψζζαο ΗΣML κε νινθιεξσκέλε δνκή. Ο παξαθάησ θψδηθαο κπνξεί λα γξαθηεί ζην notepad editor ησλ windows θαη λα απνζεθεπηεί κε νπνηνδήπνηε φλνκα αξρείνπ πξνζζέηνληαο ηελ επέθηαζε.html. 15

16 εκεηψλεηαη φηη νη εληνιέο είλαη case insensitive, δειαδή δελ επεξεάδνληαη απφ ην αλ έρνπλ γξαθηεί κε πεδά ή θεθαιαία. Αμηνζεκείσην είλαη επίζεο φηη ε html είλαη ε πξψηε θαη πην δηαδεδνκέλε γιψζζα πεξηγξαθήο ηεο δνκήο κηαο ηζηνζειίδαο. Η html έθεξε ηα πξψηα πξνβιήκαηα εκθάληζεο ηζηνζειίδσλ απφ ηνπο δηάθνξνπο browsers. Δηδηθά φηαλ πεξηιακβάλεη (πνπ πεξηιακβάλεη ζπρλά) εθαξκνγέο ζε Javascript. Αξρηθά είραλ ζεζπηζηεί θάπνηεο πξνδηαγξαθέο γηα ηε html πνπ θάιππηαλ κέρξη ηε html 2.0. Σα πξνβιήκαηα πξνέθπςαλ φηαλ νη Microsoft θη ε Netscape πξφζζεζαλ ζηελ html ηέηνηεο δπλαηφηεηεο πνπ ήηαλ ζπκβαηέο λα απεηθνληζηνχλ απφ νξηζκέλνπο browsers. Αθφκε θαη ηψξα αιιηψο απεηθνλίδεηαη κηα ζειίδα απφ δηαθνξεηηθνχο browsers. Υάξε ζε απηφ εθζξνλίζηεθε ν explorer απφ ηνλ firefox. Μεγάια πξνγξάκκαηα ζηα νπνία ν ρξήζηεο ζπγγξάθεη θψδηθα html θαη ηαπηφρξνλα κπνξεί λα βιέπεη θαη ην απνηέιεζκα ησλ θσδηθψλ πνπ ζπγγξάθεη είλαη ην Dreamweaver ηεο Adobe, ην FrontPage ηεο Microsoft θαη ην Ace HTML. 16

17 ΚΔΦΑΛΑΙΟ 3o - ΒΑΗ ΓΔΓΟΜΔΝΩΝ - ΓΛΩΔ ΠΡΟΓΡΑΜΜΑΣΙΜΟΤ ΣΔΥΝΟΛΟΓΙΔ CSS (Cascading Style Sheets) Σα αξρεία (θχιια ζηπι) CSS καο επηηξέπνπλ λα δηαρσξίζνπκε ην πεξηερφκελν κηαο ηζηνζειίδαο απφ ην ζρεδηαζηηθφ θνκκάηη ηεο. Καη απηφ ζπκβαίλεη γηαηί φια ηα ζηνηρεία ζρεδίαζεο θαη κνξθνπνίεζεο κηαο ζειίδαο κπνξνχλ λα απνζεθεπηνχλ ζε έλα κφλν μερσξηζηφ αξρείν CSS, ην νπνίν ζα ζπλδέεηαη/ζα επηθνηλσλεί κε φια ηα άιια αξρεία ηεο ζειίδαο, θαη ζα ηα αιιάδεη ζρεδηαζηηθά. Απηφ, φπσο θαηαιαβαίλεηε, είλαη πνιχ πξαθηηθφ, γηαηί αλ γηα παξάδεηγκα ζέινπκε λα αιιάμνπκε ην θφλην (background color) κηαο ζειίδαο, αξθεί λα επέκβνπκε ζην αξρείν CSS θαη λα θάλνπκε εθεί ηελ αιιαγή, θαη ΓΔΝ ρξεηάδεηαη λα θάλνπκε ηελ αιιαγή ζε φια ηα αξρεία κηαο ζειίδαο μερσξηζηά. Έηζη γιηηψλνπκε πνιιέο ζεηξέο θψδηθα. Σα πιενλεθηήκαηα ηεο CSS ζπλνπηηθά είλαη: 1. Διαρηζηνπνίεζε ρξφλνπ θφξησζεο κηαο ζειίδαο, αθνχ κηθξαίλεη ην κέγεζνο ησλ αξρείσλ κηαο ζειίδαο. 2. Διαρηζηνπνίεζε ρξφλνπ γξαθήο θψδηθα. 3. Πξνζβαζηκφηεηα απφ φινπο ηνπο θπιινκεηξεηέο-πεξηεγεηέο-web browsers (π.ρ. Explorer). 4. Δίλαη πηζηνπνηεκέλν απφ ην W3C, ηνλ κεγαιχηεξν νξγαληζκφ Web Standards παγθνζκίσο. 5. Οκνηφκνξθε εκθάληζε φισλ ησλ ζειίδσλ κηαο ηζηνζειίδαο, αθνχ ζπλδένληαη κε ην ίδην αξρείν CSS. 6. Δίλαη SEO friendly, αθνχ ν θψδηθαο ηεο ζειίδαο είλαη πνιχ θαζαξφηεξνο. 7. Η CSS είλαη ζρεηηθά πνιχ εχθνιε γιψζζα ζηελ εθκάζεζή ηεο. Σν θπξηφηεξν κεηνλέθηεκα ησλ θχιισλ CSS ζε φηη αθνξά ηελ δηάηαμε είλαη φηη νη παιηφηεξνη θπιινκεηξεηέο είηε δελ ηα θαηαιαβαίλνπλ είηε ηα παξεξκελεχνπλ. SQL H SQL (Structured Query Language) είλαη κία γιψζζα ππνινγηζηψλ ζηηο βάζεηο δεδνκέλσλ, πνπ ζρεδηάζηεθε γηα ηε δηαρείξηζε δεδνκέλσλ, ζε έλα ζχζηεκα δηαρείξηζεο ζρεζηαθψλ βάζεσλ δεδνκέλσλ (Relational Database Management System, RDBMS) θαη ε νπνία, αξρηθά, βαζίζηεθε ζηε ζρεζηαθή άιγεβξα. Η γιψζζα πεξηιακβάλεη δπλαηφηεηεο αλάθηεζεο θαη ελεκέξσζεο δεδνκέλσλ, δεκηνπξγίαο θαη ηξνπνπνίεζεο ζρεκάησλ θαη ζρεζηαθψλ πηλάθσλ, αιιά θαη ειέγρνπ πξφζβαζεο ζηα δεδνκέλα. Η SQL ήηαλ κία απφ ηηο πξψηεο γιψζζεο γηα ην ζρεζηαθφ κνληέιν ηνπ Edgar F. Codd, ζην ζεκαληηθφ άξζξν ηνπ ην 1970, θαη έγηλε ε πην επξέσο ρξεζηκνπνηνχκελε γιψζζα γηα ηηο ζρεζηαθέο βάζεηο δεδνκέλσλ. 17

18 Η ηζηνξία ηεο SQL Η SQL αλαπηχρζεθε ζηελ IBM απφ ηνπο Andrew Richardson, Donald C. Messerly θαη Raymond F. Boyce, ζηηο αξρέο ηεο δεθαεηίαο ηνπ Απηή ε έθδνζε, απνθαινχκελε αξρηθά SEQUEL, είρε σο ζθνπφ λα ρεηξηζηεί θαη λα αλαθηήζεη ηα ζηνηρεία πνπ απνζεθεχηεθαλ ζην πξψην RDBMS ηεο IBM, ην System R. Σν πξψην ζχζηεκα δηαρείξηζεο ζρεζηαθψλ βάζεσλ δεδνκέλσλ (RDBMS) ήηαλ ην RDMBS πνπ αλαπηχρζεθε ζην MIT, ζηηο αξρέο ηεο δεθαεηίαο ηνπ 1970 θαη ε Ingres, πνπ αλαπηχρζεθε ην 1974 ζην Παλεπηζηήκην Μπέξθιευ. H Ingres εθάξκνζε κία γιψζζα δηαηχπσζεο εξσηήζεσλ γλσζηή σο QUEL, ην νπνίν αληηθαηαζηάζεθε αξγφηεξα ζηελ αγνξά απφ ηελ SQL. Πξνο ην ηέινο ηεο δεθαεηίαο ηνπ 70 ε Relational Software (ηψξα Oracle Corporation) είδε ηε δπλαηφηεηα απηψλ πνπ πεξηγξάθεθαλ απφ Codd, Chamberlin, θαη Boyce θαη αλέπηπμε ηελ SQL βαζηζκέλν ζην RDBMS, κε ηηο θηινδνμίεο πψιεζεο ηνπ ζην Ακεξηθαληθφ λαπηηθφ, ηελ Κεληξηθή Τπεξεζία Πιεξνθνξηψλ θαη άιιεο Ακεξηθαληθέο Τπεξεζίεο. Σν θαινθαίξη ηνπ 1979, ε Relational Software εηζήγαγε ηελ πξψηε δηαζέζηκε ζην εκπφξην εθαξκνγή ηνπ SQL θαη λίθεζε ηελ IBM κε ηε δηάζεζε ηνπ πξψηνπ εκπνξηθνχ RDBMS γηα κεξηθέο εβδνκάδεο. Γισζζηθά ζηνηρεία Η γιψζζα SQL ππνδηαηξείηαη ζε δηάθνξα γισζζηθά ζηνηρεία, πνπ πεξηιακβάλνπλ Clauses, νη νπνίεο είλαη ζε κεξηθέο πεξηπηψζεηο πξναηξεηηθέο, αιιά απαξαίηεηα ζπζηαηηθά ησλ δειψζεσλ θαη εξσηήζεσλ. Expressions πνπ κπνξνχλ λα παξαγάγνπλ είηε ηηο θιηκαθσηέο ηηκέο είηε πίλαθεο πνπ απνηεινχληαη απφ ζηήιεο θαη ζεηξέο ζηνηρείσλ. Predicates πνπ δηεπθξηλίδνπλ ηνπο φξνπο πνπ κπνξνχλ λα αμηνινγεζνχλ ζαλ ζσζηφ ή ιάζνο. Queries πνπ αλαθηνχλ ηα ζηνηρεία βαζηζκέλεο ζε εηδηθά θξηηήξηα. Statements πνπ κπνξνχλ λα έρνπλ κηα επίδξαζε ζηα ζρήκαηα θαη ηα ζηνηρεία, ή πνπ κπνξνχλ λα ειέγμνπλ ηε ξνή ηνπ πξνγξάκκαηνο θαη ηηο ζπλδέζεηο απφ άιια πξνγξάκκαηα. Σν θελφ αγλνείηαη γεληθά ζηηο Statements θαη ηηο Queries SQL. Έλα θελφ είλαη φκσο απαξαίηεην γηα λα μερσξίδεη Statements φπσο θαη ζηελ θαλνληθή γξαθή θεηκέλσλ. MySQL Η MySQL είλαη έλα ζχζηεκα δηαρείξηζεο ζρεζηαθψλ βάζεσλ δεδνκέλσλ ( Relational Database Management System) πνπ κεηξά παγθνζκίσο πεξηζζφηεξεο απφ 11 εθαηνκκχξηα εγθαηαζηάζεηο. Έιαβε ην φλνκά ηεο απφ ηελ θφξε ηνπ Μφληπ Βηληέληνπο, ηε Μάη. Σν πξφγξακκα ηξέρεη έλαλ εμππεξεηεηή (server) παξέρνληαο πξφζβαζε πνιιψλ 18

19 ρξεζηψλ ζε έλα ζχλνιν βάζεσλ δεδνκέλσλ. Ο πεγαίνο θψδηθαο ηνπ εγρεηξήκαηνο είλαη δηαζέζηκνο κέζσ ηεο άδεηαο GNU General Public License, θαζψο θαη κέζσ νξηζκέλσλ ηδηφθηεησλ ζπκθσληψλ. Αλήθε θαη ρξεκαηνδνηνχληαλ απφ κία θαη κνλαδηθή θεξδνζθνπηθή εηαηξία, ηε ζνπεδηθή MySQL AB, ε νπνία ζήκεξα αλήθεη ζηελ Oracle. Οξηζκέλα ραξαθηεξηζηηθά γλσξίζκαηα είλαη ηα εμήο : πνιπλεκαηψδεο. φιε ε θπθινθνξία θσδηθνχ πξφζβαζεο θξππηνγξαθείηαη. φιεο νη ζηήιεο πεξηιακβάλνπλ πξνθαζνξηζκέλεο ηηκέο. έιεγρνο θαη ηξνπνπνίεζε πηλάθσλ. 39 ςεπδψλπκα πηλάθσλ θαη ζηειψλ ζχκθσλα κε ηα πξφηππα SQL92. φιεο νη ζπλελψζεηο (joins) γίλνληαη ζε έλα πέξαζκα. εγγξαθέο ζηαζεξνχ θαη κεηαβιεηνχ κήθνπο. Apache O Apache είλαη έλαο δσξεάλ open-source HTTP web server γηα UNIX like ζπζηήκαηα (BSD, Linux, Unix), γηα Windows θαζψο θαη γηα άιιεο πιαηθφξκεο. Ο Apache server έρεη παίμεη θαζνξηζηηθφ ξφιν ζηελ αλάπηπμε ηνπ παγθφζκηνπ ηζηνχ θαη ζπλερίδεη λα είλαη ν πην δεκνθηιήο web server ζηηο κέξεο καο. Ο Apache παξάγεηαη θαη δηαλέκεηαη δσξεάλ απφ ηελ Apache Software Foundation. Υξεζηκνπνηείηαη θπξίσο γηα λα εμππεξεηεί ζηαηηθφ θαη δπλακηθφ πεξηερφκελν ζην web. Πνιιέο απφ ηηο web εθαξκνγέο θαηαζθεπάδνληαη έρνληαο ππφςε ην πεξηβάιινλ θαη ηα ραξαθηεξηζηηθά πνπ παξέρεη ν Apache. Σέινο ζπλεξγάδεηαη άςνγα κε PHP, Perl, Python. PHP Η php είλαη κηα γιψζζα ζπγγξαθήο ζελαξίσλ (scripting language) ε νπνία ελζσκαηψλεηαη ζηνλ θψδηθα ηεο HTML θαη εθηειείηαη ζηελ πιεπξά ηνπ server. Έρεη δαλεηζηεί πνιιά ζηνηρεία ζηελ ζχληαμή ηεο απφ ηελ γιψζζα C, ηελ Java θαη ηελ Perl. Υξεζηκνπνηείηαη θπξίσο απφ ηνπο web-developers γηα ηελ θαηαζθεπή δπλακηθψλ Ιζηνζειίδσλ.Μηα ηζηνζειίδα γξακκέλε ζε php γηα λα αλνίμεη ζε πξαγκαηηθφ ρξφλν ζηελ νζφλε καο ζε κνξθή html κέζσ ηνπ browser καο, επηθνηλσλεί θαη πεξλά απφ επεμεξγαζία απφ έλαλ ζπκβαηφ δηαθνκηζηή ηνπ ηζηνχ (π.ρ. Apache). Ο Apache είλαη ν κεγαιχηεξνο θαη δηαζεκφηεξνο εμππεξεηεηήο (nameserver) ηνπ παγθφζκηνπ ηζηνχ (world wide web). Ο Apache είλαη ν δεκνθηιέζηεξνο εθ ησλ εμππεξεηεηψλ γηαηί ιεηηνπξγεί θαη ζηα Linux, Unix, Mac OS X εθηφο απφ ηα Windows. Η ρξεζηκφηεηα ηνπ Apache είλαη γηαηί φηαλ θάπνηνο ρξήζηεο επηζθέπηεηαη κηα ηζηνζειίδα απφ ην πξφγξακκα πεξηήγεζήο ηνπ (browser), απηφ επηθνηλσλεί κε ηνλ δηαθνκηζηή-server κέζσ ηνπ πξσηνθφιινπ http, θαη έηζη δεκηνπξγνχληαη νη ηζηνζειίδεο νη νπνίεο απνζηέιινληαη ζην πξφγξακκα πεξηήγεζεο θαη απφ εθεί ζηελ νζφλε ηνπ ππνινγηζηή καο ζε κνξθή θψδηθα html. Ο Apache ππνζηεξίδεη εμ' νξηζκνχ ηελ εθηέιεζε θψδηθα php. 19

20 Η Ιζηνξία ηεο PHP Σν 1994, έλαο θνηηεηήο, ν Rasmus Lerdorf ρξεζηκνπνίεζε ηε γιψζζα πξνγξακκαηηζκνχ Perl γηα λα δεκηνπξγήζεη έλα απιφ script κε φλνκα php.cgi. Ο ζθνπφο απηνχ ηνπ script ήηαλ λα δηαηεξεί κία ιίζηα ζηαηηζηηθψλ γηα φζνπο έβιεπαλ online ην βηνγξαθηθφ ηνπ ζεκείσκα. ηελ ζπλέρεηα δηέζεζε ζε θίινπο ηνπ απηφ ην script, νη νπνίνη ζηαδηαθά ηνπ δεηνχζαλ λα πξνζζέζεη θαη άιιεο δπλαηφηεηεο. Η γιψζζα ζηελ αξρή νλνκαδφηαλ PHP/FI απφ ηα αξρηθά Personal Home Page / Form Interpreter. Σν 1997 πεξηζζφηεξνη απφ ηζηφηνπνη ρξεζηκνπνηνχζαλ ηελ PHP / FI ε νπνία είρε αλαβαζκηζηεί ζηελ έθδνζε 2.0, έρνληαο σο βάζε απηή ηε θνξά ηε γιψζζα C, ελψ ιίγν αξγφηεξα κέζα ζην ίδην έηνο ε γιψζζα μαλαγξάθηεθε απφ ηελ αξρή απφ ηνπο Andi Gutmans θαη Zeev Suraski, νη νπνίνη βαζίζηεθαλ πνιχ ζηελ PHP / FI 2.0. Έηζη δεκηνπξγήζεθε ε PHP 3.0 ε νπνία έκνηαδε πεξηζζφηεξν ζηελ ησξηλή κνξθή ηεο PHP. Οη Zeev θαη Andi δεκηνχξγεζαλ ζηελ ζπλέρεηα ηελ εηαηξία Zend (απφ ηα αξρηθά ηνπο), ε νπνία ζπλερίδεη λα αλαπηχζζεη θαη λα εμειίζζεη ηε γιψζζα PHP κέρξη ζήκεξα. Σν 1998 ήξζε ε 4ε έθδνζε ηεο PHP, ηνλ Ινχιην ηνπ 2004 δηαηέζεθε ε έθδνζε 5, ελψ ζήκεξα νη πξψηεο δνθηκαζηηθέο εθδφζεηο ηεο 6εο έθδνζεο είλαη πιένλ δηαζέζηκεο γηα ρξήζε θαη δνθηκή απφ νπνηνλδήπνηε πξνγξακκαηηζηή. Πξνο ην παξφλ νη εθδφζεηο 4 θαη 5 ρξεζηκνπνηνχληαη απφ ηνπο πεξηζζφηεξνπο ηζηφηνπνπο. Πιενλεθηήκαηα ηεο PHP Βαζηθνί αληαγσληζηέο ηεο PHP είλαη νη Perl, Microsoft Active Server Pages (ASP), Java Server Pages (JSP) θαη Allaire Cold Fusion. ε ζχγθξηζε κε απηά ηα πξντφληα ε PHP έρεη πνιιά πιενλεθηήκαηα: Υακειφ θφζηνο Τςειή απφδνζε Δπθνιία κάζεζεο θαη ρξήζεο Μεηαθεξζηκφηεηα Γηαζεζηκφηεηα ηνπ θψδηθα πξνέιεπζεο Δλζσκαησκέλεο βηβιηνζήθεο Γηαζπλδέζεηο κε πνιιά δηαθνξεηηθά ζπζηήκαηα βάζεσλ δεδνκέλσλ 20

21 PhpMyAdmin Σν PhpMyAdmin είλαη έλα εξγαιείν γξακκέλν ζε PHP κε ην νπνίν δηαρεηξηδφκαζηε ηηο βάζεηο δεδνκέλσλ πνπ έρνπκε κέζσ web. Σν PhpMyAdmin κπνξεί λα ρεηξίδεηαη πιήξσο βάζεηο δεδνκέλσλ, πίλαθεο, πεδία πηλάθσλ αιιά θαη έλα νιφθιεξν MySQL Server. Τπνζηεξίδεη πεξηζζφηεξεο απφ 50 γιψζζεο, κεηαμχ ησλ νπνίσλ θαη ηα ειιεληθά θαη είλαη ινγηζκηθφ αλνηρηνχ θψδηθα. Γπλαηφηεηεο ηνπ PhpMyAdmin Σν PhpMyAdmin κπνξεί λα: Γεκηνπξγεί θαη λα δηαγξάθεη βάζεηο δεδνκέλσλ. Γεκηνπξγεί, ηξνπνπνηεί, δηαγξάθεη, αληηγξάθεη θαη κεηνλνκάδεη πίλαθεο. Κάλεη ζπληήξεζε ηεο βάζεο. Πξνζζέηεη, δηαγξάθεη θαη ηξνπνπνηεί πεδία πηλάθσλ. Δθηειεί εξσηήκαηα SQL αθφκα θαη νκαδηθά. Γηαρεηξίδεηαη θιεηδηά ζε πεδία. Φνξηψλεη αξρεία θεηκέλνπ ζε πίλαθεο. Γεκηνπξγεί θαη δηαβάδεη πίλαθεο. Δμάγεη δεδνκέλα ζε κνξθή CVS, XML θαη LATEX. Γηαρεηξίδεηαη πνιινχο δηαθνκηζηέο. Γηαρεηξίδεηαη ηνπο ρξήζηεο MySQL θαη ηα δηθαηψκαηα ηνπο. Διέγρεη ηελ αλαθνξηθή δξαζηεξηφηεηα ησλ δεδνκέλσλ ησλ MyISAM πηλάθσλ. Γεκηνπξγεί PDF γξαθηθψλ ηνπ layout ηεο βάζεο δεδνκέλσλ. Δθηειεί αλαδεηήζεηο ζε φιε ηε βάζε δεδνκέλσλ ή κέξνο απηήο. Τπνζηεξίδεη πίλαθεο InnoDB θαη μέλα θιεηδηά. Τπνζηεξίδεη MySQLi, κία βειηησκέλε επέθηαζε ηνπ MySQL JavaScript AJAX Μέζα ζηνλ θψδηθα ηεο html κπνξνχλ λα ελζσκαησζνχλ θαη ζελάξηα εληνιψλ (scripts), ζε γιψζζεο φπσο ε javascript, ηα νπνία επεξεάδνπλ ηε ζπκπεξηθνξά ησλ ηζηνζειίδσλ. Η JavaScript είλαη κηα δηεξκελεπκέλε γιψζζα πξνγξακκαηηζκνχ πνπ αξρηθά ήηαλ κέξνο ηεο πινπνίεζεο ησλ θπιινκεηξεηψλ ψζηε ηα ζελάξηα απφ ηελ κεξηά ηνπ πειάηε λα κπνξνχλ λα επηθνηλσλνχλ κε ηνλ ρξήζηε θαη λα αληαιιάζνπλ δεδνκέλα αιιάδνληαο δπλακηθά ην πεξηερφκελν ηεο ηζηνζειίδαο πνπ βιέπεη ν ρξήζηεο ζηνλ θπιινκεηξεηή ηνπ. Δίλαη κηα γιψζζα ζελαξίσλ πνπ βαζίδεηαη ζηα πξσηφηππα, είλαη δπλακηθή, θαη κπνξεί λα ρξεζηκνπνηεζεί θαη ζε εθαξκνγέο εθηφο ηζηνζειίδσλ. Γηα ηελ πινπνίεζε ηεο εθαξκγήο ρξεζηκνπνηήζεθε θαη κηα επηπιένλ βηβιηνζήθε ηεο JavaScript, ε JQuery. Δίλαη κηα βηβιηνζήθε ειεχζεξνπ ινγηζκηθνχ ζρεδηαζκέλε γηα λα απινπνηεί ηελ πινπνίεζε ζελαξίσλ ηεο html θαη ππνζηεξίδεηαη απ ηνπο πεξηζζφηεξνπο θπιινκεηξεηέο. Πξσηνθπθινθφξεζε ηνλ Ιαλνπάξην ηνπ 2006 θαη 21

22 ρξεζηκνπνηείηαη ζε πνιχ κεγάιν πνζνζηφ απφ ηνπο ηζηφηνπνπο κε ηε κεγαιχηεξε επηζθεςηκφηεηα. Μηα ηερλνινγία πνπ ρξεζηκνπνηήζεθε επίζεο, είλαη ε AJAX ( Asynchronous JavaScript and XML ). Η AJAX δελ είλαη κηα λέα γιψζζα πξνγξακκαηηζκνχ, αιιά είλαη έλαο ηξφπνο γηα λα αμηνπνηεζνχλ φια φζα ήδε ππάξρνπλ. Μέζσ ηεο ηερλνινγίαο απηήο νη δηαδηθηπαθέο εθαξκνγέο κπνξνχλ λα ζηέιλνπλ θαη λα ιακβάλνπλ δεδνκέλα απφ ηνλ δηαθνκηζηή αζχγρξνλα, ρσξίο δειαδή λα ππάξρεη θακία εκθαλήο κεηαβνιή ζηελ ζειίδα (νιηθή επαλαθφξησζε ). XML Extended Markup Language Δίλαη κηα γιψζζα πεξηγξαθήο/δφκεζεο ησλ δεδνκέλσλ. Λέγνληαο δεδνκέλα, ελλννχκε κηα ζπιινγή ζηνηρείσλ δεδνκέλσλ, φπσο θαηάινγνη βηβιίσλ ή δηεπζχλζεσλ. Η XML δελ είλαη γιψζζα πξνγξακκαηηζκνχ θαη νχηε έρεη ηα ραξαθηεξηζηηθά κηαο γιψζζαο πξνγξακκαηηζκνχ. Η XML ρξεζηκνπνηείηαη γηα λα δηεπθνιχλεη ηνλ ππνινγηζηή καο λα παξάγεη θαη λα δνκήζεη ηα δεδνκέλα

23 ΚΔΦΑΛΑΙΟ 4 Ο Σι είναι ηο Framework και πώρ σπηζιμοποιείηαι Framework: Καηαξράο πξέπεη λα δνχκε ηη είλαη έλα framework..framework ζα κπνξνχζακε λα πνχκε φηη είλαη έλαο ζθειεηφο γηα θάηη.γηα παξάδεηγκα κπνξνχκε λα αλαθέξνπκε ην εμήο:έζησ φηη θάπνηνο ζέιεη λα δεκηνπξγήζεη κε θψδηθα C# (θψδηθαο πνπ ρξεζηκνπνηείηαη απφ ηελ ASP.NET) κία εθαξκνγή (application) γηα ην ίληεξλεη.απηφ κπνξεί λα ην θάλεη γξάθνληαο θψδηθα απφ ηελ αξρή κέρξη ην ηέινο ηεο εθαξκνγήο.απηφ φκσο έρεη θάπνηα κεηνλεθηήκαηα.δίλαη ρξνλνβφξν θαη επίζεο φηαλ θάπνηνο δεκηνπξγεί κία εθαξκνγή θξνληίδεη ψζηε ν θψδηθαο λα είλαη έηζη γξακκέλνο ψζηε λα κπνξεί έλαο άιινο πξνγξακκαηηζηήο λα ηνλ πάξεη λα ηνλ αιιάμεη λα ηνλ επεθηείλεη ρσξίο ζεκαληηθέο αιιαγέο ζην πξφγξακκα.άξα ινηπφλ,εηδηθά ζε κεγαιχηεξεο εθαξκνγέο,νη πξνγξακκαηηζηέο ρξεζηκνπνηνχλ θάπνην framework,θάπνην ζθειεηφ δειαδή πάλσ ζηνλ νπνίν ζα ρηίζνπλ ηελ εθαξκνγή.έηζη θαη πην γξήγνξα δεκηνπξγνχλ ηελ εθαξκνγή θαη πην νπζηαζηηθά θαη πην επέιηθηα..(θα κπνξνχζακε λα πνχκε πνιιά γηα ηα applications θαη πνηεο αξρέο πξέπεη λα ππεξεηνχλ αιιά απηφ ζα γίλεη ζε άιιν άξζξν.) CSS framework: Έλα CSS framework είλαη έλαο ζθειεηφο πνπ ρξεζηκνπνηνχκε θαη καο παξέρεη ζπγθεθξηκέλνπο θαλφλεο γηα λα γξάθνπκε CSS θψδηθα.κνηλψο κπνξνχκε λα ρξεζηκνπνηήζνπκε έλα ηέηνην framework ζε κία ηζηνζειίδα θαη λα γξάςνπκε CSS ψζηε λα ηεο δψζνπκε ζηπι θαη λα ηεο ξπζκίζνπκε ηελ εκθάληζε..η κεγάιε δηαθνξά ηνπ απινχ CSS θψδηθα θαη ηνπ θψδηθα πνπ γξάθνπκε κε ηε ρξήζε ελφο framework είλαη φηη εάλ ρξεζηκνπνηήζνπκε θάπνην framework ππάξρνπλ εληνιέο CSS νη νπνίεο εάλ ηηο γξάθακε ζε έλα απιφ αξρείν CSS δελ ζα έθαλαλ θακία δηαθνξά..σα CSS frameworks ινηπφλ είλαη ζρεδηαζκέλα έηζη ψζηε κε ιηγφηεξν θψδηθα λα κπνξνχκε λα έρνπκε ην ίδην θαη θαιχηεξν απνηέιεζκα απφ φηη ζα είρακε κε απιφ CSS θψδηθα..δπίζεο έλα CSS framework έρεη έλα ηεξάζηην πιενλέθηεκα. Έρεη απηφ πνπ ιέκε cross browser compatibility.γειαδή απηφ πνπ θηηάρλνπκε εκθαλίδεηαη ίδην θαη ζην IE θαη ζηνλ mozilla θαη ζηνλ Chrome θιπ.απηφ είλαη πνιχ ζεκαληηθφ δηφηη νη browsers κεηαμχ ηνπο έρνπλ θάπνηεο δηαθνξέο ζηνλ ηξφπν πνπ δηαβάδνπλ θαη εκθαλίδνπλ ηα CSS.Καη πξέπεη πάληα λα βιέπνπκε αλ ππάξρνπλ bugs θαη λα ηα δηνξζψλνπκε ελψ ζπλήζσο κε έλα css framework δελ ρξεηάδεηαη λα γίλεηαη απηφ. 23

24 ΚΕΦΑΛΑΙΟ 5 Ο Καηηγοπίερ Ιζηοζελίδων & Φιλοξενία ιζηοζελίδων ηε ζεκεξηλή επνρή κηα ηζηνζειίδα είλαη απαξαίηεην εξγαιείν γηα θάζε επαγγεικαηία. Δπίζεο είλαη ηδηαίηεξα ζεκαληηθή γηα ηελ εηθφλα κηαο εηαηξείαο πφζν κάιινλ φηαλ ε επηρείξεζε δξαζηεξηνπνηείηαη ζε φιν ηνλ θφζκν. Η επηηπρία ηεο κπνξεί λα εμαξηεζεί απφ ηελ απνηειεζκαηηθή θαη απνδνηηθή ζρεδίαζε ηεο ηζηνζειίδαο. Σα είδε κηαο ηζηνζειίδαο πνηθίινπλ, αλάινγα κε ηηο αλάγθεο ηνπ θαζελφο. Οη δπν κεγαιχηεξεο θαη βαζηθφηεξεο θαηεγνξίεο ηζηνζειίδσλ είλαη νη ζηαηηθέο (static) θαη νη δπλακηθέο (dynamic). ηαηηθέο Ιζηνζειίδεο Οη ζηαηηθέο ηζηνζειίδεο είλαη νπζηαζηηθά απιά ειεθηξνληθά ''έγγξαθα''. Μπνξνχλ λα πεξηέρνπλ θείκελα θσηνγξαθίεο, ζπλδέζκνπο, αξρεία γηα ''θαηέβαζκα'', θηλνχκελα ζρέδηα. Δίλαη θαηάιιειεο θπξίσο γηα ηελ δεκηνπξγία ''κφληκσλ/ζηαηηθψλ παξνπζηάζεσλ'', φπνπ δελ ππάξρεη ζπρλά ε αλάγθε λα ηξνπνπνηείηαη ην πεξηερφκελφ ηνπο. ήκεξα θπξηαξρεί κηα ιαλζαζκέλε εληχπσζε φηη νη ζηαηηθέο ηζηνζειίδεο είλαη μεπεξαζκέλεο, θπξίσο επεηδή γηα λα θαηαζθεπαζηνχλ βαζίδνληαη ζε παιαηφηεξεο ηερλνινγίεο. Απηή ε εληχπσζε φκσο είλαη άθξσο ιαλζαζκέλε. Μεξηθέο απφ ηηο πην κνληέξλεο ηζηνζειίδεο είλαη ζηαηηθέο, ελψ νη ζηαηηθέο ηζηνζειίδεο πξνζθέξνπλ πιενλεθηήκαηα πνπ δελ έρνπλ νη δπλακηθέο. Ο φξνο "ζηαηηθέο" αλαθέξεηαη ζην κφληκν πεξηερφκελν ησλ ζηαηηθψλ ηζηνζειίδσλ θαη φρη ζε θάπνην είδνο θίλεζεο. Σν πεξηερφκελν ησλ ζηαηηθψλ ζειίδσλ ζπλήζσο δελ αιιάδεη ζπρλά θαη φηαλ απηφ γίλεη ζα πξέπεη λα γίλεη ρεηξσλαθηηθά θαη φρη απηνκαηνπνηεκέλα κε επεκβάζεηο απεπζείαο πάλσ ζηελ ηζηνζειίδα, κε θάπνην ζρεηηθφ πξφγξακκα (π.ρ. html editor), κηα δηαδηθαζία δειαδή φπσο ην λα ζβήλεηο θαη λα γξάθεηο ζε έλα ηεηξάδην, πνπ φκσο ρξεηάδεηαη κηα ζρεηηθή εκπεηξία. 41 Πιενλεθηήκαηα ζηαηηθψλ ζειίδσλ : Γξεγνξφηεξε αλάπηπμε ηεο ηζηνζειίδαο. Υακειφηεξν θφζηνο θαηαζθεπήο θαη ζπληήξεζεο. Μηθξφηεξεο απαηηήζεηο ζε ρψξν θηινμελίαο. πλήζσο θνξηψλεη πην γξήγνξα απφ κηα δπλακηθή. Δίλαη πην θηιηθέο πξνο ηηο κεραλέο αλαδήηεζεο Μεηνλεθηήκαηα ζηαηηθψλ ζειίδσλ : 24

25 Σν πεξηερφκελφ ηεο αλαλεψλεηαη απφ γλψζηε ηεο αλάπηπμεο ηζηνζειίδσλ. Ο ρξήζηεο δελ αιιειεπηδξά κε ηελ ζειίδα. πλήζσο ρξεζηκνπνηείηαη γηα ζειίδεο κε κηθξφ πεξηερφκελν πνπ δελ ρξεηάδεηαη λα αλαλεψλεηαη ζπρλά (απηφ κπνξεί λα είλαη ζεηηθφ αλάινγα κε ηηο απαηηήζεηο ηεο θάζε επηρείξεζεο) Δπλακηθέο Ιζηνζειίδεο Οη δπλακηθέο ηζηνζειίδεο, κπνξεί ζηελ εκθάληζε ζε πνιιέο πεξηπηψζεηο λα κελ έρνπλ κεγάιε δηαθνξά κε ηηο ζηαηηθέο φκσο νη δπλαηφηεηεο είλαη πνιχ πεξηζζφηεξεο απφ πνιιέο πιεπξέο θαζψο ζηελ πεξίπησζε απηή νπζηαζηηθά πξφθεηηαη γηα κηα εθαξκνγή θαη φρη έλα απιφ ειεθηξνληθφ έγγξαθν. πλήζσο, νη δπλακηθέο ηζηνζειίδεο ρξεζηκνπνηνχλ θάπνηα βάζε δεδνκέλσλ φπνπ απνζεθεχνπλ πιεξνθνξίεο θαη απφ φπνπ αληινχλ ην πεξηερφκελφ ηνπο αλάινγα κε ην ηη δεηάεη ν ρξήζηεο/επηζθέπηεο ζε θάζε ηνπ ''θιηθ''. Η ρξήζε ησλ βάζεσλ δεδνκέλσλ είλαη απηή πνπ επηηξέπεη ηελ εχθνιε πξνζζαθαίξεζε πεξηερνκέλνπ ζηηο δπλακηθέο ηζηνζειίδεο θαζψο δελ απαηηείηαη λα επεμεξγάδεηαη θαλείο θάζε θνξά ηελ ίδηα ηελ ηζηνζειίδα αιιά λα δηαρεηξίδεηαη έκκεζα ην πεξηερφκελν ζηελ βάζε δεδνκέλσλ θαη νη ππφινηπεο δηαδηθαζίεο γίλνληαη απηνκαηνπνηεκέλα απφ ηνλ κεραληζκφ ηεο ηζηνζειίδαο. Γηα λα κπνξεί έλαο απιφο ρξήζηεο/επηζθέπηεο λα δηαρεηξίδεηαη ην πεξηερφκελν κηαο δπλακηθήο ζειίδαο εχθνια, ρσξίο γλψζεηο πξνγξακκαηηζκνχ ππάξρνπλ ηα CMS. Σα CMS (Content management System) είλαη εχρξεζηνη κεραληζκνί δηαρείξηζεο πεξηερνκέλνπ. Έηζη, ζηελ πεξηνρή δηαρείξηζεο ηεο ζειίδαο, κπνξνχλ λα δηαρεηξηζηνχλ ην πεξηερφκελφ ηεο απιά κέιε, ζπληάθηεο, δηαρεηξηζηέο θ.α. Ο θαζέλαο έρεη ηνλ δηθφ ηνπ θσδηθφ πξφζβαζεο θαη δηαθνξεηηθά πξνλφκηα ηα νπνία ηα νξίδεη ν ππεξδηαρεηξηζηήο ηεο ζειίδαο. Πιενλεθηήκαηα δπλακηθψλ ζειίδσλ Σν πεξηερφκελν κπνξεί λα αλαλεψλεηαη απφ αλζξψπνπο πνπ δελ γλσξίδνπλ πξνγξακκαηηζκφ. Δίλαη εχθνιν λα αλαλεψλεηαη πην ζπρλά ην πεξηερφκελν. Μπνξεί λα πεξηέρεη απεξηφξηζην αξηζκφ ζειίδσλ άξα θαη πνιχ πεξηερφκελν. Δίλαη εχθνιε ε δηαρείξηζε ρξεζηψλ θαη δηαρεηξηζηψλ ηεο ηζηνζειίδαο. Μεηνλεθηήκαηα δπλακηθψλ ζειίδσλ Η θαηαζθεπή κηαο δπλακηθήο ηζηνζειίδαο ρξεηάδεηαη πεξηζζφηεξν ρξφλν γηα λα νινθιεξσζεί. Σν θφζηνο είλαη κεγαιχηεξν. Σν θφζηνο θηινμελίαο είλαη επίζεο κεγαιχηεξν ιφγσ ησλ κεγαιχηεξσλ απαηηήζεσλ. πλήζσο θνξηψλεη αξγφηεξα απφ κία ζηαηηθή ζειίδα. 25

26 Φηινμελία ηζηνζειίδσλ ( Web Hosting ) Η θηινμελία ηζηνζειίδσλ (Web Hosting ή απιά hosting) είλαη έλα κηα δηαδηθηπαθή ππεξεζία πνπ επηηξέπεη ζε ηδηψηεο θαη εηαηξείεο λα δηαζέηνπλ κία ηζηνζειίδα ζπλερψο αλαξηεκέλε ζην Γηαδίθηπν, ρσξίο λα ρξεηάδεηαη λα επηβαξχλεηαη κε ην θφζηνο ηνπ αλάινγνπ εμνπιηζκνχ (π.ρ. εμππεξεηεηέο) ή ηελ αλάγθε εμππεξέηεζεο κεγάινπ αξηζκνχ εμσηεξηθψλ ζπλδέζεσλ θαη εχξνπο ζχλδεζεο (bandwidth). Απηφ ην αλαιακβάλνπλ νη εηαηξίεο θηινμελίαο ηζηνζειίδσλ (web hosts) πνπ πξνζθέξνπλ ρψξν ζηνλ δηαθνκηζηή ηνπο θαζψο θαη κέξνο ηεο ζχλδεζήο ηνπο πξνο ην internet. Ο φξνο Web Hosting αλαθέξεηαη ζηε δηαδηθαζία κε ηελ νπνία ν ηδηνθηήηεο κίαο ηζηνζειίδαο ελνηθηάδεη ρψξν ζε ππνινγηζηέο (δηαθνκηζηέο) γηα λα ηνπνζεηήζεη ηα αξρεία ηνπ. Σα αξρεία απηά, πνπ ζηνηρεηνζεηνχλ ηελ ηζηνζειίδα ηνπ, πξνζθέξνληαη κέζσ αζθαινχο δηθηχνπ ζπλερφκελεο παξνρήο ζηνπο επηζθέπηεο ηνπ. Η δηαρείξηζε ηνπ ηζηφηνπνπ απφ ηνλ ηδηνθηήηε ηνπ γίλεηαη κέζσ εκπνξηθνχ ή αλνηθηνχ θψδηθα γξαθηθνχ πεξηβάιινληνο (πίλαθαο ειέγρνπ hosting, control panel), ην νπνίν παξέρεη δπλαηφηεηα δηαρείξηζεο ηνπ , ηνπ ftp, ησλ ζηαηηζηηθψλ επηζθεςηκφηεηαο ηνπ ηζηφηνπνπ, ησλ εγθαηεζηεκέλσλ δηαδηθηπαθψλ εθαξκνγψλ θαη ηερλνινγηψλ θ.α. Ο ηδηνθηήηεο ηνπ ηζηφηνπνπ κπνξεί λα αλεβάδεη ηα αξρεία ηνπ κέζσ πξνγξάκκαηνο FTP ζην δηαθνκηζηή θηινμελίαο θαη λα ηα ηξνπνπνηεί, λα έρεη ειεθηξνληθή αιιεινγξαθία (ειεθηξνληθφ ηαρπδξνκείν, ) θαη λα εγθαζηζηά ηηο επηζπκεηέο δηαδηθηπαθέο εθαξκνγέο ζηνλ ηζηφηνπφ ηνπ (ηζηνιφγην/blog, forum, βηβιίν επηζθεπηψλ θιπ). Μεξηθνί απφ απηνχο ηνπο πίλαθεο ειέγρνπ θηινμελίαο είλαη ην Plesk, ην Cpanel, ην Webmin θ.α. Απφ ηηο αξρέο ηεο δεθαεηίαο ηνπ '90 εηαηξείεο hosting μεθίλεζαλ λα δξαζηεξηνπνηνχληαη ζηνλ ηνκέα ηεο παξνρήο θηινμελίαο θαζψο ε αλάγθε γηα ζηαζεξφ θαη ζπλερέο δίθηπν άξρηζε λα γίλεηαη επηβεβιεκέλε. Σε δεθαεηία ηνπ 2000 ε βηνκεραλία ηνπ web hosting γλψξηζε ηεξάζηηα άλζεζε πξψηα ζηελ Ακεξηθή θη έπεηηα θαη ζηελ Δπξψπε,αθνινπζψληαο ηελ κεγάιε δήηεζε γηα ππεξεζίεο hosting απφ ηδηψηεο θη επηρεηξήζεηο γηα ηε ζηέγαζε ηεο ηζηνζειίδαο ηνπο. Παθέηα Φηινμελίαο Κάζε εηαηξεία πνπ παξέρεη θηινμελία ζε ηδηνθηήηεο ηζηνζειίδσλ δηαζέηεη παθέηα hosting κε ηδηαίηεξα ραξαθηεξηζηηθά θαη ηηκέο. Αλάινγα κε ηε ρξήζε θαη ηελ αλακελφκελε θίλεζε ηεο ηζηνζειίδαο ν ελδηαθεξφκελνο επηιέγεη ην παθέην πνπ ηνπ ηαηξηάδεη θαιχηεξα. Η πξνζθνξά ραξαθηεξηζηηθψλ εμειίζζεηαη παξάιιεια κε ηελ ηερλνινγία ησλ ππνινγηζηψλ αιιά θαη ηε δηάδνζε ηνπ δηαδηθηχνπ σο κέζνπ επηθνηλσλίαο θαη ζπλαιιαγψλ. Γελ είλαη αζπλήζηζην ηα ραξαθηεξηζηηθά ησλ παθέησλ λα αιιάδνπλ 2 θνξέο ηνλ ρξφλν, πξνζθέξνληαο αθφκα πεξηζζφηεξεο δπλαηφηεηεο, ηαρχηεηα θαη ππεξεζίεο. Σα παθέηα θηινμελίαο κπνξνχλ ρνληξηθά λα θαηεγνξηνπνηεζνχλ ζηηο παξαθάησ νηθνγέλεηεο: 1. Shared Hosting, φπνπ παξέρεηαη κέξνο ηνπ (δηαθνκηζηή) ζηνλ νπνίν θηινμελνχληαη θαη άιινη ρξήζηεο. 2. Reseller Hosting, φπνπ παξέρεηαη ε δπλαηφηεηα λα κεηαπσιεζεί ρψξνο θαη ινηπά 26

27 εξγαιεία θηινμελίαο ηζηνζειίδσλ. 3. Virtual Private Server, φπνπ κέζσ ινγηζκηθνχ Δηθνληθνπνίεζεο δηαθνκηζηή (Virtualization) παξέρεηαη έλαο απνκνλσκέλνο ρψξνο ζηνλ δηαθνκηζηή, κε δηθνχο ηνπ απνθιεηζηηθήο ρξήζεο- πφξνπο ζπζηήκαηνο (κλήκε, επεμεξγαζηηθή ηζρχ) θαη θεληξηθή πξφζβαζε (web hosts) 4. Dedicated Servers, φπνπ παξέρεηαη νιφθιεξνο ν δηαθνκηζηήο γηα απνθιεηζηηθή ρξήζε θαη δηαρείξηζε απφ ηνλ θάηνρν ηνπ ηζηφηνπνπ 5. Cloud Hosting, φπνπ κε ηερλνινγία δηακνηξαζκνχ θφξηνπ εξγαζίαο ζε πνιινχο δηαθνκηζηέο ηαπηφρξνλα, ηα εηζεξρφκελα αηηήκαηα εμππεξέηεζεο δηακνηξάδνληαη ζε εθείλα ηα κεραλήκαηα πνπ έρνπλ ην κηθξφηεξν θφξην εξγαζίαο ελψ ηαπηφρξνλα ηα αληίγξαθα ζε θάζε server εμαζθαιίδνπλ ηελ αθεξαηφηεηα θαη ηε δηαζεζηκφηεηα ησλ αξρείσλ. XAMPP Σν XAMPP είλαη έλα ειεχζεξν ινγηζκηθφ ην νπνίν απνηειείηαη θπξίσο απφ ηνλ Apache HTTP server, ηελ MySQL βάζε δεδνκέλσλ θαη ησλ δηεξκελέσλ γηα scripts γξακκέλα ζε γιψζζεο πξνγξακκαηηζκνχ PHP θαη Perl. Δίλαη αλεμάξηεην πιαηθφξκαο θαη ηξέρεη ζε Microsoft Windows, Linux, Solaris θαη Mac OS X θαη ρξεζηκνπνηείηαη σο πιαηθφξκα γηα ηελ ζρεδίαζε θαη αλάπηπμε ηζηνζειίδσλ κε ηερλνινγίεο φπσο PHP, JSP θαη Servlets. Σν ινγηζκηθφ XAMPP κε κηα απιή εγθαηάζηαζε καο παξέρεη έλα νινθιεξσκέλν ζχζηεκα Apache, MySQL, PHP καδί κε ην ινγηζκηθφ phpmyadmin, δίλνληάο καο ηελ δπλαηφηεηα λα θάλνπκε ηνλ ππνινγηζηή καο έλα ηνπηθφ server πάλσ ζηνλ νπνίν ζα ζηεζεί ε ηζηνζειίδα. Μεηά ηελ εγθαηάζηαζε ηνπ xampp ππάξρνπλ πιένλ ζηνλ ππνινγηζηή καο ηα απαξαίηεηα αξρηηεθηνληθά ζηνηρεία γηα λα εγθαηαζηήζνπκε ην joomla θαη λα μεθηλήζνπκε κε ηελ δεκηνπξγία θαη ηελ αλάπηπμε ηνπ ηζηνηφπνπ καο ηνπηθά. 27

28 ΚΔΦΑΛΑΙΟ 6 Ο Γημιοςπγία ηλεκηπονικού καηαζηήμαηορ ην θεθάιαην απηφ ζα δνχκε αλαιπηηθά ηελ θαηαζθεπή ηεο ηζηνζειίδαο Smart-Mobile. Θα εμεηάζνπκε δηεμνδηθά ηα βήκαηα δεκηνπξγίαο ηεο, θαζψο θαη ηνλ ηξφπν ιεηηνπξγίαο ηεο. Αξρηθά ζα ζπλαληήζνπκε ηηο εμεο θαηεγνξηεο: Απαηηήζεηο ζπζηήκαηνο Μνληέια View Απαηηήζεηο ζπζηήκαηνο: Ο ρξήζηεο αθνχ εηζέιζεη ζην ειεθηξνληθφ θαηάζηεκά καο ζα έρεη ηε δπλαηφηεηα λα πεξηεγεζεί αλάκεζα ζε κηα κεγάιε γθάκα απφ είδε έμππλεο θηλεηήο ηειεθσλίαο. ηελ ζπλέρεηα, κπνξεί λα επηιέμεη κία ζπγθεθξηκέλε αλαδήηεζε θηλεηνχ ηειεθψλνπ πνπ επηζπκεί ή λα δηαιέμεη κία απφ ηηο θαηεγνξίεο θηλεηψλ πνπ είλαη δηαζέζηκεο. Απαξαίηεηε πξνυπφζεζε γηα λα πξνβεί ζηελ αγνξά θηλεηνχ ηειεθψλνπ ν πειάηεο (client), είλαη λα δεκηνπξγεζεί έλαο πξνζσπηθφο ινγαξηαζκφο(account) κε ηα αηνκηθά ηνπ ζηνηρεία θαη ζηελ ζπλέρεηα λα πξαγκαηνπνηεζεί είζνδνο ( login) κε ην πξνζσπηθφ ηνπ φλνκα ρξήζηε (username) & θσδηθφ πξφζβαζεο (password), ψζηε λα ζπλδεζεί θαη λα πινπνηήζεη ηελ αγνξά ηνπ. 1UML ειεθηξνληθό θαηάζηεκα 28

29 Μνληέια: ηελ θαηεγνξία κνληέια ζα δνχκε ηα κέξε απφ ηα νπνία απνηειείηαη κηα βάζε. ηελ ζπγθεθξηκέλε πεξίπησζε έρνπκε ηξεηο νληφηεηεο: ηνπο ρξήζηεο (users) ηα πξντφληα (products) θαη ην θαιάζη (basket). Πην αλαιπηηθά : Σηον πίνακα Basket έσοςμε ηην ένωζη ηων δύο πινάκων ( users & products ). Σν πξσηεχνλ θιεηδί ηνπ πίλαθα απηνχ είλαη ν ζπλδπαζκφο ησλ πεδίσλ product_id θαη user_id πνπ είλαη θαη ηα δχν μέλα θιεηδηά ( foreign keys ), ην κελ user_id από ηον πίνακα users, ηο δε product_id από ηον πίνακα products. Τα πεδία και οι ιδιόηηηερ ηος πίνακα αςηού θαίνονηαι ζηην παπακάηω θωηογπαθία. ηνλ πίλαθα products γίλνληαη νη εγγξαθέο κε νλφκαηα (id, title, description, brand, available, price, quantity, image, color, monitor, camera & system). Σα πεδία απηά ηα εηζάγεη ν δηαρεηξηζηεο (administrator) ζηελ 29

30 πεξίπησζε πνπ ζέιεη λα πξνζζέζεη έλα λέν πξντφλ ζην ειεθηξνληθφ θαηάζηεκα. Οη ηδηφηεηεο ηνπ πίλαθα απηνχ θαίλνληαη ζηελ παξαθάησ θσηνγξαθία. ηνλ πίλαθα users γίλνληαη νη εγγξαθέο κε νλφκαηα ( id, name, surname, city, address, username, password, & type). Σα πεδία απηά ηα εηζάγεη ν ρξήζηεο ζηελ πεξίπησζε πνπ ζέιεη λα θάλεη εγγξαθή ζην ζχζηεκα ηνπ ειεθηξνληθνχ θαηαζηήκαηνο. To Primary key είλαη ην id θαη ηαπηφρξνλα είλαη θαη ayto_increment (δειαδή απμάλεηαη κφλν ηνπ)..δπίζεο ζην πεδίν «#9 type» o administrator δηαιέγεη αλ ζέιεη θάπνηνλ λα ηνλ αθνινπζήζεη ζαλ Αdministrator. Οη ηδηφηεηεο ηνπ πίλαθα απηνχ θαίλνληαη ζηελ παξαθάησ θσηνγξαθία. 30

31 Views ή αιιηώο εηθόλεο ηζηόηνπνπ: Απινί ρξήζηεο: Απηή είλαη ε αξρηθή ζειίδα index πνπ εκθαλίδεηαη φηαλ ν ρξήζηεο πιεθηξνινγεί ην url ηεο ηζηνζειίδαο (Παξάξηεκα 1). Αλαθέξεηαη θπξίσο ζηνπο απινχο ρξήζηεο. Ξεκινώνηαρ από απιζηεπά παπαηηπούμε ηο όνομα ηος καηαζηήμαηορ «Mobile-shop». Σςγσπόνωρ αςηό είναι και ένα ενεπγοποιημένο κοςμπί πος αν επιλεγεί οδηγεί ηον σπήζηη ζηην απσική ζελίδα ανά πάζα ζηιγμή. Σηα δεξιά μαρ ςπάπσει ηο <<Brands Mobiles>> (Παξάξηεκα 2). Παηώνηαρ ηο κοςμπί αςηό ο client(πελάηηρ) οδηγείηαι ζηην επόμενη θωηογπαθία. Δηλαδή, ζηον καηάλογο ηων έξςπνων κινηηών ηηλεθώνων όπος μποπεί να δει όλερ ηιρ διαθέζιμερ μάπκερ. 31

32 πλερίδνληαο πξνο ηα δεμηά κπνξνχκε λα δνχκε ηνλ αξηζκφ ηειεθψλνπ ηνπ ειεθηξνληθνχ καο θαηαζηήκαηνο θαη ην πιήξεο σξάξην ιεηηνπξγίαο (Γεπηέξα σο Παξαζθεπή ηηο ψξεο θαη άββαην ). Πξνρσξψληαο θαη άιιν δεμηά ζπλαληάκε ηελ δπλαηφηεηα αλαδήηεζεο (Παπάπηημα 3). Ο client κπνξεί λα αλαδεηήζεη νπνηνδήπνηε πξντφλ επηζπκεί. Έρεη γίλεη εηδηθή επεμεξγαζία ζηελ αλαδήηεζε κε ηέηνην ηξφπν, ψζηε αθφκα θαη ζε πεξίπησζε ιαλζαζκέλεο πιεθηξνιφγεζεο λα εκθαλίδνληαη φια ηα πξντφληα κε ηα γξάκκαηα πνπ έρνπλ πιεθηξνινγεζεί. Γηα παξάδεηγκα, έζησ φηη ζέινπκε λα αλαδεηήζνπκε νηηδήπνηε ζρεηηθφ κε ηελ επσλπκία NOKIA. Δάλ πιεθηξνινγήζνπκε ιαλζαζκέλα ΚIA ή αθφκα θαη N ζα εκθαληζηεί νπνηνδήπνηε απνζεθεπκέλν πξντφλ ππάξρεη ζηελ ηζηνζειίδα θαη πεξηιακβάλεη ηα ζπγθεθξηκέλα γξάκκαηα. ηηο εηθφλεο πνπ αθνινπζνχλ έρνπκε πιεθηξνινγήζεη κία θνξά ην γξάκκα ηεο Αγγιηθήο αιθαβήηνπ S και ζηελ ζπλέρεηα ηε ιέμε Samsung. Αλαδήηεζε κε ην γξάκκα 'S' 32

33 Αλαδήηεζε κε ηελ ιέμε 'SAMSUNG' Σέινο, ζηα δεμηά καο έρνπκε ην menu «Ιδηόηεηεο». Όηαλ ν client είλαη offline ζηηο ηδηφηεηεο εκθαλίδνληαη νη εμήο θαηεγνξίεο: 1) Log in (Παξάξηεκα 4). 2) Register (Παξάξηεκα 5). 3) Contact us (Παξάξηεκα 6). Δλψ, φηαλ ν client είλαη ζπλδεδεκέλνο ην menu «Ιδηόηεηεο» γίλεηαη menu «username» δειαδή παίξλεη ηελ ζέζε ηνπ ρξήζηε θαη εκθαλίδνληαη νη εμήο θαηεγνξίεο: 1) Καιάζη (Παξάξηεκα 7). 2) Έμνδνο 3) Contact us 33