Ανάπτυξη Web και Mobile Εφαρμογών

Ένα σεμινάριο στις σύγχρονες τεχνικές ανάπτυξης μεγάλων εφαρμογών στο σημερινό ιστό.

Ανακοινώσεις

Σχετικά

Το σεμινάριο διοργανώνεται από μέλη της φοιτητικής ομάδας λογισμικού DE.CO.DE. του Αριστοτελείου Πανεπιστημίου Θεσσαλονίκης. H DE.CO.DE. είναι μια ομάδα του ISSEL (Intelligent Systems & Software Engineering Laboratory), με υπεύθυνους τον καθηγητή κ. Περικλή Α. Μήτκα και τον Λέκτορα κ. Ανδρέα Λ. Συμεωνίδη, που ιδρύθηκε τον Οκτώβριο του 2010 και απαρτίζεται από προπτυχιακούς φοιτητές και υποψήφιους διδάκτορες του τμήματος Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών του ΑΠΘ. Τις παρουσιάσεις του σεμιναρίου θα επιμεληθούν οι Θεοδόσης Σουργκούνης, Αντώνης Χρυσόπουλος και Στέλιος Μόσχογλου.

Ο σχεδιασμός της παρούσας ιστοσελίδας έγινε από τον Θεοδόση Σουργκούνη, και σε αυτήν χρησιμοποιούνται εξ' ολοκλήρου νέες τεχνολογίες ανοιχτού κώδικα, όπως HTML5 και CSS3.

Οι βιντεοσκοπήσεις των διαλέξεων καθώς και η επεξεργασία και ανάρτηση των βιντεο θα γίνουν από τον Θάνο Κιντσάκη.

Ευχαριστούμε θερμά τον Δημήτρη Μανώλα για το σχεδιασμό της αφίσας.

Το σεμινάριο είναι μια ανεξάρτητη πρωτοβουλία. Δεν αποτελεί μέρος του προγράμματος σπουδών του τμήματος, το οποίο και δεν φέρει καμία ευθύνη για το περιεχόμενο και την εγκυρότητα των διαλέξεων καθώς και του υπόλοιπου υλικού. Είναι εμπνευσμένο από αντίστοιχη πρωτοβουλία των Διονύσης Ζήνδρος και Πέτρος Αγγελάτος, τους οποίους και ευχαριστούμε θερμά τόσο για το υλικό όσο και για τις πολύτιμες συμβουλές που παρείχαν.

Ομιλητές

  • ted

    Θεοδόσης "ted" Σουργκούνης

    Προπτυχιακός φοιτητής

    Ο Θεοδόσης είναι ο εμπνευστής αυτού του σεμιναρίου. Ειναι υπεύθυνος για όλα τα αντικείμενα, ενώ θα παρουσιάσει μέρος των html/css, της PHP, την JavaScript και τις mobile εφαρμογές.

  • stewie

    Αντώνης "stewie" Χρυσόπουλος

    Υποψήφιος διδάκτωρ

    Ο Αντώνης θα ασχοληθεί με το κομμάτι των βάσεων δεδομένων, της προστασίας ενώ θα παρουσιάσει και μέρος της PHP.

  • mostel

    Στέλιος "mostel" Μόσχογλου

    Προπτυχιακός φοιτητής

    Ο Στέλιος θα είναι υπεύθυνος για την html και css, ενώ θα παρουσιάσει τα προχωρημένα θέματα σε αυτές τις ενότητες.

Ομάδα

  • Αντωνάρας Δημήτρης

  • Αυδίκου Χριστίνα

  • Γιουμούκης Παναγιώτης

  • Καζά Κική

  • Κιντσάκης Θάνος

  • Κυπριώτη Κατερίνα

  • Μανδηλιώτης Δημήτρης

  • Μανώλας Δημήτρης

  • Πάπιστας Γιάννης

  • Τούμπας Κώστας

Creative Commons Attribution

Βιβλιογραφία

Καθώς το σεμινάριο αφορά διάφορους τομείς, προτείνουμε μια σειρά από 10 βιβλία. Μερικά από αυτά είναι διαθέσιμα δωρεάν νόμιμα στο Internet από τους εκδότες τους.

Η ύλη του σεμιναρίου καλύπτεται πλήρως από τις online δωρεάν πηγές, και δεν απαιτείται η αγορά κάποιου από τα παρακάτω βιβλία γι' αυτό. Ωστόσο, αν θεωρήσετε οτι θα τα χρειαστείτε για αναφορά στο μέλλον, υπάρχουν διαθέσιμα για online αγορά από το Amazon ή σε ελληνικά βιβλιοπωλεία.

Τα βιβλία που προτείνουμε είναι τα εξής:

Επίσης ως σημείο αναφοράς προτείνουμε τις ακόλουθες σελίδες:

Παρουσιάσεις

Εργασίες

Η καλύτερη εργασία θα δημοσιεύεται ως πρότυπο. Για την επιλογή της θα ελέγξουμε τη σωστή χρήση της εκάστωτε γλώσσας, όπως την περιγράφουμε στο μάθημα, καθώς και το πόσο κομψός/έξυπνος είναι ο κώδικας που χρησιμοποιήσατε.

  1. Τελική εργασία: Ολοκληρωμένη web εφαρμογή

    Ομαδική εργασία

    Η τελική εργασία θα απαιτεί τη συνεργασία σε ομάδες των τριών έως πέντε ατόμων. Τα άτομα θα είναι της επιλογής σας, ενώ όσοι δεν έχετε ομάδα μπορείτε να επικοινωνήστε με τους υπόλοιπους ενδιαφερόμενους στο forum. Η δήλωση της ομάδας θα γίνει μέσω email μέχρι τις 08/01/2012 στο info@webseminars.ee.auth.gr, και θα πρέπει να μας στείλετε ένα μήνυμα ανά ομάδα με το ονοματεπώνυμο, το email και το id σας.

    Εκφώνηση

    Στα πλαίσια της τελευταίας εργασίας, και με στόχο την πλήρη αξιοποίηση των γνώσεων που έχετε αποκομίσει σε όλο το εξάμηνο, καλείστε να αναπτύξετε μια μικρή αλλά πλήρη web εφαρμογή. Καθώς ο στόχος του σεμιναρίου είναι η κατανόηση του προγραμματισμού ιστοσελίδων συνολικά, και όχι μόνο η δυνατότητα χρήσης των επιμέρους εργαλείων-γλωσσών, θέλουμε να ξεκινήσετε από το μηδέν και να αναπτύξετε την εφαρμογή σας κάνοντας χρήση αυτών που έχετε μάθει μέσα στο εξάμηνο, αλλά και οποιασδήποτε άλλης γνώσης μπορείτε να αντλήσετε από το διαδίκτυο.

    Σε όλες τις εργασίες (συμπεριλαμβανομένης και της δικής σας ιδέας) θα πρέπει να κάνετε χρήση των XHTML Strict 1.0, CSS, PHP, MySQL, καθώς επίσης και να έχετε ένα σύστημα αυθεντικοποίησης χρηστών. Η JavaScript και η AJAX θα εκτιμηθούν ιδιαίτερα. Μπορείτε να χρησιμοποιήσετε jQuery, αλλά κανένα άλλο framework, βιβλιοθήκη ή CMS δε θα γίνει δεκτό.

    Προτεινόμενα Θέματα (ένα από τα παρακάτω)

    • Σελίδα τύπου Twitter Κάθε χρήστης βλέπει μια λίστα με τα twitts που αναρτούνται από άτομα που "ακολουθεί".
    • Forum Χρήστες, topics και αναρτήσεις σε κάθε topic. Προαιρετικά θα μπορούσαν να υπάρχουν κατηγορίες από topics, σελιδοποίηση των topics και των αναρτήσεων, avatars και βαθμολογία του κάθε χρήστη.
    • Ιστολόγιο Δημιουργία ενός blog με αναρτήσεις και σχόλια σε κάθε ανάρτηση. Θα υπάρχει σελίδα του χρήστη, με λίστα με τις αναρτήσεις του, κεντρική σελίδα με τις πιο πρόσφατες αναρτήσεις, ενώ θα πρέπει να υπάρχει και σελιδοποίηση των posts και των σχολίων. Μπορείτε να πάρετε ιδέες για τη δομή των blogs ή και για την εμφάνισή τους από εδώ ή και από εδώ.
    • Εικονολόγιο Δυνατότητα για κάθε χρήστη να ανεβάσει τις φωτογραφίες του και να τις μοιραστεί με τους φίλους του. Για κάθε φωτογραφία θα πρέπει να υπάρχει η δυνατότητα σχολιασμού ή και like.
    • Αγγελίες Σελίδα αγγελιών όπου κάθε χρήστης μπορεί να αναρτήσει αγγελίες, να δει αγγελίες άλλων και να σχολιάσει σε αγγελίες.
    • Ερωτοαπαντήσεις Σελίδα όπου μπορεί κανείς να αναρτήσει κάποια ερωτήματα και να περιμένει απαντήσεις.
    • Συλλογή αγαπημένων Κάθε χρήστης έχει μια συλλογή από αγαπημένες ιστοσελίδες τις οποίες μπορεί να μοιραστεί με τους φίλους του.
    • Σελίδα διαχείρισης αρχείων (τύπου rapidshare) Κάθε χρήστης μπορεί να ανεβάσει, να μετονομάσει ή να διαγράψει αρχεία στο λογαριασμό του. Τα αρχεία αυτά θα εμφανίζονται στην αρχική σελίδα ως λίστα με αρχεία προς download για όλους τους χρήστες.
    • Σελίδα πλειστηριασμών Κάθε χρήστης μπορεί να ξεκινήσει έναν πλειστηριασμό. Ορίζει μια αρχική τιμή για το προϊόν του, τη διάρκεια του πλειστηριασμού καθώς και την τιμή άμεσης αγοράς. Οι υπόλοιποι χρήστες μπορούν να προτείνουν το ποσό που μπορούν να δώσουν, ενώ στο τέλος αυτός που έχει δώσει το μεγαλύτερο ποσό κερδίζει τον πλειστηριασμό. Αν κάποιος επιλέξει να δώσει το ποσό της άμεσης αγοράς, ο πλειστηριασμός κλείνει και το αντικείμενο κατοχυρώνεται σε αυτόν.
    • Σελίδα ερωτήσεων Σελίδα όπου υπάρχει μεγάλο κοινό που κάνει ερωτήσεις, και μια μικρή ομάδα που τις απαντάει. Το σύστημα αυτό θα πρέπει να δίνει τη δυνατότητα υποβολής ερωτήσεων, καθώς και υπερψήφισης αυτών. Τελικά στην αρχική σελίδα θα πρέπει να εμφανίζονται οι ερωτήσεις με τις περισσότερες ψήφους, ενώ θα γίνεται διαχωρισμός απαντημένων και μη απαντημένων ερωτήσεων. Θα πρέπει να γίνεται σελιδοποίηση των αποτελεσμάτων (προαιρετικά με χρήση ajax και παράθεση της επόμενης σελίδας κάτω από την προηγούμενη), καθώς και αξιολόγηση χρηστών (με δικά σας κριτήρια). Προφανώς θα πρέπει να υπάρχουν διαφορετικά δικαιώματα χρηστών, ανάλογα με το είδος του χρήστη.
    • Δική σας ιδέα Θα εκτιμηθεί ιδιαίτερα. Αν θέλετε, μπορείτε να κάνετε κάτι απλό, ή πιο σύνθετο το οποίο θα συνεχίσει και μετά το σεμινάριο ως πραγματική υπηρεσία. Φυσικά θα σας βοηθήσουμε σε ότι χρειαστείτε.

    hosting

    Αν θέλετε να αναπτύξετε μια πραγματική υπηρεσία θα χρειαστείτε ένα domain name και μια υπηρεσία hosting. Αυτά προσφέρονται από διάφορες εταιρίες, όπως το papaki σε αρκετά χαμηλές τιμές. Έτσι θα μπορείτε να έχετε το δικό σας domain name (π.χ. example.com) και να παρέχετε γρήγορη και εύκολη πρόσβαση στην εφαρμογή σας. Θα χαρούμε να δούμε την εφαρμογή σας ολοκληρωμένη και διαθέσιμη online και φυσικά να τη χρησιμοποιήσουμε!

    Παράδοση

    Η παράδοση της εργασίας θα γίνει μέσω email στο info@webseminars.ee.auth.gr, μέχρι τις 08/01/2012. Θέλουμε να μας στείλετε

    1. την εργασία σας σε ένα συμπιεσμένο αρχείο rar
    2. το url στο οποίο μπορούμε να δούμε την υπηρεσία σας
    3. Μια σύντομη περιγραφή της εφαρμογής σας

    Η παράδοση θα γίνει μια φορά, και δε θα υπάρχει δυνατότητα βελτίωσης ή τροποποίησης.

    Μπορείτε να συζητήσετε σχετικά με υπηρεσίες για δωρεάν hosting στο forum.

    Η εργασία αυτή είναι υποχρεωτική, ενώ για την ολοκλήρωση της παρακολούθησης του σεμιναρίου δε μπορεί να παραληφθεί.

MySQL

  • Πως μπορώ να δημιουργήσω/διαχειριστώ τη βάση δεδομένων μου;

    Υπάρχουν 2 (επικρατέστεροι) τρόποι διαχείρισης της MySQL. Ο πρώτος είναι κατευθείαν μέσω της κονσόλας (από το μενού το wamp τα windows, μέσω της εντολής 
    mysql -u username -p
    στα linux), ενώ ο δεύτερος με το γραφικό περιβάλλον phpMyAdmin (συνήθως στη διεύθυνση http://127.0.0.1/phpMyAdmin, εφόσον έχει εγκατασταθεί σωστά).

  • Αποθηκεύω ελληνικούς χαρακτήρες στη βάση δεδομένων μου, αλλά δεν εμφανίζονται σωστά.

    Για να διαχειριστείς ελληνικούς χαρακτήρες στην MySQL θα πρέπει να κάνεις μια σειρά από πράγματα:
    1. Να ορίσεις στη βάση δεδομένων αλλά και στους πίνακές σου κωδικοποίηση UTF8.
    2. Κατά την εκτέλεση εντολών στη MySQL, αμέσως μετά από τη σύνδεσή σας (μέσω κονσόλας ή με την mysql_connect) θα πρέπει να εκτελέσετε το ερώτημα 
      SET NAMES UTF8;
    3. Τέλος, μην ξεχνάς να ορίσεις την κωδικοποίηση της σελίδας σου σε UTF8

  • Πως μπορώ να είμαι σίγουρος οτι η σχεδίασή μου είναι σωστή;

    Δεν υπάρχει αποκλειστικά μια σωστή μορφή για κάποια βάση. Σε γενικές γραμμές ακολούθησε τους κανόνες από τις διαφάνειες της πρώτης διάλεξης. Για μεγαλύτερη εμβάθυνση μπορείς να δεις εδώ.

  • Πως μπορώ να αποθηκεύσω μια εικόνα στη βάση δεδομένων μου;

    Μια εικόνα μπορεί να αποθηκευτεί στη βάση δεδομένων με δυαδική μορφή. Ωστόσο συνιστάται να αποθηκευτεί ως ξεχωριστό αρχείο, ενώ στη βάση να υπάρχει μια αναφορά προς αυτό (url).

  • Εκτελώ κάποιο query, και μετά η mysql_fetch_array δεν εκτελείται και επιστρέφει warning.

    Αυτό σημαίνει οτι υπήρξε κάποιο πρόβλημα με το query. Μπορείς να δεις το πρόβλημα καλώντας τη mysql_error() αμέσως μετά την mysql_query(), ή εκτελώντας το query κατευθείαν στη mysql (ή στο phpMyAdmin).

  • Πως μπορώ να εγκαταστήσω το phpMyAdmin στα linux;

    Σε ubuntu χρησιμοποίησε την εντολή sudo apt-get install phpmyadmin, και ακολούθησε τις οδηγίες. Μπορείς να βρεις το phpMyAdmin στη διεύθυνση http://127.0.0.1/phpMyAdmin. Σε περίπτωση που αυτή η διεύθυνση δεν είναι διαθέσιμη, (ενώ η http://127.0.0.1/ είναι), πρόσθεσε την παρακάτω γραμμή στο αρχείο /etc/apache2/apache2.conf 
    Include /etc/phpmyadmin/apache.conf
    και επανεκκίνησε τον apache server (sudo /etc/init.d/apache2 restart).

  • Έχω αλλάξει τον κωδικό μου στη MySQL και το phpMyAdmin μου εμφανίζει μήνυμα σφάλματος "Access denied".

    Το phpMyAdmin είναι ρυθμισμένο να συνδέεται στη βάση κάνοντας χρήση των default στοιχείων, "root" και "". Αν αλλάξετε το χρήστη ή τον κωδικό στη MySQL θα πρέπει να ρυθμίσετε το phpMyAdmin ανάλογα. Τα στοιχεία αυτά είναι αποθηκεύμένα στη διεύθυνση C:\wamp\apps\phpmyadmin#.#.#\config.inc.php.

PHP

  • Γιατί η PHP μου εμφανίζεται στον browser και δεν τρέχει;

    Για να εκτελεστεί η PHP χρειάζεται ένας κατάλληλα ρυθμισμένος web server. Θα πρέπει να εγκαταστήσεις κάποιον, όπως δείχνουμε στην πρώτη διάλεξη για PHP (wamp ή lamp), και να ανοίξεις τη σελίδα σου μέσω αυτού του server, στο http://localhost ή http://127.0.0.1.
    Ακόμη, το αρχείο που περιέχει την php πρέπει να έχει κατάληξη .php.

  • Έχω εγκαταστήσει τον wamp, αλλά μου βγάζει σφάλμα όταν πάω να τον βάλω online, ή τον έβαλα online αλλά δε μπορώ να δω τη σελίδα μου

    Σε περίπτωση που έχεις εγκατεστημένο το Skype, θα πρέπει να επιλέξεις από τις ρυθμίσεις του να μην χρησιμοποιεί την πόρτα 80, που είναι αυτή που χρησιμοποιεί ο apache server. Εναλλακτικά, μπορείς να ανοίξεις πρώτα τον wamp και μετά το skype, ή να χρησιμοποιήσεις διαφορετική πόρτα στον apache (στις ρυθμίσεις του apache, όπως φαίνεται στην πρώτη διάλεξη για PHP).

  • Η PHP μου εμφανίζει κάποιο Fatal error, Warning, Notice κλπ

    Διάβασε προσεκτικά το error. Τις περισσότερες φορές είναι αρκετά επεξηγηματικό. Συνήθως σου λέει και τη γραμμή στην οποία παρουσιάζεται το πρόβλημα.

  • Δεν ξέρω πως να κάνω * / το * μου εμφανίζει λάθος αποτελέσματα ή δε δουλεύει όπως περιμένω.

    Η PHP έχει πολύ βολικό documentation, το οποίο βρίσκεται εδώ. Δοκίμασε να ψάξεις στο google για το πρόβλημα που σου παρουσιάστηκε, ή για αυτό που προσπαθείς να κάνεις. Πιθανές αναζητήσεις: 
    php GET variable
php strpos
php explode
php how to connect to mysql
php how to sort an array
αλλά και
php notice undefined index
php notice undefined variable

  • Προσπαθώ να διαβάσω μια τιμή του πίνακα $_GET και μου εμφανίζει Undefined index

    Το μήνυμα αυτό σημαίνει οτι στον πίνακα $_GET δεν έχει οριστεί η τιμή που ψάχνεις. Είτε δεν έχεις στείλει τη φόρμα σου (είναι η πρώτη φορά που μπαίνεις), είτε την έχεις στείλει αλλά έχεις κάνει λάθος στο όνομα της μεταβλητής. Μπορείς να ελέγξεις αν έχουν σταλεί δεδομένα στη σελίδα μέσω GET κοιτόντας το url στο οποίο βρίσκεσαι. Θα πρέπει να είναι της μορφής: http://localhost/index.php?variable=value&nextvariable=nextvalue.
    Για να ελέγξεις τι πραγματικά υπάρχει μέσα στον πίνακα $_GET, μπορείς να χρησιμοποιήσεις τη συνάρτηση var_dump, ως εξής: var_dump( $_GET );.

HTML / CSS tricks

  • Πως μπορώ να τοποθετήσω ένα πλαίσιο στο κέντρο της σελίδας;

    Για να τοποθετήσεις ένα πλαίσιο στο κέντρο της σελίδας θα πρέπει να ορίσεις το πλάτος του καθώς και τα margin-left και margin-right σε auto. Παράδειγμα: 
    div.container{
    width: 900px;
    margin-left: auto;
    margin-right: auto;
}

  • Ορίζω μια συγκεκριμένη τιμή στο πλάτος ενός πλαισίου, αλλά αυτό βγαίνει μεγαλύτερο.

    Το ορατό πλάτος ενός πλαισίου είναι το άθροισμα του width και του padding. Σε περίπτωση που έχεις ορίσει ή υπάρχει εξ' ορισμού στο elemenet κάποιο padding, προσάρμοσε τις τιμές του padding και του width ανάλογα ώστε να έχεις το επιθυμητό συνολικό πλάτος. Αντίστοιχα και με το ύψος. Elements με προκαθορισμένο padding: ul, ol κλπ.

  • Πως μπορώ να δω αν κάποιο element έχει προκαθορισμένες τιμές στις CSS ιδιότητές του;

    Για να δεις τις προκαθορισμένες τιμές ενός στοιχείου χρησιμοποίησε τον Chrome Web Inspector ή τον Firebug / Firebug light όπως περιγράφουμε στην 5η διάλεξη.

  • Το κείμενό μου βγαίνει στα "Κινέζικα". Τι να κάνω;

    Για να εμφανίζεται το κείμενο στα Ελληνικά θα πρέπει να κάνεις 2 πράγματα:
    1. Να αποθηκεύσεις το αρχείο που περιέχει τα ελληνικά γράμματα με κωδικοποίηση utf-8 (αυτό μπορείς να το κάνεις με notepad++ από την επιλογή Encoding).
    2. Να "πεις" στον browser του χρήστη οτι χρησιμοποιείς utf-8. Αυτό το κάνεις με χρήση μεταδεδομένων: είτε τοποθετείς το 
      <?xml version="1.0" encoding="utf-8"?>
      στην αρχή της σελίδας σου (ακριβώς πριν το DOCTYPE) ή το 
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      ως παιδί στο head.

  • Πως μπορώ να τοποθετήσω πολλά πλαίσια το ένα δίπλα στο άλλο;

    Για να τοποθετήσεις περισσότερα του ενός πλαίσια στη σειρά, εφόσον τους ορίσεις συγκεκριμένο πλάτος, χρησιμοποίησε την ιδιότητα float: left;. Θυμίσου πως μόλις τελειώσεις τα στοιχεία που θέλεις να βρίσκονται στη σειρά, για να τοποθετήσεις κάποιο στοιχείο κάτω από αυτά θα πρέπει να του ορίσεις την ιδιότητα clear: both;.

  • Πως μπορώ να αποφύγω το διπλό border σε συνεχόμενα πλαίσια;

    Χρησιμοποίησε μόνο border-left σε κάθε ένα από αυτά εκτός του τελευταίου, στο οποίο όρισε και border right.

  • Προσπαθώ να τοποθετήσω 3 πλαίσια στη σειρά, αλλά το τελευταίο πηγαίνει στην από κάτω σειρά.

    Αυτή είναι η συμπεριφορά του browser όταν τα πλαίσια αυτά δε χωράνε στον "πατέρα" τους. Θυμίσου πως σε αυτή την περίπτωση, για να υπολογίσεις το συνολικό πλάτος που καταλαμβάνει το κάθε πλαίσιο θα πρέπει να προσθέσεις το width, το padding, το border και το margin. Το άθροισμα αυτό θα πρέπει να είναι μικρότερο ή ίσο με το width του πατέρα.

  • Ορίζω padding/margin top σε μια παράγραφο αλλά η απόσταση από πάνω δεν αλλάζει.

    Σε περίπτωση που έχεις elements με float, όρισε clear: both; στην παράγραφο που σε απασχολεί.

  • Δεν έχω καθόλου margin ή padding στο body, αλλά το περιεχόμενό μου εξακολουθεί να έχει απόσταση από το πάνω μέρος της οθόνης

    Πολλά elements έχουν προκαθορισμένες μορφοποιήσεις. Για παράδειγμα, τα elements h# και p έχουν margin top και bottom. Δοκίμασε να τα αφαιρέσεις, ακόμα κι αν δεν είναι άμεσα παιδιά του body.

  • Που μπορώ να βρώ το σύμβολο του Copyright;

    Εδώ. ( Hint: το HTML entity είναι: &copy; )

  • Πρέπει να ορίσω μια εικόνα ως background-image από CSS, ή να την εισάγω στην HTML;

    Η ερώτηση αυτή ανάγεται στην αρχική ερώτηση, τι είναι περιεχόμενο και τι μορφοποίηση. Αν η εικόνα αυτή αποτελεί περιεχόμενο της σελίδας τότε πρέπει να οριστεί στην HTML. Σε αντίθετη περίπτωση είναι καλό να οριστεί μέσω της CSS. Παραδείγματα εικόνων που αποτελούν περιεχόμενο:
    • Εικόνα του προφίλ ενός χρήστη.
    • Οι εικόνες σε αναζήτηση εικόνων σε κάποια μηχανή αναζήτησης
    • Η εικόνα που φαίνεται στο δεξί μέρος ενός άρθρου στη wikipedia
    • Η εικόνα της ταινίας που περιγράφεται σε μια σελίδα του IMDb
    Παραδείγματα εικόνων που αποτελούν μορφοποίηση:
    • Το φόντο της παρούσας σελίδας
    • Η εικόνα που αναγράφει το logo μιας σελίδας: στο css-tricks, στο facebook κλπ.

Γενικές ερωτήσεις.

  • Κάθε πότε θα γίνονται οι παρουσιάσεις;

    Οι παρουσιάσεις θα γίνονται 2 φορές την εβδομάδα, Δευτέρα και Τετάρτη 19:00-21:00. Θα ολοκληρωθούν λίγο πριν την έναρξη της χειμερινής εξεταστικής 2012.

  • Πού θα γίνονται οι διαλέξεις;

    Το σεμινάριο θα γίνεται στο μικρό αμφιθέατρο του πολυτεχνείου, μπαίνοντας από την κεντρική είσοδο του Πολυτεχνείου αριστερά κάτω από το αμφιθέατρο Παναγιωτόπουλος.

  • Σε ποιους απευθύνεται το σεμινάριο;

    Το σεμινάριο είναι ανοιχτό σε κάθε ενδιαφερόμενο. Απευθύνεται κυρίως σε φοιτητές του τμήματος Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών όλων των εξαμήνων που επιθυμούν να γνωρίσουν στην πράξη και να εξοικειωθούν με τις τεχνολογίες που χρησιμοποιούνται για την ανάπτυξη σελίδων και εφαρμογών στο διαδίκτυο. Απευθύνεται επίσης σε φοιτητές άλλων σχολών, αλλά και σε οποιονδήποτε θα ήθελε να ασχοληθεί με τις συγκεκριμένες τεχνολογίες.

  • Υπάρχουν προαπαιτούμενες γνώσεις για την παρακολούθηση του σεμιναρίου;

    Όχι. Η παρακολούθηση του σεμιναρίου δεν προϋποθέτει ιδιαίτερες γνώσεις υπολογιστών καθώς απευθύνεται σε αρχάριους. Οι παρουσιάσεις των θεματικών ενοτήτων έχουν δομηθεί έτσι ώστε να ξεκινούν από τις πρωταρχικές έννοιες,να τις αναπτύσσουν σταδιακά με οργανωμένο και μεθοδικό τρόπο και τελικά να καταλήγουν στα πιο προχωρημένα θέματα ανάπτυξης λογισμικού. Η εξοικείωση με κάποια γλώσσα προγραμματισμού ή τουλάχιστον με θεμελιώδεις έννοιες προγραμματισμού και στοιχειώδεις γνώσεις της Επιστήμης Υπολογιστών θα βοηθούσε, χωρίς όμως να κρίνεται απαραίτητη.

  • Τι θα είμαι σε θέση να κάνω μετά το πέρας του σεμιναρίου;

    Σκοπός του σεμιναρίου είναι οι συμμετέχοντες να αποκτήσουν ευχέρεια με τις πιο σημαντικές τεχνολογίες ανάπτυξης διαδικτυακών εφαρμογών, να πειραματιστούν με το διαδικτυακό προγραμματισμό και να ενημερωθούν για τις τελευταίες εξελίξεις στο χώρο του Web Development (HTML 5, CSS 3, mobile applications). Μετά το πέρας των μαθημάτων, εφόσον ασχοληθούν ενεργά, θα είναι σε θέση να αναπτύσσουν εφαρμογές ακολουθώντας πρότυπα οργάνωσης και τεχνικές επαγγελματικού επιπέδου.

  • Τι πρέπει να κάνω για να δηλώσω συμμετοχή;

    Τίποτα. Δεν απαιτείται κάποια εγγραφή για την παρακολούθηση του σεμιναρίου. Όποιος ενδιαφέρεται το μόνο που έχει να κάνει είναι να έρθει τις προκαθορισμένες ώρες στις παρακολουθήσεις!

  • Ποιες είναι οι θεματικές ενότητες;

    Οι ενότητες που θα καλύψουμε στις παρουσιάσεις είναι οι εξής:
    • Eισαγωγή και προχωρημένα θέματα σε XML, XHTML, CSS, διαχωρισμός περιεχομένου και παρουσίασης.
    • Γενικές πληροφορίες – Εισαγωγή στην HTML 5, και τη CSS 3.
    • Εισαγωγή στα Δίκτυα Υπολογιστών. Πρωτόκολλα TCP/IP και HTTP, Domain Names, DNS, Client – Server Model, Get – Post Commands.
    • Στήσιμο from-scratch σε Linux Apache – MySQL – PHP, File Permission.
    • Εισαγωγή και προχωρημένα θέματα στον αντικειμενοστραφή προγραμματισμό με PHP.
    • Εισαγωγή στις σχεσιακές βάσεις δεδομένων και χρήση τους σε πρακτικό επίπεδο.
    • Εισαγωγή στην MySQL.
    • Εφαρμογή των PHP και MySQL για ανάπτυξη client-server εφαρμογών.
    • Θέματα δόμησης κώδικα: Front-End – Back-End, Controllers, Η αρχιτεκτονική MVC.
    • Διδασκαλία της γλώσσας προγραμματισμού Javascript για την ανάπτυξη διαδραστικών σελίδων.
    • AJAX: Συνδυασμός Javascript και αρχιτεκτονικής client-server.
    • Debugging Javascript – Javascript Events.
    • Κανονικές εκφράσεις (regular expressions) σε PHP και Javascript. Πρότυπα ΒΟΜ – DOM. Συναρτησιακός Προγραμματισμός σε Javascript.
    • Ανάπτυξη Mobile εφαρμογών με διάφορες τεχνικές και τεχνολογίες. Βελτιστοποίηση σε εφαρμογές κινητών και PDAs. Θέματα ταχύτητας και ορθότητας σε περίπτωση μεγάλης ανταπόκρισης.
    • Ασφάλεια: SQL injections, XSS. Απομακρυσμένη εκτέλεση κώδικα. Firewalls. DoS και DDoS.
    • Ανάπτυξη λογισμικού σε ομάδες: Version control με χρήση του subversion και του git.
    • Έλεγχος ορθότητας με unit testing, και test-driven development.

  • Στην ύλη του σεμιναρίου αναφέρεται η ανάπτυξη mobile εφαρμογών. Θα μιλήσουμε για τεχνολογίες όπως cocoa, android sdk κλπ;

    Όχι. Η ανάπτυξη των εφαρμογών για κινητά θα γίνει εξ' ολοκλήρου με web τεχνολογίες, όπως αυτές που αναφέρονται στην ύλη του σεμιναρίου.

  • Υπάρχει επικάλυψη των θεματικών ενοτήτων του σεμιναρίου με μαθήματα του τμήματος Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών;

    Όχι. Σκοπός του σεμιναρίου είναι να παρουσιάσει μια σειρά σύγχρονων τεχνολογιών και να εστιάσει στον τρόπο εφαρμογής τους. Ο προσανατολισμός του είναι πρακτικός και σε καμία περίπτωση δε στοχεύει να υποκαταστήσει τα μαθήματα της σχολής. Τα περισσότερα από τα θέματα που θα παρουσιαστούν στα πλαίσια του σεμιναρίου δεν καλύπτονται και δεν συσχετίζονται άμεσα με μαθήματα του προγράμματος σπουδών. Κάποιες πολύ βασικές ενότητες της HTML παρουσιάζονται στο εργαστήριο του μαθήματος Συστήματα Υπολογιστών (1ο εξάμηνο). Επίσης, τα μαθήματα του Τομέα Ηλεκτρονικής και Η/Υ, Δίκτυα Ι&ΙΙ (7ο και 8ο εξάμηνο), Τεχνολογία Λογισμικού (8ο εξάμηνο), Ασφάλεια Συστημάτων (9ο εξάμηνο) και Βάσεις Δεδομένων (9ο εξάμηνο) καλύπτουν λεπτομερώς το θεωρητικό υπόβαθρο για τις θεματικές ενότητες των δικτύων, της δόμησης κώδικα, της ασφάλειας και των σχεσιακών βάσεων αντίστοιχα.

  • Θα υπάρχουν εργασίες;

    Ναι. Μια σειρά από προαιρετικές εργασίες θα ανατεθούν κατά τη διάρκεια του σεμιναρίου με σκοπό να βοηθήσουν στην κατανόηση και να ωθήσουν τους ενδιαφερόμενους να εφαρμόσουν τις γνώσεις τους στην πράξη. Τα θέματα των εργασιών θα αναρτώνται στην ιστοσελίδα του σεμιναρίου. Η προθεσμία για την υποβολή των εργασιών θα είναι 1 βδομάδα μετά την ανάθεσή τους. Στη συνέχεια οι εργασίες θα αποστέλονται μέσω μέιλ και θα διορθώνονται από μέλη της ομάδας DECODE.

  • Αν παρακολουθήσω το σεμινάριο θα πρέπει να κάνω και τις εργασίες;

    Όχι. Η ενασχόληση με τις εργασίες δε θα υποχρεωτική, αλλά συστήνεται ανεπιφύλακτα σε όσους επιθυμούν να μάθουν στην πράξη και να εμβαθύνουν στις θεματικές ενότητες.

  • Θα λάβω κάποια βεβαίωση παρακολούθησης του σεμιναρίου;

    Όλοι οι συμμετέχοντες που θα ολοκληρώσουν και θα παραδώσουν τις εργασίες, θα λάβουν βεβαίωση παρακολούθησης του σεμιναρίου από τους διδάσκοντες.

  • Τα σεμινάρια αναγνωρίζονται από κάποιον φορέα;

    Όχι. Τα σεμινάρια δεν αναγνωρίζονται επίσημα από κάποιον φορέα. Ωστόσο, η βεβαίωση παρακολούθησης που θα δωθεί μετά το πέρας των σεμιναρίων αποτελεί αποδεικτικό γνώσης των αντίστοιχων ενοτήτων.

  • Αν χάσω κάποια παρουσίαση, μπορώ να την παρακολουθήσω μέσω διαδικτύου;

    Ναι. Όλες οι παρουσιάσεις θα βιντεοσκοπηθούν και θα ανεβαίνουν στο διαδίκτυο μερικές μέρες μετά τα μαθήματα.

  • Μένω σ’άλλη πόλη, μπορώ να παρακολουθήσω το σεμινάριο διαδικτυακά;

    Ναι. Όσοι δεν έχουν τη δυνατότητα να παρευρίσκονται στις παρουσιάσεις, εφόσον το επιθυμούν θα μπορούν να παρακολουθήσουν τις βιντεοσκοπημένες διαλέξεις και να ανεβάσουν τις εργασίες κανονικά.

  • Χρειάζεται να προετοιμάζομαι πριν από κάθε μάθημα;

    Δεν είναι υποχρεωτικό. Ωστόσο, πριν από κάθε παράδοση, θα ανεβαίνει στην ιστοσελίδα του σεμιναρίου προτεινόμενο βοηθητικό υλικό για μελέτη.

  • Αν θέλω να επικοινωνήσω μαζί σας, σε ποιον θα πρέπει να απευθυνθώ;

    Μπορείς να μας στείλεις email στη διεύθυνση info@webseminars.ee.auth.gr. Επίσης, θα παρακολουθούμε το forum, το facebook και το twitter.
Sun Moon
cloudcloudcloudcloud
Day/Night