Προγραμματισμός Διαδικτυακών εφαρμογών

Expand – Collapse

  • Διαδικτυακές εφαρμογές

    • Client – Server αρχιτεκτονική

      • Μεταξύ δύο υπολογιστών Α και Β, ο Α θεωρείται ο πελάτης και ο Β θεωρείται ο εξυπηρετητής.
        • Τεχνολογίες που χρησιμοποιούνται
          • html
          • javascript
          • php
          • Έτοιμες λύσεις
            • Content Management Systems

              Connector

            • WordPress
              • Δωρέαν εφαρμογή
              • Τεχνολογίες
                • html
                • javascript
                • php
                • mysql
        • Σχήμα
      • Πρωτόκολλο
        • το πρωτόκολλο HTTP
      • Πελάτης
        • Δημιουργεί μια αίτηση
        • Χρησιμοποιεί διεπαφή για να δημιουργήσει την αίτηση
          • Σελίδα html που περιέχει φόρμα
      • Εξυπηρετητής
        • Απαντά στις αιτήσεις των πελατών
        • Δεν χρειάζεται διεπαφή
        • Απαντά με σελίδες html

    • Σχεδίαση Διαδικτυακής εφαρμογής

      • Σχεδίαση αρχιτεκτονικής
      • Σχεδίαση του γραφικού περιβάλλοντος
      • Σχεδίαση των μονάδων του συστήματος
      • Σχεδίαση δεδομένων που απαιτούνται

    • Αισθητική σχεδίαση εφαρμογής

      Κανόνες NIelsen

        1. Αντιστοιχία του συστήματος και του πραγματικού κόμου
        2. Ορατή η κατάσταση του συστήματος
        3. Έλεγχος και ελευθερία του χρήστη
        4. Συμμόρφωση με πρότυπα
        5. Πρόληψη σφαλμάτων
        6. Αναγνώριση αντί της ενθύμισης
        7. Μνιμαλιστική σχεδίαση
        8. Αναφορά σφαλμάτων

    • HTML

      • Εργαλεία
        • Editor για δημιουργία html
        • Mozilla firefox ή google chrome για εμφάνιση
        • Web server για εξυπηρετητή
        • Ftp client για μεταφορά αρχείων στον εξυπηρετητή
      • Σύνθεση HTML σελίδας
        • Οι εντολές είναι σε ζεύγη
        • Οι εντολές γράφονται μέσα σε < και >
          • Πχ <html>
        • Το δεύτερο κομμάτι της εντολής γράφεται μπροστά με το χαρακτήρα /
          • Π.χ </html>
        • Κάθε σελίδα ξεκινά με και τελειώνει με την εντολή <html>
          • Δηλαδή <html> </htmll>
        • Μέσα στις εντολές μπορούμε να προσθέσουμε περισσότερες πληροφορίες
          • ΓΙα εμφάνιση ελληνικών
            • lang=”el” μέσα στην εντολή <html>
            • Για html 5
              • <meta charset=”UTF-8″>
            • Αποθήκευση του αρχείου html σε μορφή UTF-8
      • Βασικές ετικέτες
        • Αρχή και τέλος
          • _ <html> … </html>
          • Περιέχει την κεφαλή και το σώμα της σελίδας
        • Κεφαλή σελίδας
          • _ <head> …. </head>
          • Περιέχει τον τίτλο της σελίδας
          • Περιέχει κώδικα σε javascript της σελίδας
        • Τίτλος
          • Π.χ. <title> τίτλος </title>
        • Σώμα κειμένου
          • —> <body> κέιμενο </body>
        • Σύνδεσμοι
          • Π.χ <a href=”https://www.w3schools.com/html/”>
            Visit our HTML tutorial
            </a>
        • Εικόνα
          • Π.χ <img src=”pic_mountain.jpg” >
          • στο src μπορεί να προστεθεί εικόνα με http link
        • Λίστα
          • Χωρίς αρίθμηση
            • Π.χ <ul> </ul>
            • Για κάθε στοιχείο της λίστας:
              <li> …. </li>
          • Με αρίθμηση
            • Π.χ <ol> </ol>
        • Πίνακες
          • Αρχή και τέλος: <table> … </table>
          • Γραμμή με <tr> …. </tr>
          • Κελί πίνακα με <td> … </td>
        • Φόρμες
          • _ <form action=”link ιστοσελίδας που καλούμε”> …. </form>
          • Η νέα σελίδα καλείται με το πάτημα του κουμπιού της φόρμας
          • _ <input type=”submit” value=”Submit”>

          • Αντικείμενα Διεπαφών

            • Κουμπιά εντολών
              • button
                • <button
                  type=”button” onclick=”alert(‘HELLO’)”> patise me
                  </button>
            • Πλαίσια κειμένου
              • text input
                • <input type=”text” name=”onoma” >
            • Κουμπιά επιλογών
              • <input type=”checkbox” name= “epilogi1″ value=”timi1” > diploma aytokinitou
            • Ράδιο-κουμπιά εντολών
              • radio button
                • <input type=”radio” name=”s” value=”male” checked> Andras
                  <input type=”radio” name=”s” value=”female” checked> Gynaika
            • Λίστα επιλογών
              • select
                • <select>
                  <option value=”1″ > ena</option>
                  <option value=”2″ > dyo </option>
                  </select>
            • Περιοχή κειμένου
              • textarea
                • <textarea name=”hello” rows=”10″ cols=”30″>
                  this is a text message
                  </textarea>
            • Πλαίσια
              • fieldset
            • Λίστες δεδομένων
              • datalist

Πληροφοριακά συστήματα

  • ΜΕΘΟΔΟΛΟΓΙΕΣ ΣΧΕΔΙΑΣΜΟΥ ΚΑΙ ΑΝΑΠΤΥΞΗΣ ΠΛΗΡΟΦΟΡΙΑΚΩΝ ΣΥΣΤΗΜΑΤΩΝ

    • ΤΕΧΝΟΛΟΓΙΑ ΛΟΓΙΣΜΙΚΟΥ
      • ΚΛΑΔΟΣ ΤΗΣ ΠΛΗΡΟΦΟΡΙΚΗΣ
      • ΕΥΡΕΣΗ ΜΕΘΟΔΩΝ
        • ΠΕΡΙΓΡΑΦΗ
        • ΣΧΕΔΙΑΣΜΟΣ
        • ΑΝΑΠΤΥΞΗ
          • ΛΟΓΙΣΜΙΚΟ
      • ΑΠΟΤΕΛΕΣΜΑΤΑ
        • ΠΡΟΔΙΑΓΡΑΦΕΣ
        • ΣΧΕΔΙΑ
        • ΠΗΓΑΙΟΣ ΚΩΔΙΚΑΣ
        • ΕΚΘΕΣΕΙΣ ΕΛΕΓΧΟΥ
        • ΕΚΤΕΛΕΣΙΜΟ ΛΟΓΙΣΜΙΚΟ
      • ΕΠΙΘΥΜΗΤΑ ΧΑΡΑΚΤΗΡΙΣΤΙΚΑ
        • ΠΟΙΟΤΗΤΑ
        • ΑΥΤΟΜΑΤΟΠΟΙΗΣΗ
        • ΠΑΡΑΓΩΓΙΚΟΤΗΤΑ
        • ΕΠΙΤΕΥΞΗ ΕΠΙΧΕΙΡΗΣΙΑΚΩΝ ΣΤΟΧΩΝ
      • ΦΑΣΕΙΣ ΛΟΓΙΣΜΙΚΟΥ/
        ΚΥΚΛΟΣ ΖΩΗΣ ΛΟΓΙΣΜΙΚΟΥ
        • ΧΡΗΣΗ ΜΟΝΤΕΛΩΝ
          • ΜΟΝΤΕΛΟ ΚΑΤΑΡΡΑΚΤΗ
            • ΑΠΑΙΤΗΣΕΙΣ ΠΕΛΑΤΗ
            • ΜΕΛΕΤΗ ΣΚΟΠΙΜΟΤΗΤΑΣ
            • ΠΡΟΣΔΙΟΡΙΣΜΟΣ ΑΠΑΙΤΗΣΕΩΝ
            • ΑΝΑΛΥΣΗ ΑΠΑΙΤΗΣΕΩΝ
            • ΣΧΕΔΙΑΣΗ
            • ΥΛΟΠΟΙΗΣΗ
            • ΕΛΕΓΧΟΣ ΚΑΙ ΔΟΜΙΚΗ
            • ΛΕΙΤΟΥΡΓΙΑ ΚΑΙ ΣΥΝΤΗΡΗΣΗ
        • ΚΟΙΝΕΣ ΔΡΑΣΤΗΡΙΟΤΗΤΕΣ ΣΕ ΟΛΑ ΤΑ ΜΟΝΤΕΛΑ
          • ΠΡΟΔΙΑΓΡΑΦΗ
          • ΑΝΑΠΤΥΞΗ
          • ΕΠΑΛΗΘΕΥΣΗ
          • ΕΞΕΛΙΞΗ
      • ΠΡΟΣΔΙΟΡΙΣΜΟΣ ΑΠΑΙΤΗΣΕΩΝ
        • ΤΟ ΠΙΟ ΣΗΜΑΝΤΙΚΟ
        • ΚΑΘΡΕΠΤΗΣ ΤΩΝ ΑΝΑΓΚΩΝ ΤΗΣ ΕΠΙΧΕΙΡΗΣΗΣ
          • ΑΠΟ ΠΟΛΛΕΣ ΟΠΤΙΚΕΣ ΓΩΝΙΕΣ
          • ΣΕ ΠΟΛΛΑ ΕΠΙΠΕΔΑ
          • ΜΕ ΔΙΑΦΟΡΑ ΕΡΓΑΛΕΙΑ
        • ΑΚΟΛΟΥΘΕΙ ΜΕΤΑ ΑΠΟ
          • ΟΡΙΣΜΟ ΠΡΟΒΛΗΜΑΤΟΣ
          • ΚΑΤΑΓΡΑΦΗ ΑΝΑΓΚΩΝ ΤΟΥ ΠΕΛΑΤΗ
          • ΜΕΛΕΤΗ ΣΚΟΠΙΜΟΤΗΤΑΣ
            • ΑΝ ΜΠΟΡΕΙ ΑΥΤΟ ΠΟΥ ΖΗΤΑΕΙ Ο ΠΕΛΑΤΗΣ ΝΑ ΓΙΝΕΙ
            • ΚΟΣΤΟΣ
            • ΧΡΟΝΟΣ ΚΑΤΑΣΚΕΥΗΣ
            • ΟΦΕΛΟΣ ΠΟΥ ΘΑ ΕΧΕΙ
        • ΓΙΝΕΤΑΙ ΕΠΑΝΑΛΗΠΤΙΚΑ
      • ΕΝΟΠΟΙΗΜΕΝΗ ΠΡΟΣΕΓΓΙΣΗ
        UML
        UNIFIED MODELLING LANGUAGE
        • RATIONAL UNIFIED PROCESS
        • Η ΠΙΟ ΣΥΓΧΡΟΝΗ
        • ΥΠΕΡΣΥΝΟΛΟ ΤΗΣ ΔΟΜΗΜΕΝΗΣ ΠΡΟΣΕΓΓΙΣΗΣ
        • ΕΠΙΛΥΕΙ ΤΙΣ ΔΥΣΚΟΛΙΕΣ ΜΟΝΤΕΛΟΠΟΙΗΣΗΣ
          • ΠΟΛΥΠΛΟΚΟΤΗΤΑ
          • ΕΠΕΞΕΡΓΑΣΙΑ ΠΟΛΛΩΝ ΔΕΔΟΜΕΝΩΝ
        • ΕΠΑΝΑΛΗΠΤΙΚΗ
        • ΧΡΗΣΙΜΟΠΟΙΕΙ ΔΙΑΓΡΑΜΜΑΤΙΚΕΣ ΤΕΧΝΙΚΕΣ
          (ΔΙΑΓΡΑΜΜΑΤΑ)
        • ΦΑΣΕΙΣ ΕΝΟΠΟΙΗΜΕΝΗΣ ΠΡΟΣΕΓΓΙΣΗΣ
          • ΣΥΛΛΗΨΗ ΙΔΕΑΣ
          • ΕΠΕΞΕΡΓΑΣΙΑ ΛΥΣΗΣ
          • ΚΑΤΑΣΚΕΥΗ
          • ΜΕΤΑΒΑΣΗ
          • ΓΙΑ ΚΑΘΕ ΦΑΣΗ
            • ΥΠΑΡΧΟΥΝ ΚΥΚΛΟΙ ΑΝΑΠΤΥΞΗΣ
              • ΠΡΟΔΙΑΓΡΑΦΕΣ
              • ΑΝΑΛΥΣΗ/ΣΧΕΔΙΑΣΗ
              • ΥΛΟΠΟΙΗΣΗ
              • ΕΛΕΓΧΟΣ
            • ΕΦΑΡΜΟΖΟΝΤΑΙ ΓΙΑ ΚΑΘΕ ΤΜΗΜΑ ΤΟΥ ΛΟΓΙΣΜΙΚΟΥ
        • ΟΝΤΟΤΗΤΕΣ/ΑΝΤΙΚΕΙΜΕΝΑ
    • ΔΙΟΙΚΗΣΗ ΕΡΓΟΥ
      • ΕΙΝΑΙ Η ΔΙΕΡΓΑΣΙΑ ΣΥΝΔΥΑΣΜΟΥ
        • ΣΥΣΤΗΜΑΤΩΝ
        • ΤΕΧΝΙΚΩΝ
        • ΓΝΩΣΗΣ
      • ΣΚΟΠΟΣ
        • ΟΛΟΚΛΗΡΩΣΗ ΕΡΓΟΥ
          • ΣΕ ΚΑΘΟΡΙΣΜΕΝΟ ΧΡΟΝΟ
          • ΣΕ ΚΑΘΟΡΙΣΜΕΝΟ ΠΡΟΥΠΟΛΟΓΙΣΜΟ
          • ΣΕ ΚΑΘΟΡΙΣΜΕΝΗ ΠΟΟΙΟΤΗΑ
          • ΜΕ ΣΥΓΚΕΚΡΙΜΕΝΑ ΧΑΡΑΚΤΗΡΙΣΤΙΚΑ
      • ΧΡΗΣΙΜΟΠΟΙΟΥΝΤΑΙ ΤΑ ΕΡΓΑΛΕΙΑ GANTT