[Powered by Google Translate] [Σεμινάριο] [Web Development: Από την ιδέα στην Εφαρμογή] [Ben Kuhn] [Billy Janitsch] [Πανεπιστήμιο Χάρβαρντ] [Αυτό είναι CS50] [CS50.TV] [Billy] Γεια σας, είμαι ο Billy και αυτός είναι ο Μπεν. >> [Ben] Γεια σας. Εμείς πάμε να μιλάμε για την ανάπτυξη web σήμερα. [Webdev] [Billy Janitsch και Ben Kuhn] Ένα κομμάτι για μας πρώτα. Ο Ben είναι το είδος του back-end τύπος. Κάνει τα πράγματα λειτουργούν. Και στη συνέχεια να πάω μέσα και να τους αρκετά. Είμαι συμμετέχουν σε μεγάλο βαθμό με περισσότερα front-end είδος σχεδίου διάταξης πράγματα, και Ben, από την άλλη πλευρά, ξέρει τι κάνει έτσι λειτουργεί σε back-end πράγματα. Μαζί έχουμε κάνει μερικά πράγματα. Για παράδειγμα, πέρυσι εργάστηκαν για Gimblium το οποίο είναι ένα online στούντιο ανάπτυξης παιχνιδιών. Αυτό ήταν το τελευταίο έργο μας για την τάξη, και από τότε έχουμε κάνει Χάρβαρντ Class το οποίο είναι ένα online πλαίσιο για περιήγηση και ψώνια μαθήματα στο Χάρβαρντ. 

Εμείς πάμε για να αρχίσει με αυτή την ιδέα για την ιστοσελίδα μας. Εμείς πάμε για να κάνει το Facebook, αλλά και για τις γάτες. Πριν κάνετε πραγματικά αυτό το δικτυακό τόπο, δεν κάνουν αυτή την ιστοσελίδα επειδή δεν είναι καλό? αλλά θα το χρησιμοποιούν ως πλαίσιο και να περάσουν από τη διαδικασία για το πώς παίρνουμε την ιδέα και να το μετατρέψει σε ένα πραγματικό δικτυακό τόπο που μπορούμε να χρησιμοποιήσουμε. Θα ξεκινήσουμε με το σπάσιμο της ιστοσελίδας κάτω. Όπως έχετε κάνει σε CS50, θέλετε να σκεφτούμε ποια είναι τα πραγματικά στοιχεία που πηγαίνουν σε αυτό το δικτυακό τόπο. Βασικά στροφή από μια ιδέα που είναι ακριβώς το είδος της μια αφηρημένη έννοια σε ένα πραγματικό, απτό πράγμα που θα μπορούσατε να κάνετε. Ξεκινάμε με μερικές ερωτήσεις. Τι είναι αυτή η ιστοσελίδα; Γιατί το κάνει; Τι είναι αυτό πρόκειται να χρησιμοποιηθεί για; Αυτό το είδος του πράγματος. Στην περίπτωση του Facebook Cat, θέλουμε ουσιαστικά μια ιστοσελίδα που σας επιτρέπει γάτες κοινωνικό δίκτυο με το άλλο. Η ιδέα είναι ότι μπορείτε να προσθέσετε στους τοίχους του άλλου, μπορούν να κάνουν σχόλια, αυτό το είδος του πράγματος. Και εκεί είναι που έρχονται σε λειτουργικά συστατικά. Έχουμε τώρα αυτό το είδος του πλαισίου του - έχουμε τα προφίλ χρηστών, έχουμε τα σχόλια, και μπορούμε να δημοσιεύσετε. Ίσως κάποια μέρα θα με δυνατότητα επιρροής συμπαθεί και αυτό το είδος του πράγματος. Και εμείς σαν να θέλω να δοθεί προτεραιότητα αυτά τα χαρακτηριστικά θα in Θέλουμε να πω, όπως, εντάξει, είναι πολύ σημαντικό ότι ο καθένας έχει ένα προφίλ και ότι όλοι μπορούν να δημοσιεύουν στους τοίχους του άλλου. Δευτερευόντως ως προς αυτό, τα σχόλια θα ήταν ωραίο. Ίσως αργότερα θα με δυνατότητα επιρροής συμπαθεί. Έτσι, θέλετε να έχετε μια ιδέα του τι είναι θεμελιώδους σημασίας για το έργο σας και τι είναι ένα είδος πιο γενικό χαρακτηριστικό που θα μπορούσε να εφαρμοστεί αργότερα. Θέλετε να είδος έχει μια συγκεκριμένη λίστα στο μυαλό, αλλά το έργο που θα ξεκινήσετε με το να μην πρόκειται να είναι το έργο που θα τελειώσει με. Με άλλα λόγια, δεν πρόκειται να αλλάξει, ενώ εσείς την ανάπτυξη του τόπου, και θέλετε να αφήνουν περιθώρια για κάτι τέτοιο. Θα το παραδώσει στον Ben ο οποίος πρόκειται να μιλήσουμε λίγο για τη δομή. 

[Ben] Πάω να μιλάμε για την πιο τεχνική πλευρά της ανάπτυξης ιστοσελίδων. Ας πάμε πάνω από κάποια βασικά πρώτα. Όταν κάνεις ένα web app, το κύριο τμήμα που θα πάμε να πρέπει να έχετε είναι θα πάμε να έχουν κάποια πράγματα συμβαίνουν στην πλευρά του πελάτη - δηλαδή, ο κώδικας που είστε browser γίνεται από την ιστοσελίδα και η JavaScript, HTML, CSS πράγματα. Αυτό είναι το μόνο στην πλευρά του client. Θα πάμε να έχουν άλλο κώδικα που τρέχει στην πλευρά του διακομιστή η οποία παρακολουθεί όλα τα δεδομένα που οι άνθρωποι στέλνουν σε σας, αποφασίζει σε ποιον να δώσει ό, τι, τέτοια πράγματα. Αυτό είναι μόνο κάποια ορολογία, έτσι ώστε εσείς είστε όλοι εξοικειωμένοι με το τι μιλάμε. Πέρα από αυτό το τμήμα είναι καλό να σκεφτούμε web app σας από την άποψη της ένα ζευγάρι από διαφορετικές συνιστώσες. Όταν κάνετε ανάπτυξης ιστοσελίδων ένα από τα πράγματα που θα πρέπει πάντα να προσπαθούμε να κάνουμε είναι να μειώσει την πολυπλοκότητα. Το πιο πολύπλοκο κώδικα σας είναι η μεγαλύτερη πιθανότητα είναι εκεί για να κάνουν σφάλματα, τόσο πιο δύσκολο είναι να αλλάξει αργότερα. Έτσι, εάν μπορείτε να διαλύσει app σας σε κάποιες διακριτές λειτουργικές περιοχές ότι θα - και μπορείτε να μειώσετε το είδος του ποσού της επικοινωνίας cross-περιοχή - που θα σας βοηθήσει πολύ σε μακροπρόθεσμη βάση όσον αφορά τη μείωση των bugs. 

Για να είναι συγκεκριμένες, συνήθως οι άνθρωποι χωρίζουν ένα web app σε - αυτά είναι το είδος των τσιτάτο τώρα, αλλά είναι ακόμα χρήσιμο. Μπορεί να έχετε ακούσει ανθρώπους να μιλούν για τα μοντέλα, προβολές και ελεγκτές. Τα μοντέλα είναι τα πραγματικά δεδομένα που app σας πρόκειται να ασχοληθεί με. Για παράδειγμα, στη γάτα σας στο Facebook, τα μοντέλα σας θα είναι - θα ήθελα να έχουμε ένα πρότυπο, όπως θέσεις, και ένα μοντέλο για τα προφίλ χρηστών, τέτοια πράγματα. Οι απόψεις σας είναι το πώς θα παρουσιάσει αυτά τα δεδομένα για τους χρήστες σας. Μπορεί να έχετε 1 άποψη για την αναζήτηση σε μια ενιαία θέση και όλα τα σχόλια και μια διαφορετική άποψη για τον τοίχο σας που έχει μια λίστα με όλες τις δημοσιεύσεις που απευθύνονται σε εσάς, και μια διαφορετική άποψη για τις ζωοτροφές ειδήσεις σας - τέτοια πράγματα. Τέλος, έχετε τους ελεγκτές που είναι βασικά όταν οι άνθρωποι σας στείλει μηνύματα και να κάνετε ενημερώσεις για back-end σύστημα, που αυξάνεις μια δέσμη των μετρητών, και οτιδήποτε άλλο. Αυτοί είναι οι υπεύθυνοι για σας. 

Πάω να μιλάμε κυρίως για τα μοντέλα. Προβολές δεν είναι τεχνικά τόσο δύσκολο και το θέμα είναι περισσότερο με το σχεδιασμό τους Οι ελεγκτές θα είναι ειδικά για ό, τι σχεδιάζετε. Αλλά υπάρχουν μερικές πολύ γενικές τεχνικές που μπορείτε να χρησιμοποιήσετε να κάνουν τα μοντέλα σας καλύτερο και πιο εύκολο να εργαστεί με αυτό νομίζω ότι είναι πολύ χρήσιμη. Αυτό είναι ως επί το πλείστον πρόκειται να είναι για το πώς να ασχοληθεί με τα δεδομένα web εφαρμογές σας σε ένα ωραίο τρόπο. Τα κύρια θέματα με τα μοντέλα είναι ότι ζουν στον υπολογιστή-πελάτη και του διακομιστή και πρέπει να καταλάβω α) πώς να τους πάρει - όλες τις σχετικές αυτές - από το διακομιστή στον πελάτη, και β) πώς να τους κρατήσει σε συγχρονισμό. Οι χρήστες σας πρόκειται να θέλουν να κάνουν κάποιες ενημερώσεις. Θα πάμε να θέλουν να κάνουν νέες θέσεις. Θα πάμε να θέλουν να αρέσει τα πράγματα και τα πράγματα, αν έχετε συμπαθεί. Αυτές είναι οι κύριες τεχνικές προκλήσεις που ασχολούνται με τα μοντέλα. Το πρώτο πράγμα που πρόκειται να θέλετε να ρωτήσετε τον εαυτό σας είναι τι είδος των δεδομένων που πηγαίνει σε αυτό το μοντέλο και τι είδους ερωτήματα θα πάμε να θέλουν να κάνουν - Δηλαδή, πώς θα πάμε να δούμε τα μοντέλα; Για Cat Facebook παράδειγμά σας, θέση σας θα έχει έναν συγγραφέα που συνδέονται με αυτό, μερικές από τις μετά τοίχο κειμένου, και ο αποδέκτης της θέσης τοίχο. Και τότε ίσως να θέλετε να αναζητήσετε ότι σε ένα σωρό διαφορετικούς τρόπους. Θα θέλατε να το δει κανείς από που έγραψε η οποία μετά, από τα οποία έλαβαν οι οποίες μετά, ίσως από την ημερομηνία που καταχωρήθηκε. Αλλά αν πρόκειται να το κάνουμε από την ημερομηνία, τότε θα πρέπει να προσθέσετε ένα άλλο πεδίο στη θέση σας του όταν ήταν στην πραγματικότητα δημοσιεύτηκε. Αυτές οι 2 παράγοντες - ποια δεδομένα που θέλετε να χρησιμοποιήσετε και πώς θέλετε να το δείτε - θα πρέπει να σκεφτείτε για τους πρώτα, επειδή εξαρτώνται από κάθε άλλη, και πρόκειται να είναι πιο δύσκολο να τα προσθέσετε αργότερα. 

Υπάρχουν κάποιες άλλες σκέψεις. Όταν σκέφτεστε για το πώς θα ασχοληθεί με τα μοντέλα στο διακομιστή τι θέλετε να εξετάσουμε είναι - που ουσιαστικά θέλουν να κάνουν ο διακομιστής όσο το δυνατόν απλούστερη. Να κάνει τα πράγματα από την πλευρά του πελάτη είναι γενικά πολύ πιο γρήγορα εάν μπορείτε να το κάνετε αποκλειστικά για τον πελάτη χωρίς να κάνει οποιοδήποτε είδος της εντολής δικτύου. Η ιδέα είναι να κάνουμε όσες από τις ερωτήσεις όπως μπορείτε για τον πελάτη. Το μόνο πρόβλημα με αυτό είναι ότι εάν έχετε ζητήσει όλα τα δεδομένα σας από την αρχή τότε αυτό πρόκειται να πάρει πολύ χρόνο για να φορτώσει. Έτσι, η ιδέα είναι να βρεθεί μια χρυσή τομή μεταξύ του να έχει αρκετά στοιχεία για τον πελάτη ότι μπορείτε να κάνετε το μεγαλύτερο μέρος της δουλειάς σας, αλλά όχι μόνο κουβαλούν πάντα με τη μία έτσι ώστε να μπορείτε να πάρετε πολύ αργοί χρόνοι φόρτωσης στην αρχή. Για παράδειγμα, για τα δεδομένα της γάτας σας θα θέλατε πιθανότατα να φέρω ένα σωρό πρόσφατες θέσεις τοίχο. Δεν θα ήθελα να φέρω όλα αυτά, επειδή αυτό θα μπορούσε να πάει πίσω ένα-δύο χρόνια. Αλλά δεν θέλετε να τους φέρω ένα κάθε φορά επειδή αυτό θα εισήγαγε ένα πολύ εναέριο δίκτυο. 

Είναι συχνά πολύ δύσκολο - μόλις έχετε μια λειτουργία βάσης δεδομένων - είναι συχνά αρκετά δύσκολο να αλλάξει ό, τι στοιχεία έχετε σε αυτό - δηλαδή, να προσθέσετε μια νέα στήλη της βάσης δεδομένων ή κάτι τέτοιο - έτσι μια καλή στρατηγική είναι στην πραγματικότητα απλά να κρατήσει πολλά από τα δεδομένα σας σε μια άμορφη μάζα κείμενο - μια σταγόνα JSON - JSON είναι JavaScript Object Notation - Ο λόγος που είναι χρήσιμο είναι γιατί τότε μπορείτε να προσθέσετε νέες ιδιότητες σε όλες αυτές τις σταγόνες JSON χωρίς αλλαγή της βάσης δεδομένων σας. Το μόνο μειονέκτημα σε αυτό είναι ότι εάν έχετε μια δέσμη των πεδίων ότι θα προστεθούν αργότερα - όπως κρυμμένα σε αυτό το JSON άμορφη μάζα - τότε είναι δύσκολο να τους το ερώτημα στο εσωτερικό της βάσης δεδομένων. Για παράδειγμα, αν αργότερα - αν είχατε μετά το μοντέλο σας που συζητήσαμε νωρίτερα μόνο με τον συγγραφέα, τον παραλήπτη και το κείμενο - θα μπορούσε επίσης να έχει μια άμορφη μάζα JSON και στη συνέχεια, αν αργότερα ήθελε να προσθέσετε ένα πεδίο ημερομηνίας δεν θα πρέπει να αλλάξουν τη βάση δεδομένων σας. Θα μπορούσαν απλά να προσθέσουν ημερομηνίες σε όλα τα πεδία κειμένου. Και τότε θα είναι σε θέση να εξετάσουμε εκείνους στην πλευρά του client, αλλά δεν θα είναι σε θέση να τους ερώτημα στην πλευρά του διακομιστή διότι είναι κρυμμένο μέσα σε αυτό το κείμενο. 

Το άλλο θέμα που θέλετε να σκεφτείτε είναι το πώς ο πελάτης σας και ο διακομιστής σας πρόκειται να επικοινωνήσουν. Συνήθως θέλουν να το κρατήσουν όσο το δυνατόν απλούστερη. Μπορείτε να έχετε ακριβώς όπως ένα get-me-αυτό το αίτημα δεδομένων, α create-a-new-αντικείμενο πράγμα, και ένα αίτημα update-ένα-old-αντικείμενο. Και όλα αυτά θα είναι διαφορετικές διευθύνσεις URL σε ένα διακομιστή που σας - ότι ο browser θα - μπορείτε να χρησιμοποιήσετε τα αιτήματα AJAX για όλα αυτά και είτε να λαμβάνουν ή δεδομένων θέσης. Και πάλι, για μας Cat Facebook παράδειγμα, θα μπορούσατε να έχετε αυτό το URL για να πάρετε μια μεμονωμένη θέση, και θέλετε να έχετε μια διεύθυνση URL για τη δημιουργία μιας νέας θέσης τοίχο και ίσως μια διεύθυνση URL για το φόρτωμα φωτογραφία του προφίλ σας, τέτοια πράγματα. Αλλά και πάλι, αυτό είναι να προ-φέρω περισσότερα από τα δεδομένα σας, έτσι ώστε να μην χρειάζεται να κρατήσει κάνοντας αιτήσεις δικτύου. Για το λόγο αυτό, μπορεί να μην θέλετε να έχετε αυτό το επιμέρους αίτημα πάρει για μια ενιαία θέση, και αντ 'αυτού θα θέλουν μόνο 1 get αίτημα για ολόκληρο τοίχο. Και στη συνέχεια, αν είστε προσπαθεί να επιτύχει μια ισορροπία, διότι - Αυτό είναι, επίσης, πρόκειται να εξαρτηθεί από την εφαρμογή σας. Διότι, αν είστε αναμένει ότι οι άνθρωποι έχουν μόνο 10 ή 20 θέσεις τοίχο ότι θα είναι μια χαρά. Αλλά αν είστε αναμένει ότι θα έχουν χιλιάδες, τότε η αίτηση θα πάρει πάρα πολύ καιρό, και έτσι ίσως να θέλετε να προσθέσετε μια παράμετρο πάρει-όλα-θέσεις-από τότε. 

Για όλα αυτά πρόκειται πιθανώς να θέλετε να συγχρονίσετε τα δεδομένα σας σε JSON - JavaScript Object Notation. Λίγο πολύ κάθε γλώσσα ασχολείται με JSON πολύ καλά. JQuery έχει αυτό το ωραίο λειτουργία getJSON που θα κάνει όλη την δύσκολη δουλειά για εσάς. Και σε PHP υπάρχει επίσης πολύ ωραία λειτουργίες επικοινωνίας JSON. Έτσι, αυτό είναι ίσως η καλύτερη μορφή για την αποστολή των μοντέλων σας πέρα ​​δώθε. 

Ως ένα παράδειγμα του τι έχουμε μιλήσει μέχρι στιγμής, εδώ είναι ένα παράδειγμα της ροής για τη γάτα Facebook αίτησή σας. Θα ξεκινά με το πρόγραμμα περιήγησής σας ζητώντας τη βάση διεύθυνση της ιστοσελίδας. Ο διακομιστής θα μπορούσε πιθανότατα να στείλει πάνω από στατική HTML και κάποια JavaScript και CSS. Είναι συνήθως καλύτερο να μην κάνει οποιαδήποτε απόδοση στο διακομιστή. Πιθανώς δεν θέλετε να - ο διακομιστής δεν κάνει εκεί πηγαίνει κάτω από τον κατάλογο των μηνυμάτων τοίχο και παράγοντας κάποια HTML για κάθε ένα και την αποστολή ότι πάνω. Είναι συνήθως καλύτερο να το κάνουμε αυτό από την πλευρά του πελάτη, διότι διαφορετικά κάθε φορά που θέλετε να ξανά-ζωγραφίσω κάτι, θα πρέπει να κάνει μια αίτηση διακομιστή. Και αυτό σας δίνει πολύ γρήγορα μια πολύ γενικά. Είναι συνήθως καλύτερο απλά να πλοίο στέλνει κάτω στατική HTML και, στη συνέχεια, JavaScript και CSS που θα κάνει την απόδοση στην πλευρά του client. Μόλις αυτό το πράγμα έρχεται, τότε μπορείτε να έχετε - σε JavaScript - μπορείτε να κάνετε τις αιτήσεις για τα δεδομένα τοίχο και άλλα τέτοια, και μετά ότι ο διακομιστής είναι βασικά ακριβώς να κάνει τα ερωτήματα βάσης δεδομένων και τον έλεγχο των αδειών. Το μόνο σημαντικό πράγμα είναι ότι δεν μπορεί να στείλει πάνω από κάποιες άλλες θέσεις τοίχο χρήστες ότι δεν επιτρέπεται να δει. Μπορεί ουσιαστικά να είναι ένα πολύ λεπτό στρώμα πρόσβαση στη βάση δεδομένων σας, και στη συνέχεια όλα τα δείχνει τα δεδομένα - όλες τις προβολές και τα πράγματα - εκείνοι μπορεί να συμβεί στον browser σας, και στη συνέχεια, όταν θέλετε να κάνετε μια δημοσίευση ή κάτι μπορείτε απλά να στείλετε ένα άλλο αίτημα. 

Υπάρχει επίσης κάποια φανταχτερά πράγματα που μπορείτε να κάνετε πάνω από αυτό. Από την άποψη των πιο ειδικών τεχνικών πληροφοριών, ανάπτυξη στην πεδιάδα JavaScript μπορεί να είναι λίγο επώδυνη, έτσι υπάρχουν μερικές βιβλιοθήκες και τα εργαλεία που θα σας βοηθήσει πολύ με αυτό. Νομίζω ότι όλοι σας έχετε ίσως ακούσει για jQuery που καθιστά κάνει HTML rendering και τις πράξεις χειραγώγησης πολύ πιο εύκολο - έχουν πολλά φανταχτερά λειτουργίες για το ξεθώριασμα μέσα και έξω, και να κάνει εύθυμος κινούμενα σχέδια. Υπάρχει, επίσης, ότι αυτή η βιβλιοθήκη που ονομάζεται Underscore.js. Έχει πολλές χρήσιμες λειτουργίες χρησιμότητας, πράγματα που θα περιμένατε JavaScript για να έχουν ότι πραγματικά doesn't - τα πράγματα όπως ανακάτεμα μια σειρά, αφαίρεση αντιγράφων από ένα κατάλογο, ή επιπεδοποίηση μια λίστα καταλόγων. Αυτό είναι μόνο ένα μικρό δείγμα κώδικα. Υπογράμμισης έχει έναν τόνο από αυτά τα ωραία λειτουργίες που θέλετε θα έχετε όλη την ώρα. 

Και έπειτα υπάρχει 1 ακόμα βιβλιοθήκη που θα ήθελα να περάσετε λίγο χρόνο για ονομάζεται Backbone.js επειδή Backbone πραγματικά σας βοηθά να ασχοληθεί με τα μοντέλα από την πλευρά του πελάτη και ένα μεγάλο μέρος της σύγχυσης που μπορεί να προκαλέσει. Backbone σας δίνει αυτήν την έννοια των μοντέλων και συλλογών σε JavaScript που είναι βασικά ακριβώς όπως JavaScript αντικείμενα σε συστοιχίες JavaScript, αλλά θα έχουν τα γεγονότα, όταν αλλάζετε τις ιδιότητές τους. Ακριβώς όπως και στην JavaScript, μπορείτε να έχετε ένα συμβάν όταν ένα κουμπί γίνεται κλικ ή κάτι αυτά τα μοντέλα και τις συλλογές Backbone Backbone θα μεταδίδουν τα πράγματα όπως ότι όταν αλλάζουν. Αυτό σημαίνει ότι μπορείτε απλά να γράψετε κάτι σαν αυτό απόσπασμα του κώδικα εδώ - Αυτό λέει, κάθε φορά που προσθέτουν τίποτα στη σειρά των δημοσιεύσεων που ανασυντάξει το σύνολο του τοίχου. Και αυτό θα έλεγα κάθε φορά τον αριθμό ενός μετά του αρέσει αλλάζει, θα ειδοποιεί το χρήστη ότι κάποιος άρεσε θέσης τους. Ή κάθε φορά που κάποιο ακίνητο του μετά τις αλλαγές που επαναπροσδιορίσει τη θέση. Πράγματα, όπως ότι θα σας κερδίζει τόνους πολυπλοκότητας, διότι διαφορετικά αν δεν έχετε κάποια πλαίσιο όπως αυτό, τότε κάθε φορά στον κώδικά σας που αλλάζετε τίποτα για μια θέση, θα πρέπει να θυμηθείτε τον εαυτό σας να καλέσει όλες τις λειτουργίες καθιστούν και τέτοια πράγματα, και αν ήθελε να προσθέσει κάτι νέο που συνέβη κάθε φορά που τροποποιήσατε μια θέση που θα πρέπει να περάσει από κάθε χώρα σε σας κώδικα που τροποποιήσατε ένα μήνυμα και να προσθέσω ότι κάτι καινούργιο. Ένα πλαίσιο, όπως αυτό θα αφαιρέσει πολλά από εκείνη μεταξύ του στρώματος επικοινωνίας που κάνει τον κωδικό σας πολύπλοκο και δύσκολο να διατηρηθεί. 

Υπάρχει ένα μικρό κομμάτι για τις απόψεις επίσης. Πάω να αφήσει το μεγαλύτερο μέρος αυτής με τον Μπίλι επειδή δεν είναι τεχνικά πολύ δύσκολη. Χρησιμοποιήστε jQuery για τις απόψεις σας. Είναι σχεδόν σαν μια αναγκαιότητα σε αυτό το σημείο. Κάνει ακριβώς τα πάντα τόσο πολύ ευκολότερο. Υπάρχουν πολλές βιβλιοθήκες. Αν έχουν περιπλέξει τα στοιχεία διεπαφής χρήστη, αν θέλετε μια αυτόματη συμπλήρωση πράγμα ή σαν ένα από αυτά τα φανταχτερά πολλαπλών επιλογείς - αν θέλετε κάτι τέτοιο, θα πρέπει πιθανώς ακριβώς αναζήτηση γύρω και μπορείτε να βρείτε μια καλή βιβλιοθήκη που θα κάνει ό, τι θέλετε. Billy θα εξηγήσουμε περισσότερα για τα πραγματικά δύσκολα σημεία των απόψεων. Επίσης, όπως μια πλευρά σημείωση, Backbone έχει κάποια λειτουργικότητα για τις απόψεις επικοινωνούν όμορφα με τα μοντέλα - ματιά στην τεκμηρίωση για όλες αυτές τις βιβλιοθήκες, στην πραγματικότητα. Κοιτάξτε τα docs. Είναι πολύ καλογραμμένο και εύκολο να ακολουθήσει. Σε γενικές γραμμές, μπορείτε λίγο πολύ μόνο το Google, αν έχετε προβλήματα. Υπάρχουν πολλοί άνθρωποι που τις χρησιμοποιούν. Νομίζω ότι αυτό είναι σαν μια τελευταία σημείωση. 

Υπάρχουν επίσης και κάποιες πιο σύνθετες πράγματα που μπορείτε να κάνετε αν ψάχνετε να κάνει το web app σας επιπλέον φοβερό. Μπορείτε να το κάνετε - η νέα προδιαγραφή HTML5 έχει πολλά φανταχτερά πράγματα που μπορείτε να κάνετε. Τοπική αποθήκευση - η οποία είναι ότι μπορείτε να αποθηκεύσετε τα δεδομένα στο πρόγραμμα περιήγησης - αντί να χρειάζεται να πάει πίσω και να λάβουν γνώση του διακομιστή για τα πάντα, μπορείτε να κρατήσετε ορισμένα από αυτά στον πελάτη και που σας επιτρέπει ακόμα και οι άνθρωποι - σε ορισμένες περιπτώσεις μπορεί ακόμη και να σας αφήσει να χρησιμοποιήσετε τη σύνδεση ιστοσελίδα. Δεν υπάρχει αυτό το πράγμα που ονομάζεται WebSockets που είναι ένα διαφορετικό είδος της επικοινωνίας του δικτύου όπου αντί απλά να κάνετε μία αίτηση, θα έχετε απάντηση και είστε έτοιμοι, κρατάτε το άνοιγμα μιας σύνδεσης στο διακομιστή και έτσι μπορείτε να κάνετε πράγματα όπως ενημερώσεις σε πραγματικό χρόνο. Έτσι, εάν προσπαθείτε να κάνετε μια συνομιλία app, μπορείτε να χρησιμοποιήσετε WebSockets να επικοινωνούν και πίσω, έτσι ώστε δεν θα πρέπει να κρατήσει ζητώντας, "Ω, server, έκανε κάποιος να μου στείλει μια κουβέντα;" κάθε 10 δευτερόλεπτα ή κάτι τέτοιο. Υπάρχει επίσης ένα ενδιαφέρον χαρακτηριστικό HTML5, όπου μπορείτε να το κάνετε να μοιάζει η διεύθυνση URL της σελίδας αλλάζει χωρίς ποτέ να χρειάζεται να το φορτώσετε πραγματικά. Μπορείτε να χρησιμοποιήσετε μπρος και πίσω κουμπιά χωρίς να κάνει μια δέσμη των αιτημάτων του δικτύου. Πράγματα όπως αυτό είναι πραγματικά χρήσιμο από την άποψη να καταστεί ταχεία, αλλά επίσης να λειτουργήσει σαν ένα web app πρέπει. 

Υπάρχει, επίσης, αυτό το πράγμα που ονομάζεται CoffeeScript. CoffeeScript είναι μια διαφορετική γλώσσα, στην πραγματικότητα, που συγκεντρώνει, κάτω JavaScript. Θα γράψω όλα τον κωδικό σας σε CoffeeScript, και στη συνέχεια να εκτελέσετε αυτή την compiler, και φτύσει ένα αρχείο JavaScript που μπορείτε να συμπεριλάβετε στην ιστοσελίδα σας. Ο λόγος που CoffeeScript είναι ωραίο είναι επειδή ξεφορτώνεται πολλά από τα παράξενες περιπτώσεις που JavaScript έχει πού ισούται ίσων, και ισούται με ίσους κάνουν διαφορετικά πράγματα, ή θέλετε - έχει καλύτερο σύνταξη για την εξέταση των σειρών και λειτουργίες. Αυτό είναι ένα μικρό απόσπασμα από CoffeeScript που παράγει μια λίστα με όλες τις πλατείες από 10 ^ 2 προς 1 ^ 2 με αντίστροφη σειρά. Όπως μπορείτε να δείτε, CoffeeScript συχνά σας επιτρέπει να εκφράζουν σε 1 γραμμή τι θα πάρει 5 γραμμές JavaScript. Μπορεί να κάνει τα πράγματα πολύ πιο εύκολο. Είναι ένα μικρό κομμάτι των νέων σύνταξη για να μάθουν από την πρώτη, αλλά σίγουρα θα σας κάνουν πιο παραγωγικούς μακροπρόθεσμα. 

Μπορείτε επίσης να χρησιμοποιήσετε άλλες γλώσσες του διακομιστή από PHP - γλώσσες όπως η Ruby, Python, ή υπάρχει ακόμα ένα έργο που ονομάζεται Node.js που θα σας αφήσει να χρησιμοποιήσετε JavaScript στο διακομιστή. Προσωπικά, εγώ πραγματικά, πραγματικά μισούν PHP. Απλώς δεν μπορώ να απολαμβάνω να δουλεύω με αυτό. Αν, επίσης, πιστεύουν ότι είναι ένα φοβερό cluge της γλώσσας, τότε μπορείτε να χρησιμοποιήσετε ένα από αυτά αντ 'αυτού. Σε γενικές γραμμές, αν θέλετε να κάνετε κάτι και εσείς δεν ξέρει πραγματικά πώς θα το κάνουμε, Απλά αναζήτηση στο Internet. Υπάρχουν τόνοι και τόνοι των πόρων, ιδίως στις - StackOverflow είναι μεγάλη. Είναι αυτή η ιστοσελίδα όπου οι προγραμματιστές κάνουν ερωτήσεις μεταξύ τους. Μπορεί να έχετε τρέξει σε αυτό, αν είχατε πρόβλημα για το πρόβλημα CS50 σύνολα. Και υπάρχουν τόνοι των βιβλιοθηκών για να κάνει σχεδόν ό, τι θα θέλατε. Αν θέλετε να κάνετε κάτι και δεν ξέρετε πώς να το κάνουμε, μην υποθέσετε ότι αυτό είναι αδύνατο. Απλά κοιτάξτε γύρω και μπορείτε να βρείτε μερικές καλές πόρους. 

Ως γενική τυλίξτε επάνω, οι κύριες takeaways είναι να κρατήσει τα πράγματα απλά. Το πιο πολύπλοκο κώδικα σας είναι στην αρχή και τόσο περισσότερο θα προσπαθήσουμε και να κάνουμε φανταχτερά πράγματα, τόσο περισσότερος χρόνος θα χρειαστεί για να πάρει κάτι πραγματικά λειτουργική και τόσο πιο δύσκολο θα είναι να αλλάξει αργότερα. Έτσι, κάνουμε τα πράγματα με τον χαζό, εύκολο τρόπο για πρώτη φορά. Για να πάει μαζί με αυτό, δεν πρέπει να φοβάται να ρίχνουν μακριά παλιό κώδικα ή τον καθαρισμό μέχρι πολύ. Σε γενικές γραμμές, όταν έχετε πραγματικά κάτι εργασίας, Είναι πολύ πιο εύκολο να σκεφτούμε ό, τι όταν είστε ακόμα στα αρχικά στάδια πώς μπορώ να θέσει αυτό όλοι μαζί. Είναι καλύτερο να γίνει η πιο χαζό δυνατό σχεδιασμό που λειτουργεί και στη συνέχεια να βελτιώσει επαναληπτικά ό, τι προσπαθεί να πάρει τα πάντα σωστά την πρώτη φορά. Από την άποψη της διαίρεσης client-server, να προσπαθήσουμε και να κρατήσει το διακομιστή σας είναι πολύ απλό - απλά μια βάση δεδομένων και μερικά ταυτότητας και δεν κάνουν καμία σκληρή δουλειά εκεί. Μήπως όλα περίπλοκα πράγματα σας από την πλευρά του πελάτη στο πρόγραμμα περιήγησης σε JavaScript όσο μπορείτε. Κοιτάξτε γύρω για τις βιβλιοθήκες που κάνουν τη ζωή σας καλύτερη. Πάντα καλύτερο να χρησιμοποιήσετε κώδικα που κάποιος άλλος έγραψε αν - και να μην το γράψετε μόνοι σας. Υπάρχουν πολλά πράγματα στο διαδίκτυο. Το Google είναι ο καλύτερος φίλος σας. Το Google είναι ο καλύτερος φίλος του προγραμματιστή. Ναι, σίγουρα δεν πρέπει να φοβόμαστε να κοιτάξουμε γύρω μας για τα πράγματα. Εντάξει. Και πάνω στον Billy. 

[Billy] Στην πραγματικότητα, πριν αρχίσω με κάποια πράγματα το σχεδιασμό, Υπάρχει κάποιος που έχει απορίες για τον Ben για κάτι που μίλησε για? Εντάξει, καλά. Και πάλι, ενημερώστε μας αν κάτι δεν είναι σαφές ή αν θέλετε να πάμε για κάτι λίγο περισσότερο. Πάω να κάνουν ένα βήμα πίσω λίγο και να μιλήσουμε για τα πιο θεμελιώδη τμήματα του σχεδιασμού. Ben αναφέρουν το μοντέλο που ονομάζεται - συγνώμη, το μοντέλο του συστήματος θέα ελεγκτή η οποία είναι ένα είδος τεχνική πτυχή, έτσι είμαι πρόκειται να δούμε τη θέα συγκεκριμένα, και πάω να ξεκινήσω με το πώς θέλετε να σχεδιάσουν μια άποψη που φαίνεται ωραίο. Εδώ είναι το είδος της μια πραγματικά βασικό πρότυπο για τη γάτα μας στο Facebook. Νομίζω ότι υπάρχουν κάποιες βασικές αρχές σε μοντέρνο σχεδιασμό UI που αξίζει να πάρει. Μπορείτε να παρατηρήσετε ότι υπάρχει ένα πολύ λευκό χώρο σε όλη τη σελίδα, άφθονο χώρο για τα πράγματα. Να μην αισθάνονται σαν να πρέπει να σκουός τα πράγματα σε μια σελίδα. Θέλετε να αφήσετε πολλά περιθώρια ανοιχτό, και αν πάτε σε σχεδόν κάθε σύγχρονη ιστοσελίδα θα δείτε ότι υπάρχει λευκό παντού. Υπάρχει λευκούς σε μέρη που δεν θα περιμένατε. Έχετε αυτή τη χρωματική παλέτα, και είναι σοφό στην αρχή για να επιλέξετε μια παλέτα χρωμάτων που θα πάμε να εργαστεί με και να αναπτυχθούν. Μπορείτε, επίσης, - βοηθά να επιλέξετε μια οικογένεια, και με αυτόν τον τρόπο είστε το είδος της εργασίας με αυτές οι συγκεκριμένες βασικές αρχές του σχεδιασμού. Έχετε τύπο σας, έχετε τα χρώματά σας, και στη συνέχεια μπορείτε να το είδος της ταιριάζουν όλα τα άλλα στον ως αναγκαία. Έτσι, όπως είπα, με το χρώμα σχεδίου σας που θέλετε να χρησιμοποιήσετε τα πιο τολμηρά χρώματα των χρωμάτων σας φειδώ. Κεφαλιά είναι ωραία. Τα κουμπιά είναι ωραίο να έχουμε πραγματικά μεγάλα, φανταχτερά χρώματα. Αλλά σε γενικές γραμμές, αν έχετε μια ιστοσελίδα που έχει τα χρώματα παντού, το μόνο που κοιτάζει στο πρόσωπο, μοιάζει απλά γεμάτα, και δεν είναι καλό. Θέλετε να χρησιμοποιήσετε γενικά ανοιχτά χρώματα. Προσπαθήστε να, και πάλι, να πάρει ένα αρκετά συνεκτικό συνδυασμό χρωμάτων. Μπορείτε να έχετε αυτές τις μικρές πινελιές από πολλά χρώματα - που μπορεί να φαίνονται πολύ ωραία, αλλά θέλετε να τα χρησιμοποιήσετε πολύ φειδώ. 

Όπως είπα, θέλετε να είναι ελάχιστες. Λιγότερο είναι σχεδόν πάντα περισσότερο. Εάν μπορείτε να εμφανίσετε κάτι ή όχι εμφανίσει κάτι, και είστε το είδος του βέβαιοι για το αν θα πρέπει να υπάρχει από προεπιλογή - ίσως είσαι καλύτερα μακριά αφήνοντας έξω. Μπορείτε πάντα να προσθέσετε αργότερα. Ναι, να κρατήσει τα πράγματα απλά. Αλλά το πιο σημαντικό, θέλετε να εξετάσει πολλαπλά σχέδια. Μην νομίζετε ότι όταν κάνετε μια ιστοσελίδα, μπορείτε να έχετε στο μυαλό σας ότι πρόκειται να κάνουν το site σε ένα συγκεκριμένο τρόπο, και πρόκειται να δούμε ακριβώς όπως αυτό. Είναι πρόκειται να έχουν την μπλε επικεφαλίδα στην κορυφή και το μπλε μπαρ δίπλα και στη συνέχεια το κίτρινο υπο-κεφαλίδα πράγμα. Θέλετε να κάνετε πολλαπλά πρότυπα. Μπορείτε είτε - αν είσαι καλός με το Photo Shop, μπορείτε να ανοίξετε ότι μέχρι και το είδος των σχεδιάσουμε ένα δικτυακό τόπο, όπως θα θέλατε να δούμε. Αν όχι, μπορείτε να χρησιμοποιήσετε μόνο το στυλό και το χαρτί, αλλά μηδέν μέχρι πολλαπλά σχέδια. Θέλετε να έχετε ουσιαστικά ένα που έχει συσταθεί όπου έχετε πολλά διαφορετικά σχέδια, και αν κάποιος καταλήγει εργασίας, τότε αυτό είναι σπουδαίο. Αν κάποιος καταλήγει να αποτυγχάνει, τότε θα πρέπει πάντα ο ένας τον άλλο να στραφώ. Σε γενικές γραμμές, δεν αισθάνονται σαν να πρέπει να περιορίζεται σε ό, τι σχέδιο που αρχικά αποφασίσει σχετικά. Τα σχέδια είναι πολύ μεταβλητά, και μέρος της σημασίας του μοντέλου άποψη ελεγκτή του συστήματος είναι ότι μπορείτε να ανταλλάξετε μέσα και έξω διαφορετικές απόψεις που θέλετε. Μπορείτε να επηρεάσει τα δεδομένα με έναν τρόπο, και στη συνέχεια να αποφασίσει, oh, στην πραγματικότητα, αυτό δεν λειτουργεί τόσο καλά. Νομίζω ότι είναι το είδος της πολύ περίπλοκο ή υπάρχει ένα μέρος που εδώ δεν είναι πραγματικά εργάζονται, έτσι είμαι πρόκειται να εγκαταλείψει εντελώς την άποψη αυτή και swap σε ένα εντελώς νέο. Μπορούμε ακόμα να χρησιμοποιήσουμε τα παλιά μοντέλα και τα παλιά ελεγκτές. Μπορούμε να κάνουμε τα πάντα για το διακομιστή και πελάτη, όπως θα πριν. Αλλά η πραγματική κύμα των δεδομένων όπως εμφανίζεται πρόκειται να είναι ελαφρώς διαφορετική. 

Όσον αφορά στην πραγματικότητα την εφαρμογή το σχέδιο που θέλετε, μόλις έχετε μερικά σχέδια σκιαγράφησε σε χαρτί ή σε Photo Shop ή οτιδήποτε άλλο, υπάρχουν μια σειρά από εργαλεία που είναι διαθέσιμα για εσάς. Το πρώτο είστε πολύ εξοικειωμένοι με το οποίο είναι HTML, PHP, ή οτιδήποτε άλλο γλώσσα που χρησιμοποιείτε μόνο για να κωδικοποιήσει τις στατικές σελίδες στην ιστοσελίδα σας. Έχετε δουλέψει πολύ με την HTML που ευγενικό εκ μέρους σας δίνει αυτές τις ετικέτες ότι μπορείτε να βάλετε τα πράγματα σε, και ουσιαστικά είναι ένας τρόπος οργάνωσης του περιεχομένου σας. Για παράδειγμα, έχετε την επικεφαλίδα εκεί, οπότε θα πάμε να έχουν μια ετικέτα επικεφαλίδας, και πρόκειται να έχουμε κάποιο κείμενο μέσα από το οποίο κατά πάσα πιθανότητα θα είναι σε μια άλλη ετικέτα. Στη συνέχεια, έχετε μια πλαϊνή μπάρα ίσως με κάποιες διαφορετικές συνδέσεις, και εκείνων που πρόκειται να είναι όλα σε ξεχωριστές ετικέτες. Έτσι, βασικά HTML στην καρδιά του είναι ένας τρόπος διαίρεσης της σελίδας πώς που τελικά θέλετε να το διαμορφώσετε. Έτσι και πάλι, έχετε δει ότι πριν. Είσαι αρκετά άνετα με την εργασία με το τώρα δεδομένου ότι έχετε κάνει το τελευταίο το chipset ελπίζουμε, έτσι ώστε πρέπει να υπάρχει πρόβλημα. 

Στη συνέχεια, έχετε CSS που χειρίζεται ουσιαστικά όλες τις πτυχές του σχεδιασμού στατικών. Θα χειριστεί όλα τα χρώματα, όλα της τοποθέτησης των διαφόρων στοιχείων, όπου πηγαίνουν το ένα ως προς το άλλο, πόσο μεγάλο είναι, τα διάφορα είδη τοποθετήσεις που θα έχουν - Με άλλα λόγια, μπορείτε να έχετε τα πράγματα σταθερά, έτσι ώστε όταν κάνετε κύλιση προς τα κάτω μένουν, ή μπορείτε να έχετε τα πράγματα σε σχέση με άλλα στοιχεία. Όλα αυτού του είδους τα πράγματα είναι σε CSS. Επιπλέον, μπορείτε να κάνετε διάφορες διακοσμήσεις, μπορείτε να έχετε τα χρώματα κειμένου, εφέ κειμένου, όλα αυτού του είδους τα πράγματα. Ben έδωσε ένα πολύ καλό σεμινάριο σχετικά με αυτό το περασμένο Σαββατοκύριακο, και έτσι θα ήθελα να ελέγξετε σίγουρα ότι αν σκοπεύετε να κάνει κάποια φανταχτερά πράγματα με CSS. CSS3 είναι στην πραγματικότητα η πιο πρόσφατη έκδοση του CSS, και μπορεί να κάνει όλα τα είδη των πραγματικά ωραία πράγματα. Μπορεί να κάνει κλίσεις? Μπορείτε να έχετε ωραία, στρογγυλεμένες γωνίες? Μπορείτε να κάνετε όλα τα είδη της ουσίας να κάνει τον ιστοχώρο σας να φανεί πιο σύγχρονο και φανταχτερό. 

Το επόμενο εργαλείο είναι JavaScript και jQuery που Ben μίλησε λίγο για, αλλά θα πάρει λίγο μακρύτερα σε. JavaScript, όπως έχετε δουλέψει με το λίγο, ή τουλάχιστον να δει σε διάλεξη, Είναι το είδος του ένας τρόπος δυναμικά να κάνει πράγματα σε HTML. HTML, όπως γνωρίζετε, είναι στατική, έτσι ώστε τη στιγμή που έχετε HTML δεν μπορείτε να το τροποποιήσετε. Αλλά JavaScript, κατά κάποιο τρόπο, είναι ένας τρόπος για να είναι σε θέση να τροποποιήσει HTML. Έτσι, μπορείτε να το κάνετε αυτό, και αυτό είναι σπουδαίο, αλλά JavaScript είναι πραγματικά ένας πόνος για να εργαστεί με. Είναι τόσο μεγάλη και αμβλεία και να κάνει ακόμη και τα απλούστερα πράγματα απαιτεί πολλές γραμμές του JavaScript. Έτσι, jQuery είναι βασικά μια βιβλιοθήκη για JavaScript, που απλοποιεί όλα αυτά. Λέει, εντάξει, αν θέλετε να έχετε ένα τετράγωνο κουτί προέρχονται από την αριστερά και σβήνουν μέσα στη σελίδα, έτσι ώστε να είναι στη μέση, σε JavaScript που θα πάρει - Δεν ξέρω, εκατό γραμμές για να κάνει, και θα είναι ένας πόνος, και θα βγει από αυτό μισεί τα πάντα για τον προγραμματισμό web. JQuery έχετε ουσιαστικά το στοιχείο-dot-fade-in, ή κάτι τέτοιο. Έτσι, πολύ, πολύ απλές λειτουργίες που θα σας επιτρέψει να κάνετε όλα τα είδη των δροσερό κινούμενα σχέδια και αυτό το είδος του πράγματος. Το άλλο πράγμα που αυτά τα 2 είναι πραγματικά καλό για μόλις κάνει πράγματα δυναμικά με την ιστοσελίδα. Έτσι, όχι μόνο έχοντας τη σελίδα HTML σας - η οποία εμφανίζει κάποια δεδομένα, αλλά στην πραγματικότητα δεν κάνει τίποτα - JavaScript και jQuery θα σας αφήσει να έχουν κουμπιά που μπορείτε να κάνετε κλικ, και μπορείτε να σύρετε τα στοιχεία και τους re-order και να τους ταξινομήσετε, και να έχουν νέα στοιχεία προστεθεί ή να αφαιρεθεί. Μπορείτε να προσθέσετε-διαγραφή, αυτό το είδος του πράγματος. Έτσι, jQuery κάνει τους τόνους των δροσερά πράγματα. Και Vipul δίνει πραγματικά ένα σεμινάριο για το σήμερα, πιστεύω, σε 5-ώρα, οπότε αν μπορείτε να μείνω για τόσο καιρό, ότι θα ήταν - 5 ή 4; Four. Λυπάμαι. Είναι πραγματικά σωστό, μετά από αυτό, οπότε θα ήθελα να συστήσω κολλήσει γύρω για αυτό, αν μπορείτε. JQuery είναι super, super χρήσιμο, και θα είστε σε θέση να κάνει πολλά πραγματικά ωραία πράγματα με αυτό για λίγο πολύ κάθε έργο ανάπτυξης ιστοσελίδων. 

Τώρα είμαι πρόκειται να πάρει σε ένα είδος διάκρισης. Έχω μιλήσει ουσιαστικά για διεπαφή χρήστη. Διεπαφή χρήστη είναι μόνο το σχεδιασμό του site. Αλλά υπάρχει ένα είδος άλλη έννοια, η οποία είναι η εμπειρία του χρήστη. Τα δύο είναι πολύ διαφορετικές. Η διεπαφή είναι σίγουρα μέρος της εμπειρίας. Με άλλα λόγια, όταν θα πάτε σε ένα site, κοιτάς το περιβάλλον. Αυτό είναι μέρος του πώς βιώνετε το χώρο. Αλλά η εμπειρία του χρήστη είναι περισσότερο από αυτό. Εμπειρία του χρήστη είναι σχετικά με το τι η εντύπωση που παίρνει ο χρήστης από το site σας. Έτσι, προφανώς, η διασύνδεση είναι ένα μέρος αυτής. Και αυτό είναι σίγουρα ένα απαραίτητο μέρος, αλλά δεν είναι επαρκής. Με άλλα λόγια, αν έχετε μια ωραία διεπαφή, και είναι όμορφο και πολύχρωμο και όλα αυτά, αυτό είναι μεγάλη? αλλά αν ο χρήστης πηγαίνει στην περιοχή σας, βλέπει μια όμορφη διάταξη και είναι συγχέεται με τα πάντα, δεν έχει καμία ιδέα για το πώς να κάνει τίποτα, τότε προφανώς έχετε κάνει ένα πραγματικά κακή ιστοσελίδα. Αυτό είναι το είδος της εμπειρίας του χρήστη, όπου μπαίνει Πάω να μιλήσω λίγο για UX design - UX είναι μικρή για την εμπειρία του χρήστη - και το είδος του πώς μπορείτε να βεβαιωθείτε ότι έχετε μια καλή εμπειρία για το χρήστη. Το πρώτο σημείο είναι ότι μπορείτε να σχεδιάσετε μια ιστοσελίδα όπου ο χρήστης μπορεί να κάνει τίποτα που ότι ο χρήστης θέλει ενδεχομένως. Αλλά αν ο χρήστης δεν μπορεί να καταλάβω πώς να κάνει αυτά τα πράγματα - Με άλλα λόγια, αν ο χρήστης δεν έχει μια καλή ιδέα όταν πηγαίνουν στο site σας, "Ω, αν θέλετε να ενημερώσετε το προφίλ μου, τότε κάντε κλικ σε αυτό το κουμπί, ή αν θέλετε να δημοσιεύσετε στην τοίχο κάποιου, τότε θα πάω στον τοίχο τους και κάντε κλικ σε ένα μικρό κουτί. " Εάν ο χρήστης δεν γνωρίζει ότι, στη συνέχεια, έχετε ουσιαστικά στην πραγματικότητα δεν εφαρμοστεί αυτή τη λειτουργία σωστά. Μέρος της εφαρμογής ενός λειτουργικότητα είναι ότι οι χρήστες είναι πράγματι σε θέση να το χρησιμοποιήσετε. Και ίσως να είναι απογοητευτικό - μπορείτε να κάνετε μια ιστοσελίδα, και μπορεί να κάνει όλα τα είδη της υπέροχα πράγματα, αλλά τότε θα έχετε τους ανθρώπους να δοκιμάσουν και να πει, «Δεν μπορεί να το κάνει αυτό. Γιατί δεν μπορεί να το κάνει αυτό; "και θα πείτε πίσω σε αυτούς, "Λοιπόν, αυτό μπορεί. Απλά πρέπει να πάτε στο μενού του 7ου drop-down σε αυτή τη σκοτεινή σελίδα που βρίσκεται μόνο από έναν σύνδεσμο στο κάτω δεξιά γωνία-χέρι »ή κάτι τέτοιο. Προφανώς, δεν θέλετε αυτό. Θέλετε να είναι σαφές στους χρήστες σας τι υποτίθεται ότι πρέπει να κάνουμε, και θα πρέπει να είναι απλή και διαισθητική για αυτούς. 

Ένα άλλο πράγμα που θέλετε να προσπαθήσουμε να κάνουμε είναι, αν κάποιος πρόκειται να πάει στο site σας και 9 στις 10 φορές κάνουμε ενέργειες Α, και 1 από 10 φορές κάνουν δράσης Β, ίσως θέλετε να εστιάσετε την εμπειρία τους σχετικά με τη δράση A. Με άλλα λόγια, θέλετε να κάνετε το πολύ, πολύ σαφές πώς να το κάνουμε A. Α θα πρέπει να είναι μπροστά και κέντρο - πάτε στο site, δείτε? Oh, είναι εκεί. Εκτιμώντας B προφανώς θέλετε να είναι σαφής, αλλά μπορείτε να το αφήσετε λίγο περισσότερο στο παρασκήνιο. David δίνει ένα καλό παράδειγμα αυτού στη διάλεξη, το οποίο είναι το σύστημα της Βοστώνης Τ. Όταν πάτε στο Boston T και θέλετε να αγοράσετε ένα εισιτήριο, θα πρέπει να μπει σε 5 μενού για να μπορέσετε να αγοράσετε πραγματικά ένα εισιτήριο για $ 2, $ 2.50 αξία, η οποία είναι το πόσο χρειάζεται για να οδηγήσετε το μετρό σε μία κατεύθυνση. Αυτό είναι ένα πρόβλημα, επειδή οι περισσότεροι άνθρωποι που είναι ιππασία το μετρό ίσως απλά θέλετε να πάτε σε ένα μέρος, να αγοράσει το εισιτήριό τους, να πάρει αμέσως. Δεν έχει νόημα ότι θα πρέπει να περάσουν από πολλά διαφορετικά μενού για να φτάσει εκεί. Μια καλύτερη εμπειρία του χρήστη θα ήταν μια γρήγορη κουμπί στην πρώτη σελίδα ότι ακριβώς λέει, «αγοράσει ένα εισιτήριο απλής διαδρομής, και ότι θα θέσει σε όλες του προτύπου προεπιλεγμένες τιμές? και στη συνέχεια, αν κάποιος θέλει να αγοράσει ένα εισιτήριο διαφορετικό από αυτό, εξακολουθούν, φυσικά, έχουν τη δυνατότητα, αλλά έχετε βελτιστοποιημένη για η περίπτωση κοινής χρήσης που είναι πραγματικά σημαντικό. Μπορείτε να δείτε παραδείγματα στο Facebook, έτσι δεν είναι; Αν πάτε στο Facebook και θέλετε να δημοσιεύσετε ένα καθεστώς, Είναι ακριβώς στην κορυφή η οποία είναι ό, τι συχνά θέλετε να κάνετε. Μόλις μπείτε στη σελίδα, μπορείτε να κάνετε τα πιο κοινά πράγματα που θέλετε να κάνετε. Αν θέλετε να κάνετε λίγο πιο περίπλοκα τα πράγματα όπως, να πω ότι θέλω να πάω στον τοίχο του φίλου μου και μετά μια εικόνα σχετικά με αυτό - το οποίο εγώ θα ήθελα να κάνω συχνά, αλλά όχι τόσο συχνά όσο απόσπαση ενημερώσεις κατάστασης - οπότε στην περίπτωση αυτή, θα πληκτρολογήσετε το όνομα τους στο κουτί στην κορυφή, κάντε κλικ στο προφίλ τους, και, στη συνέχεια, ακόμα, ότι είναι σωστό στην κορυφή εκεί μια φορά έχω πάρει στο προφίλ τους. Και πάλι, έχω βελτιστοποιημένη κατά προτεραιότητα για τις περιπτώσεις πιο κοινή χρήση. 

Ένα άλλο σημαντικό πράγμα είναι ότι συχνά οι άνθρωποι θα είδος προσπαθήσει να πάρει γύρω από αυτό λέγοντας, εντάξει, έχω κάνει την περιοχή και οι άνθρωποι το βρίσκουν σύγχυση, και αυτό είναι ένα πρόβλημα, σωστά; Προφανώς, δεν θέλω οι άνθρωποι να πρέπει να συγχέεται με το περιεχόμενο του site μου. Αλλά ο τρόπος για να λυθεί αυτό δεν είναι να έχουμε κάτι pop up λέγοντας, hey, είμαι πρόκειται να σας διδάξει πώς να χρησιμοποιήσετε αυτό το site. Βήμα 1 - πατήστε αυτό το κουμπί. Βήμα 2 - πηγαίνετε εδώ. Σίγουρα, αυτός είναι ένας τρόπος γύρω από αυτό - είναι ένας τρόπος που μπορείτε να πείτε στους ανθρώπους τι να κάνουν, αλλά είναι Πραγματικά δεν το βέλτιστο τρόπο. Αν πάω σε μια ιστοσελίδα και ξαφνικά είμαι βομβαρδίζονται με αυτό το σεμινάριο που μου λέει τι να κάνει και πού να πάτε και όλα αυτά, αυτό δεν είναι διασκεδαστικό για μένα. Δεν είναι μια καλή εμπειρία για μένα. Είναι το είδος του πόνου. Θέλω απλά να αρχίσει να κάνει πράγματα. Οι άνθρωποι πρόκειται να κλείσει έξω από το πλαίσιο διαλόγου τους, ή να βγει από το φροντιστήριο, δεν ξέρουν τι να κάνουν, και στη συνέχεια διαμαρτύρονται γιατί δεν έχετε να τους πει τι να κάνουν. Ο τρόπος για να λυθεί αυτό δεν είναι η χορήγηση κάθε είδους φροντιστήριο ή κατευθύνσεις - κάτι τέτοιο. Όσο μπορείτε να το αποφύγετε, αν πραγματικά θέλουμε να δείξουμε το χρήστη τι να κάνει μόνο από τη φύση του το πώς η ιστοσελίδα που είναι έξω. Με άλλα λόγια, αν πάω στο Facebook χωρίς να συνδεθείτε, το πρώτο πράγμα που βλέπω στην κεντρική σελίδα - Είναι ένα μικρό κουτί σύνδεσης. Έτσι, duh. Πρέπει να συνδεθείτε Είναι ακριβώς εκεί. Ότι, αν πήγα στο Facebook και εγώ έπρεπε να κάνετε κλικ σε ένα μικρό σύνδεσμο στο κάτω μέρος που αναφέρουν ότι «log in» και το υπόλοιπο της σελίδας ήταν μερικά μόνο είδος της εικόνας ή κάτι τέτοιο, Δεν ξέρω πραγματικά τι να κάνουμε, έτσι δεν είναι; Θα πρέπει να συγχέεται. Έτσι, θα μπορούσε να μου πει να πάω εκεί κάτω και κάντε κλικ στο κουμπί για να συνδεθείτε, ή το αρχείο καταγραφής στο κουμπί θα μπορούσε να είναι ακριβώς στην κορυφή, όπου θα πάω να το δω. Θέλετε να είναι πάντα δείχνει το χρήστη τι να κάνει, και ότι θα πρέπει να είναι συνυφασμένες με την ίδια τη σελίδα. 

Όταν σκέφτεστε για τα σχέδια και σκωπτική επάνω διαφορετικούς τρόπους εκφράζοντας το site σας, θέλετε πραγματικά να σκεφτείτε τι οι χρήστες πρόκειται να πρέπει να κάνει και πώς μπορείτε να τους δείξουμε τι πρέπει να κάνουμε. Ένα τελευταίο πράγμα είναι η δοκιμή είναι πραγματικά, πραγματικά σημαντικό. Είναι μεγάλη για να πάρει κάποιος - να πάρετε μια φίλη, να πάρει κάποιον που δεν γνωρίζουν καν - που ποτέ δεν έχει δει τον δικτυακό τόπο πριν να χρησιμοποιήσετε την ιστοσελίδα. Επειδή έχετε ήδη εργάζονται στην περιοχή για ώρες, έχετε κοιτάξει επίμονα σε αυτό, και ξέρετε ακριβώς τι πρέπει να κάνουμε, ώστε προφανώς θα πάμε να τη δοκιμή της πράγματα που έχετε εργαστεί για και ότι ξέρετε τη δουλειά. Αλλά αν κάποιος άλλος έρχεται και χρησιμοποιεί το χώρο που έχει ποτέ χρησιμοποιήσει πριν, αυτό είναι μια μοναδική εμπειρία, επειδή έχετε κάποιον που δεν έχει προηγούμενη γνώση από το χώρο να υπεισέλθω σε αυτό, έτσι ώστε να πάμε να έχουν πράγματι καμία ιδέα τι να κάνει ή τι είδους περιπτώσεις χρήσης είναι δώρο γι 'αυτούς. Αυτό είναι μεγάλη. Αυτό είναι μοναδικό επειδή είναι ουσιαστικά ένα άτομο με ένα κενό για ένα μυαλό. Μπορούν να σας πω αν κάτι είναι ασαφές ή σύγχυση. Μπορούν να σας δώσει μια ιδέα για το τι ακριβώς η εμπειρία του χρήστη από το site σας. Μπορεί να είναι πολύ δύσκολο να πει ότι τον εαυτό σας, έτσι σίγουρα θα ήθελα να σας ενθαρρύνω όπως εσείς την ανάπτυξη σχεδίων σας - αν κάνεις σχέδια web-based - για να πάρει τους ανθρώπους που χρησιμοποιούν την περιοχή το συντομότερο έχετε κάποιο είδος των λειτουργικών demo. 

Τώρα είμαι πρόκειται να μιλήσω λίγο για το πώς να διαχειριστεί ένα έργο ανάπτυξης ιστοσελίδων. Έχουμε πάει πέρα ​​από το πώς μπορείτε να κάνετε την τεχνική back-end πλευρά, πώς μπορείτε να σχεδιάσετε μια πραγματικά καλή θέση, και αυτό είναι μεγάλη, αν εργάζεστε από τον εαυτό σας, αλλά - ακόμα και αν εργάζεστε με τον εαυτό σας και ειδικά εάν εργάζεστε σε μια ομάδα, διαχείριση του έργου γίνεται ένα μεγάλο ζήτημα. Έχετε είδος ακούσει για τη διαχείριση του έργου σε διάφορες μορφές από δημοτικό σχολείο, όταν σας είπαν ομάδα εργασίας. Θα πρέπει να συνεργάζονται, να επικοινωνούν, όλα αυτά. Αυτό ισχύει ακόμα εδώ, αλλά υπάρχουν μερικές μοναδικές συνθήκες με επιστήμης των υπολογιστών που θέλετε να γνωρίζετε, και θέλετε να βεβαιωθείτε ότι έχετε χειριστεί καλά. Θα μιλήσω πρώτα λίγο για την ομάδα που θα είναι μέσα Είναι πολύ σημαντικό να επιλέξετε το σωστό μέγεθος μιας ομάδας να εργάζονται για, και στην τελική του έργου σας Νομίζω ότι έχετε τη δυνατότητα να επιλέξουν μεταξύ 1 και 4 άτομα, αν δεν κάνω λάθος. Θέλετε να βεβαιωθείτε ότι δεν είστε απλά επιλέγοντας τον αριθμό των ατόμων που θέλετε να εργαστείτε με, επειδή είναι φίλοι σας. Θέλετε να επιλέξετε μια ομάδα που είναι ένα καλό μέγεθος και ότι θα γίνει η δουλειά. Υπάρχει ένας συμβιβασμός στην κατοχή περισσότερους ανθρώπους σε σχέση με λιγότερα άτομα. Εάν έχετε περισσότερους ανθρώπους, προφανώς περισσότερη δουλειά μπορεί να γίνει επειδή έχετε τα μέρη των ανθρώπων, πολύ κώδικα, πολλές ιδέες, και αυτό είναι όλα τέλεια. Αλλά αυτό απαιτεί επίσης πολύ πιο διαχείριση και πολύ περισσότερο την επικοινωνία. Με άλλα λόγια, αν έχετε 4 άτομα που εργάζονται για το ίδιο έργο και είναι όλα επεξεργάζεστε τον ίδιο κωδικό, λιγότερο ή περισσότερο όλοι είδους ανάγκη να γνωρίζουν τι συμβαίνει γι 'αυτό απαιτεί από εσάς - αν προσθέσετε κάποια νέα λειτουργία που το είδος του πρέπει να πει στους ανθρώπους - Είμαι προσθέτοντας, Αλλάζω αυτό με τον τρόπο αυτό - ειδικά αν μπει στο πραγματικά βαθιά ουσία όπως τα μοντέλα και τους ελεγκτές που είναι πραγματικά πρόκειται να επηρεάσει το πώς λειτουργεί η ιστοσελίδα. Όλη η ομάδα πρέπει να το γνωρίζουν, έτσι πρέπει να βεβαιωθείτε ότι δεν είστε επιλέγοντας πολύ μεγάλη μια ομάδα που πρόκειται να είναι δύσκολο να κάνουμε αυτή την ανακοίνωση. Μπορείτε, επίσης, δεν θέλουν να επιλέξουν μια αρκετά μικρή ομάδα που δεν πρόκειται να να είναι σε θέση να επικοινωνούν επειδή είναι μόνο η δική σας. 

Ένα άλλο πράγμα που εξετάζει είναι η ισορροπία, όπου οι δεξιότητες των ανθρώπων. Είναι μεγάλη, αν είστε όλοι πολύ καλοί προγραμματιστές. Αλλά αν είστε όλα τα back-end οι άνθρωποι, τότε το site σας δεν πρόκειται να φαίνονται πολύ καλά επειδή έχετε αυτή τη μεγάλη βάση δεδομένων, και το κάνει πολύ γρήγορη ερωτήματα αναζήτησης - η οποία είναι μεγάλη - αλλά όταν θα πάτε για αυτό, είναι σαν ένα χώρο 1990 με κόκκινο και μπλε παντού, και αυτό δεν είναι καλό ούτε. Παρατηρήστε ότι ο Ben και εγώ που εργάζονται ως ομάδα είναι πολύ ωραία γιατί είμαι είδος περισσότερο στο εμπρόσθιο άκρο, και οι δύο αλληλεπιδρούν στη μέση-τέλος, και ο Ben είναι πολύ καλό με back-end πράγματα, έτσι ώστε να λειτουργεί πραγματικά καλά, επειδή μπορούμε να σχεδιάσουμε οποιοδήποτε χώρο και κυρίως οι οπές σε αυτό το site που πρέπει να καλυφθούν μπορούν να πληρωθούν είτε ένας από εμάς, ή ενδεχομένως δύο. Θέλετε να βεβαιωθείτε ότι δεν υπάρχουν τρύπες στην ομάδα σας. Είναι εντάξει, αν υπάρχει ένα κομμάτι της επικάλυψης. Με άλλα λόγια, αν έχετε 2 άτομα που είναι τόσο καλά με την πλάτη τέλος, ότι μπορεί να είναι καλό, καθώς και επειδή μπορεί να βοηθήσει ο ένας τον άλλο με τα προβλήματα ότι έχουν. Μπορεί να είναι ένα πρόβλημα, αν έχετε μόνο 1 άτομο που είναι υπεύθυνο για ένα συγκεκριμένο πράγμα και τρέχει σε ένα πρόβλημα, έτσι ώστε να θέλουν να έχουν ένα μικρό κομμάτι της επικάλυψης αλλά το πιο σημαντικό θέλετε να βεβαιωθείτε ότι όλες οι πιθανές τρύπες γεμίζουν. 

Το τελευταίο πράγμα - και αυτό πρέπει να είναι προφανές, αλλά δεν είναι συχνά. Θέλετε πραγματικά να διασκεδάζουν. Το σημείο αυτού του τελικού σχεδίου CS50 και συχνά το σημείο της ανάπτυξης ιστοσελίδων σε γενικές δεν είναι να κάνει απλά μια δουλειά, γιατί χρειάζεται να κάνει. Θέλετε πραγματικά να διασκεδάζουν, και θέλετε να κάνει κάτι αυτό είναι κίνητρο σας να εργάζονται σε αυτό. Αν τιδήποτε θέλετε να κάνετε είναι ένας πόνος για να καθίσετε και να εργαστεί, τότε δεν είστε η επιλογή του σωστού προγράμματος. Θέλετε να επιλέξετε κάτι που θα βρείτε ενδιαφέρουσες, θέλετε πραγματικά να δείτε το αποτέλεσμα, είστε ενθουσιασμένοι, όταν μπορείτε να πάρετε μια νέα ιδέα για κάτι που θα μπορούσε να κάνει - έτσι δεν υπάρχουν όλα τα είδη των σχεδίων εκεί που είμαι σίγουρος μπορείτε να βρείτε - ο καθένας έχει κάτι που θα ίντριγκα τους πραγματικά αν είναι να κάνει ένα έργο web-based. Θα το πω και πάλι τώρα. Εάν το σχέδιό σας φαίνεται σαν ένας πόνος και δεν θέλετε να εργάζονται σε αυτό, επιλέξετε ένα άλλο έργο. Επιλέξτε κάτι που σας εμπνέει πραγματικά. 

Ben αναφέρεται αυτή η έννοια της επανάληψης λίγο, και θέλω να πάω πάνω από το ένα κομμάτι. Είναι πραγματικά σημαντικό να εργαστούν σε εκτοξεύσεις όπου θα λάβουν κάτι λειτουργικό. Μπορεί να είναι μεγάλη, αν έχετε αυτό το σχέδιο για μια ιστοσελίδα που πρόκειται να κάνει Α, Β, και Γ, και τελικά θα φτάσουμε εκεί. Αλλά είστε κολλημένοι σε αυτή τη φάση, όπου εργάζεστε σε αυτό και εργάζονται σε αυτό, αλλά τίποτα δεν είναι να πάρει γίνει. Δεν έχετε τίποτα να δείτε και μια απτή, λειτουργικό πράγμα. Αυτό που πραγματικά θέλουμε να κάνουμε όσο φαίνεται το είδος του πόνου μερικές φορές εργαστούν σε κάτι και στη συνέχεια το είδος της το καπάκι από, έτσι ώστε να είναι τουλάχιστον σε ένα σταθερό, τρέχει έκδοση, ακόμη και αν δεν έχει όλα τα χαρακτηριστικά που θέλετε. Και ίσως υπάρχουν κάποια χαρακτηριστικά γνωρίσματα που πραγματικά θέλετε να προσθέσετε, αλλά δεν μπορείτε ακριβώς επειδή θέλετε να πάρετε αυτό το site σε ένα λειτουργικό σημείο. Και έτσι θέλετε να το είδος έχει η όλη διαδικασία ανάπτυξης μοιάζουν με αυτό. Θέλετε να ξεκινήσει από κάπου λειτουργικό - ή ουσιαστικά αρχίσω με το τίποτα - αλλά θέλετε να πάρετε κάπου πολύ βασικό και λειτουργικό. Και πάλι, κάνουν ένα είδος άλμα και να πάρει κάπου λειτουργική και πάλι. Σιγά-σιγά θα δημιουργήσουν, και θα μπορούσε να πάει λίγο πιο αργή από ό, τι θα ήταν διαφορετικά, αλλά μακροπρόθεσμα, εάν είστε συνεχώς κολλημένοι σε αυτό μεσαία φάση του εδάφους, όπου μπορείτε δεν έχουν πραγματικά τίποτα εργασίας, μπορεί να είναι μια πραγματικά μεγάλη απογοήτευση να εργαστούν για το έργο σας, γιατί είστε πάντα τόσο κοντά στο να πάρει αυτό που εργάζονται, και αυτό είναι που στην πραγματικότητα ποτέ δεν εργάζονται. Θέλετε να εργαστούν σε αυτές τις λειτουργικές εκτοξεύσεις, και μπορείτε επίσης να θελήσετε να κάνετε κάποια αντανάκλαση μετά από κάθε μία. Με άλλα λόγια, όταν είστε σε ένα σημείο όπου η περιοχή είναι τώρα εργάζεται - δεν έχουν όλα σας αρέσει, αλλά κάνει κάποια πράγματα - θέλετε να σκεφτείτε, εντάξει, είναι αυτό το site επίτευξη του στόχου που έθεσε ως στόχο να κάνει; Με άλλα λόγια, εάν ο χώρος που πρόκειται να κάνει το Χ, είναι ό, τι έχω εργάζονται προς την κατεύθυνση της X; Είναι όλες τις λειτουργίες που ήθελα εκεί; Και επιπλέον, να εξυπηρετούν το γενικό σκοπό που θέλω; Αν είστε διαπίστωση ότι το site σας έχει αρχίσει να γυρίζω σε μια διαφορετική κατεύθυνση ή ίσως τα πράγματα ακριβώς το είδος του δεν εργάζονται έξω, μπορεί να είναι χρόνος για να αλλάζετε ταχύτητες λίγο. Με άλλα λόγια, αξίζει να εξεταστεί - αξίζει να ρίχνουν τις ιδέες, αν είναι απαραίτητο και λαμβάνοντας υπόψη είμαι πραγματικά εργάζονται προς αυτό που θέλω να είμαι. 

Πιστεύω ότι είναι το επόμενο σημείο μου. Μην φοβάστε να εγκαταλείψουν τις ιδέες. Ακριβώς επειδή έχετε περάσει πολλές ώρες εργασίας σε ένα χαρακτηριστικό και τελικά πήρε αυτό που εργάζονται, αλλά πραγματικά δεν πηγαίνει τόσο καλά - σαν να μην είναι τόσο χρήσιμο ή οι χρήστες που έχουν προβλήματα με τη χρήση του - αυτό το είδος του πράγματος - Δεν πρέπει να φοβόμαστε να το πετάξετε. Είναι χάλια που έχετε περάσει πολύ χρόνο εργασίας σε αυτό, αλλά τελικά δεν θέλετε ένα site που είναι το είδος της μαζί με αυτά τα κομμάτια που είδος της εργασίας, αλλά δεν είναι τόσο καλά εξυπηρετούνται. Επίσης, δεν πρέπει να φοβόμαστε να αγκαλιάσει τις νέες ιδέες. Αν κάποιος έρχεται και λέει, hey, ότι η ιστοσελίδα φαίνεται πραγματικά δροσερό, αλλά Δεν θα ήταν ακόμη να είναι μεγάλη, αν το έκανε και αυτό; Ακριβώς επειδή αυτό είναι κάτι που δεν είχε την πρόθεση και κάτι που δεν βρίσκεται στη λίστα specs, κάτι που δεν έχετε ορίσει να κάνουμε, Δεν πρέπει να φοβόμαστε να το πάρει και στη συνέχεια να εργαστείτε με αυτό. Επειδή συχνά οι ιδέες που θα τρέξει με όλη την πορεία της ανάπτυξης καταλήγουν να είναι τα πραγματικά δροσερά χαρακτηριστικά του δικτυακού τόπου. 

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

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

Ένα άλλο σημαντικό πράγμα είναι που θέλετε να κάνετε τακτικό καθαρισμό-ups. Κωδικός παίρνει βρώμικο. Να μην αισθάνονται άσχημα αν ο κώδικάς σας είναι μόνο εντελώς δυσανάγνωστο και ένα τεράστιο χάος. Αυτό συμβαίνει στην ανάπτυξη ιστοσελίδων πάντα. Είσαι προσθέτοντας νέα χαρακτηριστικά, αφαίρεση παλαιών. Stuff πρόκειται να είναι εκεί που δεν πρέπει να είναι. Αυτό είναι εντάξει, αλλά θέλετε να σιγουρευτείτε για να ασχοληθεί με αυτό σε τακτική βάση. Δεν θέλετε να το αφήσει να χτίσει μέχρι το σημείο όπου μπορείτε απλά δεν μπορεί να βρει τίποτα στον κώδικά σας, και δεν έχετε ιδέα τι κάνει τίποτα. Αυτή είναι η περίπτωση με την HTML. Μερικές φορές θα καταλήξετε με αντικείμενα που δεν περιέχουν τίποτα, και θα θέλετε να απαλλαγείτε από αυτά. Στην CSS, μπορείτε να παραπέμπει σε στοιχεία που δεν υπάρχουν πια, έτσι θέλετε να απαλλαγείτε από τον εν λόγω κώδικα. Στο JavaScript, μπορείτε να έχετε αφαιρέσει κάτι από την HTML. Έτσι, θέλετε να βεβαιωθείτε ότι είστε πάντα καθαρισμό, κάνοντας τα πράγματα αρκετά όσο μπορείτε σε τακτική βάση. 

Ένα άλλο πολύ χρήσιμο πράγμα που δεν νομίζω ότι περιγράφεται πολύ σε CS50 αλλά αξίζει να μπουν είναι ο έλεγχος έκδοση. Η ιδέα του ελέγχου της έκδοσης είναι όταν είστε ουσιαστικά την παρακολούθηση όλων των πρόοδο έχετε κάνει προς το site σας και αν κάποια στιγμή έχετε συνειδητοποιήσει, OH, αυτό λειτουργεί πριν από λίγο καιρό, αλλά δεν λειτουργεί πια, μπορείτε να πάτε πίσω σε προηγούμενες εκδόσεις και να δούμε τι έχει αλλάξει από τότε και ότι το είδος του πράγματος. Ο κύριος τρόπος για να γίνει αυτό είναι με Git και Git είναι όλο αυτό το είδος του συστήματος που Πιστεύω Tommy MacWilliam έδωσε διάλεξη για το περασμένο έτος. Αν πάτε σε σεμινάρια CS50 για το 2011, μπορείτε να δείτε το σεμινάριο του σχετικά με αυτό. Η ιδέα του Git είναι βασικά ότι σε τακτά χρονικά διαστήματα μπορείτε να κάνετε αυτές τις δεσμεύσεις που είναι οι τρόποι λέγοντας ότι η περιοχή είναι σε μια αρκετά σταθερή έκδοση τώρα, ώστε Είμαι αυτό που πακετάρουμε και να το στείλει μακριά σε ένα διακομιστή, και στη συνέχεια μπορείτε να πάτε σε αυτόν το διακομιστή και να εξετάσουμε όλες τις προηγούμενες εκδόσεις του κωδικού σας και να δείτε πώς έχει προχωρήσει και όλα τα τέτοιου είδους καλά πράγματα. Έτσι, αυτό είναι βασικά αυτό. Όσον αφορά την ανάπτυξη ιστοσελίδων, είμαστε στην ευχάριστη θέση να μείνω και να απαντήσει σε οποιαδήποτε ερωτήματα όσον αφορά την παρουσίαση μας. Έτσι μπράβο. Ευχαριστώ. >> [Ben] Ευχαριστώ. [Χειροκροτήματα] 

[Billy] προσωπικό, Υπάρχει κάποιος που έχει οποιεσδήποτε ερωτήσεις σχετικά με τα πράγματα που έχουμε καλύπτονται ή πράγματα που δεν καλύψαμε ότι ήλπιζαν ότι θα καλύψει; Θα χαρούμε να απαντήσουμε εκείνους. Όποιος; [Μέλος του ακροατηρίου] Ποια είναι τα πλεονεκτήματα και τα μειονεκτήματα από τη χρήση Ruby ή τη χρήση της Python; [Ben] Το ερώτημα ήταν, ποια είναι τα πλεονεκτήματα και τα μειονεκτήματα από τη χρήση Ruby ή Python αντί όπως PHP. Τα πλεονεκτήματα είναι ότι η Ruby και Python είναι πολύ καλύτερη από ό, τι γλώσσες PHP. Τουλάχιστον κατά τη γνώμη μου, και νομίζω ότι σε πολλές απόψεις άλλων ανθρώπων, καθώς και. Είχαν σχεδιαστεί περισσότερο για να κάνει πολύπλοκες πράγματα, και λιγότερο για την τερατώδη μαζί ιστοσελίδες πολύ γρήγορα με ένα μικρό κομμάτι του δυναμικού περιεχομένου. Τα μειονεκτήματα είναι ότι υπάρχει μια λίγο - υπάρχει κάτι περισσότερο από μια καμπύλη μάθησης για να τα δημιουργήσουν. Δηλαδή, όπως και σε PHP, μπορείτε να έχετε μόνο ένα αρχείο HTML και να γράψετε λιγότερο από ό, τι, ερωτηματικό, και στη συνέχεια να γράψετε κάποιο κώδικα, και στη συνέχεια να γράψετε το ερωτηματικό, μεγαλύτερη-από ό, τι, και στη συνέχεια να είστε έτοιμοι. Σε άλλες γλώσσες, όπως η Ruby ή Python, θα πρέπει να περάσουν λίγο περισσότερη δουλειά για να πάρει την αρχική λειτουργία ιστοσελίδα. Υπάρχει επίσης - τουλάχιστον αυτό χρησιμοποιείται για να είναι η περίπτωση - ότι υπάρχει περισσότερη τεκμηρίωση διαθέσιμες για την PHP μόνο και μόνο επειδή υπάρχουν περισσότεροι άνθρωποι που χρησιμοποιούν. Νομίζω ότι δεν είναι τόσο πολύ από ένα θέμα πια. Υπάρχει σίγουρα πολύ καλή τεκμηρίωση για πράγματα όπως η Ruby on Rails ή Django για την Python είναι το ισοδύναμο. PHP είναι αυτό που ο καθένας έχει χρησιμοποιήσει για χρόνια, και γνωρίζετε πώς λειτουργεί. Ruby και Python είναι λίγο λιγότερο ώριμες. 

[Μέλος του ακροατηρίου] Αν ήταν να επιλέξετε ανάμεσα σε ένα από αυτά για να μάθουν ή να πάρει, ποια θα προτιμούσατε; Ειλικρινά, νομίζω ότι εξαρτάται από το άτομο. Λυπάμαι. Το ερώτημα ήταν ποια θα επιλέγατε για κάποιον να μάθει; Θεωρώ Python τα ωραιότερα προσωπικά. Υπάρχουν πολλοί άνθρωποι που - Έκανα το πρώτο μου έργο dev web σε Python και Django. Υπάρχουν πολλοί άνθρωποι που τους αρέσει Ruby on Rails επίσης. Πιθανώς περισσότεροι άνθρωποι που γνωρίζουν Ruby on Rails. Ειλικρινά, θα ήθελα απλώς να πάει με ό, τι οι άνθρωποι γύρω σας γνωρίζουμε έτσι ώστε να έχετε τους ανθρώπους να κάνουν ερωτήσεις. 

Το ερώτημα ήταν - σε κοινές servers είναι το είδος του σκληρά για να εργαστούν σε Python; Αυτό εξαρτάται από τη φιλοξενία σας. Υπάρχουν μια σειρά από οικοδεσπότες Ιστού που θα τοποθετήσουν τα πράγματα Python. WebFaction κάνει αυτό, έτσι δεν είναι; WebFaction είναι αυτή που Μπίλι και έχω χρησιμοποιήσει για ορισμένα έργα. Είναι πραγματικά μεγάλη. Υποστηρίζουν περισσότερες γλώσσες. Αλλά είναι αλήθεια ότι η PHP είναι πολύ πιο ευρεία υποστήριξη. Έτσι, εάν είστε κολλημένοι σε ένα web υποδοχής που κάνει μόνο PHP, αυτό είναι ένας καλός λόγος για να χρησιμοποιήσετε το PHP. 

[Μέλος του ακροατηρίου] Πήρα ακριβώς στην εκμάθηση πώς να αναζητούν κάποιες βάσεις δεδομένων, και ξέρω SQL μου είναι σε όλη τη χώρα, αλλά πρόσφατα πήρε εκτίθενται - και να το επισημάνει. Βλέπετε JSON και επεκτάσιμη βάση δεδομένων. SQL μου είναι ακόμα σε όλη τη χώρα. Πώς μπορείτε να δείτε ότι συμβαίνει; Υπάρχει μετάβαση να είναι μια αυξανόμενη τάση για πιο επεκτάσιμη (δεν ακούγεται); Το ερώτημα ήταν - δεν νομίζω ότι υπάρχει πρόκειται να είναι μια τάση προς τις βάσεις δεδομένων μη-SQL. Για παράδειγμα, όπως MongoDB. Νομίζω ότι αυτό είναι σίγουρα αλήθεια. Η συμβουλή μου ήταν ως επί το πλείστον σχετίζονται με mySQL εδώ μόνο και μόνο επειδή είναι mySQL πρότυπο της βιομηχανίας. Προσωπικά, προτιμώ πολύ βάσεις δεδομένων που δεν έχουν schemos όπως MongoDB όπου δεν έχετε το θέμα του, OH, πρέπει να προσθέσετε μια άλλη στήλη. Θλίψη είναι εγώ, όπως και ό, τι μπορώ να κάνω; Είναι πολύ δύσκολο να το κάνουμε αυτό σε mySQL, αλλά όταν έχεις κάτι σαν Mongo Είναι πολύ καλύτερο. Το άλλο ωραίο πράγμα για Mongo είναι ότι τα αρχεία σας είναι στην πραγματικότητα JavaScript αντικείμενα. Δεν υπάρχει το είδος του σταδίου μετατροπής κατά την οποία θα πρέπει να πάρετε αυτές τις γραμμές βάσης και να τους μετατρέψει σε ένα αντικείμενο JavaScript και στη συνέχεια να τα στείλει πάνω από το σύρμα. Νομίζω ότι τα πράγματα, όπως ότι πρόκειται να είναι πολύ, πολύ χρήσιμο για την ταχεία ανάπτυξη ιστοσελίδων στο μέλλον. 

[Billy] Κάτι θα ήθελα να προσθέσω το οποίο είναι απλά ένα γενικό σημείο είναι ότι δεν αισθάνονται σαν να πρέπει να έχουν μάθει όλες τις γλώσσες που έχουμε συζητήσει από το σεμινάριο μας. Προφανώς, το θέμα είναι να σας δώσει μια ιδέα για το τι υπάρχει εκεί έξω, και αν είστε intrigued από κάποια από τα πράγματα που έχουμε αναφέρει μπορείτε να το Google και να διαβάσετε επάνω σε αυτά. Και όπως ανέφερα, υπάρχουν μερικά σεμινάρια που ασχολούνται με αυτά ακριβώς τα πράγματα. Υπάρχουν ακόμα περισσότερα σεμινάρια που δεν ανέφερα τα οποία πιθανώς να μπει αυτά τα πράγματα, όπως καλά. Η ιδέα είναι ότι αν θέλετε να εργαστείτε σε κάτι, εδώ είναι τα εργαλεία στη διάθεσή σας. Να μην αισθάνονται συγκλονισμένοι, εάν δεν είστε πραγματικά βέβαιοι για το τι αυτά τα εργαλεία κάνουν ακριβώς, αλλά ξέρουν ότι είναι εκεί έξω και ότι μπορείτε να κάνετε ευρεία χρήση τους από την Google. 

[Μέλος του ακροατηρίου] Τι είδους πράγματα εσείς πρέπει να κάνετε για να βεβαιωθείτε ότι η ιστοσελίδα σας φαίνεται καλό για κινητές συσκευές; [Billy] Κινητές συσκευές είναι λίγο δύσκολο. Υπάρχουν 2 τρόποι που μπορείτε να την προσεγγίσετε. Ο πρώτος τρόπος είναι ότι έχετε πραγματικά ένα κινητό ιστοσελίδα. Με άλλα λόγια, θα εκτελέσει κάποια ανίχνευσης στην αρχή όταν το πρόγραμμα περιήγησης που υποβάλλει την αίτηση στην ιστοσελίδα σας, η οποία είτε λέει επιστρέφει αυτή την άποψη - η οποία θα είναι και η άποψη για desktop ή laptop browsers - και αυτή η άλλη άποψη για κινητές συσκευές. Αυτό είναι ένα μέρος όπου οι απόψεις είναι πραγματικά ωραίο ότι μπορείτε λίγο πολύ η ανταλλαγή δύο έξω και να έχουν μια διασύνδεση που λειτουργεί πραγματικά καλά σε κινητές συσκευές και έχουν ένα εντελώς διαφορετικό που λειτουργεί πολύ καλά σε συσκευές του προγράμματος περιήγησης. Το πρόβλημα με αυτό είναι ότι χρειάζεται πολύ χρόνο, διότι αυτό σημαίνει κωδικοποίηση ένα εντελώς διαφορετικό περιβάλλον. Ο άλλος τρόπος που μπορείτε να κάνετε είναι - πολλά σύγχρονα κινητά τηλέφωνα θα εμφανίσει ιστοσελίδες και να προσπαθήσουμε να τους καθιστούν ως ένα πρόγραμμα περιήγησης θα ήταν, και κάνουν το καλύτερό τους. Μπορείτε να το είδος προσπαθήστε να μείνετε φως σχετικά με το ποσό της jQuery JavaScript είστε με τη χρήση η οποία τείνει να είναι όπου τα πράγματα μπορούν να πάνε στραβά λίγο. Αυτό είναι το είδος του τρόπου που πρέπει να χρησιμοποιήσετε αν δεν έχετε τόσο πολύ χρόνο. Αν έχετε το χρόνο να εργαστούν σε ένα κινητό περιβάλλον, που είναι προφανώς η καλύτερη επιλογή σας. 

Νομίζω ότι γενικά για τα έργα CS50, θα πάμε να θέλουν να επιλέξουν το ένα ή το άλλο. Με άλλα λόγια, θέλετε να κάνετε ένα κινητό app ή θέλετε να κάνετε μια ιστοσελίδα στην επιφάνεια εργασίας. Και αυτό το είδος καθορίζει πού θα πάει με αυτό. Αλλά αν θέλετε να επεκτείνετε αργότερα, πιθανώς το καλύτερο στοίχημά σας είναι να κάνει άλλο ένα interface για την άλλη. Έχω λίγη εμπειρία στην ανάπτυξη sites WordPress που βασίζεται. Δέχθηκα μια προσωπική ιστοσελίδα στο WordPress για λίγο. Αυτά τα είδη των πλαισίων μπορεί να είναι καλό μόνο ως πολύ βασικά πράγματα. Πολλάκις θα τρέξει μόνο σε πολλά θέματα προσαρμογής του όμως. Θα θέλουν να έχουν κάτι να εξετάσουμε ένα συγκεκριμένο τρόπο ή να είναι ένα συγκεκριμένο τρόπο και δεν μπορείτε ακριβώς επειδή είναι βαθιά χαραγμένα μέσα στο σύστημα που Αυτό είναι το πώς θα πρέπει να κάνουμε τα πράγματα που μπορεί να είναι ένα κομμάτι από ένα πρόβλημα. Από τότε έχω το είδος της ήταν περισσότερο διατεθειμένοι να εργαστούν με δικτυακούς τόπους από το μηδέν. Για τα πράγματα όπως βάσεις δεδομένων blog και αυτό το είδος του πράγματος δεν είναι πραγματικά ότι σκληρά για να οικοδομήσουμε ένα πλαίσιο. Εάν είστε πραγματικά τεντωμένο για το χρόνο, μπορείτε φυσικά να χρησιμοποιήσετε κάτι σαν WordPress ή ότι το είδος του πράγματος για ένα blog. Τα είδη των πραγμάτων ότι τα blogs κατάστημα και να κάνουν δεν είναι πραγματικά δύσκολο αρκεί το γεγονός ότι αν τρέχετε σε οποιοδήποτε από αυτά τα πράγματα, είστε πιθανώς καλύτερο απλά να κάνει μια έκδοση του in-house. 

Νομίζω ότι είναι γι 'αυτό, έτσι ευχαριστώ και πάλι για τα επόμενα. Απολαύσαμε πραγματικά να μιλάμε για τα παιδιά σας και ελπίζω ότι έχετε μάθει κάποια πράγματα. [Ben] Είμαστε στην ευχάριστη θέση να μιλήσει - πρέπει να πάμε, αλλά είμαστε ευτυχείς να μιλήσουμε περισσότερο έξω αν έχετε άλλη ερώτηση. Ευχαριστώ και πάλι. [Χειροκροτήματα] [CS50.TV]