[Powered by Google Translate] [Seminar] [Pembangunan Web: Dari Idea Pelaksanaan] [Ben Kuhn] [Billy Janitsch] [Universiti Harvard] [Ini adalah CS50] [CS50.TV] [Billy] Hi, Saya Billy dan ini adalah Ben. >> [Ben] Hi. Kita akan bercakap tentang pembangunan web hari ini. [Webdev] [Billy Janitsch dan Ben Kuhn] Sedikit mengenai kami pertama. Ben adalah jenis lelaki belakang. Dia membuat ia berfungsi. Dan kemudian saya pergi dan membuat mereka cantik. Saya sebahagian besarnya terlibat dengan depan jenis reka bentuk susun atur lebih barangan, dan Ben, di sisi lain, tahu apa yang dia berbuat demikian dia bekerja pada barangan belakang. Bersama-sama kita telah membuat beberapa perkara. Sebagai contoh, tahun lepas, kita bekerja di Gimblium yang dalam talian studio pembangunan permainan dalam. Itu adalah projek terakhir kami untuk kelas, dan sejak itu kami telah membuat Kelas Harvard yang merupakan rangka kerja dalam talian untuk melayari dan kursus membeli-belah di Harvard. Kami akan bermula dengan idea ini untuk laman web kami. Kami akan membuat Facebook, tetapi untuk kucing. Sebelum anda sebenarnya membuat laman web ini, tidak membuat laman web ini kerana ia tidak baik, tetapi kami akan menggunakannya sebagai rangka kerja yang dan melalui proses bagaimana kita mengambil idea ini dan mengubahnya menjadi sebuah laman web sebenar boleh kita gunakan. Kami akan memulakan dengan memecahkan laman web ke bawah. Seperti yang anda telah lakukan dalam CS50, anda mahu berfikir tentang apa yang adalah komponen sebenar yang masuk ke dalam laman web ini. Pada asasnya memutarkannya dari idea yang hanya semacam suatu konsep yang abstrak ke dalam satu perkara yang sebenar, ketara yang anda boleh membuat. Kita mulakan dengan bertanya beberapa soalan. Apakah laman web ini? Mengapa kita menjadikannya? Apa yang ia akan digunakan untuk? Perkara seperti. Dalam kes Facebook Cat, kita pada dasarnya mahu sebuah laman web yang membolehkan kucing rangkaian sosial antara satu sama lain. Idea ini adalah bahawa mereka boleh pos pada dinding masing-masing, mereka boleh membuat komen, perkara seperti. Dan di mana kita datang ke dalam komponen berfungsi. Kami kini mempunyai jenis ini rangka kerja - kita mempunyai profil pengguna, kita mempunyai komen, dan kami boleh pos. Mungkin suatu hari nanti kita akan dalam mempengaruhi suka dan perkara seperti. Dan kita jenis mahu untuk mengutamakan ciri-ciri ini akan masuk Kami ingin mengatakan seperti, okay, ia benar-benar penting bahawa setiap orang mempunyai profil yang dan semua orang yang boleh posting di dinding masing-masing. Menengah itu, komen akan baik. Mungkin kemudian kami akan dalam mempengaruhi sebagainya. Jadi, anda mahu mempunyai idea tentang apa yang asas untuk projek anda dan apa yang jenis ciri yang lebih umum yang boleh digunakan kemudian. Anda mahu jenis mempunyai senarai tertentu dalam minda, tetapi projek yang anda bermula dengan tidak akan menjadi projek yang anda selesai dengan. Dalam erti kata lain, perkara-perkara yang akan berubah semasa anda membangunkan laman web ini, dan anda mahu meninggalkan bilik untuk itu. Saya akan mengubahnya kepada Ben siapa yang akan bercakap sedikit tentang struktur. [Ben] saya akan bercakap tentang sampingan yang lebih teknikal pembangunan web. Mari kita pergi ke beberapa asas-asas pertama. Apabila anda melakukan aplikasi web, bahagian utama yang anda akan perlu ada ialah anda akan mempunyai beberapa perkara yang berlaku di sebelah pelanggan - iaitu, kod yang anda pelayar mengambil dari laman web ini dan JavaScript, HTML, CSS barangan. Itu semua di sebelah pelanggan. Anda akan mempunyai kod lain yang berjalan di sebelah pelayan yang menjejaki semua data yang orang menghantar kepada anda, memutuskan yang memberi apa, barangan seperti itu. Ini hanya beberapa istilah supaya anda semua sudah biasa dengan apa yang kita bercakap tentang. Beyond bahagian bahawa itu baik untuk memikirkan aplikasi web anda dari segi beberapa komponen yang berbeza. Apabila anda melakukan pembangunan web salah satu perkara yang anda perlu sentiasa cuba lakukan adalah untuk mengurangkan kerumitan. Lebih kompleks kod anda adalah peluang lebih ada untuk membuat bug, semakin sukar untuk mengubah kemudian. Jadi, jika anda boleh memecahkan aplikasi anda ke dalam beberapa bidang fungsian yang berbeza yang akan - dan anda boleh mengurangkan jenis jumlah komunikasi silang kawasan - yang akan membantu anda banyak dalam jangka masa panjang dari segi mengurangkan bug. Untuk menjadi konkrit, biasanya orang membahagikan aplikasi web ke dalam - ini adalah jenis perkataan buzz sekarang, tetapi ia masih berguna. Anda mungkin pernah mendengar orang bercakap tentang model, pandangan, dan pengawal. Model adalah data sebenar yang aplikasi anda akan berurusan dengan. Sebagai contoh, dalam kucing anda Facebook, model anda akan menjadi - anda akan mempunyai model bagi jawatan-jawatan seperti, dan model untuk profil pengguna, barangan seperti itu. Pandangan anda adalah bagaimana anda hadir data tersebut kepada para pengguna anda. Anda mungkin mempunyai 1 pandangan untuk mencari di pos tunggal dan semua komen dan pandangan yang berbeza untuk dinding anda yang mempunyai senarai semua jawatan yang ditujukan kepada anda, dan pandangan yang berbeza untuk berita anda - barangan seperti itu. Akhir sekali, anda mempunyai pengawal yang pada dasarnya apabila orang menghantar anda jawatan dan anda membuat kemaskini kepada sistem tulang belakang anda, anda kenaikan sekumpulan kaunter, dan apa sahaja. Mereka adalah pengawal anda. Saya akan bercakap kebanyakannya tentang model. Views secara teknikal tidak sukar dan isu ini adalah lebih dengan mereka bentuk mereka Pengawal akan khusus kepada apa sahaja yang anda mereka bentuk. Tetapi ada beberapa teknik agak umum anda boleh menggunakan untuk membuat model anda lebih bagus dan mudah untuk bekerja dengan yang aku fikir sangat membantu. Ini kebanyakannya akan menjadi kira-kira bagaimana untuk berurusan dengan data aplikasi web anda dengan cara yang baik. Isu-isu utama dengan model adalah bahawa mereka tinggal di pelanggan dan pelayan dan anda perlu memikirkan a) bagaimana untuk mendapatkan mereka - semua orang-orang yang berkaitan - dari pelayan kepada pelanggan, dan b) bagaimana untuk memastikan mereka selari. Pengguna anda akan mahu untuk membuat beberapa kemas kini. Mereka akan mahu membuat post baru. Mereka akan mahu suka benda-benda dan barangan jika anda mempunyai orang-orang seperti. Mereka adalah cabaran-cabaran teknikal utama berurusan dengan model. Perkara pertama yang anda akan mahu untuk tanya diri anda jenis data apa yang masuk dalam model ini dan apa jenis pertanyaan kita akan mahu lakukan - iaitu, bagaimana kita akan melihat model? Sebagai contoh Facebook Cat anda, post anda akan mempunyai seorang pengarang yang dikaitkan dengannya, teks pos dinding, dan penerima pos dinding. Dan kemudian anda mungkin mahu untuk query yang dalam banyak cara yang berbeza. Anda akan mahu melihat ia dengan yang menulis yang pos, oleh yang menerima yang pos, mungkin dengan tarikh ia diberikan. Tetapi jika anda akan melakukannya mengikut tarikh, maka anda perlu menambah satu lagi medan untuk jawatan anda apabila ia sebenarnya dihantar. Ini 2 faktor - apa data yang anda hendak gunakan dan bagaimana anda mahu melihatnya - anda harus berfikir tentang mereka pertama kerana mereka bergantung kepada satu sama lain, dan ia akan menjadi lebih sukar untuk menambah mereka di kemudian hari. Terdapat beberapa pertimbangan lain. Apabila anda berfikir tentang bagaimana anda berurusan dengan model pada pelayan apa yang anda mahu melihat adalah - anda pada dasarnya ingin pelayan semudah yang mungkin. Melakukan barangan di sebelah pelanggan secara umumnya adalah lebih cepat jika anda boleh melakukannya semata-mata pada pelanggan tanpa melakukan apa-apa jenis permintaan rangkaian. Idea ini adalah untuk melakukan seperti yang banyak pertanyaan yang anda boleh pada pelanggan. Satu-satunya masalah dengan itu adalah bahawa jika anda meminta semua data anda pada permulaan kemudian yang akan mengambil masa yang lama untuk beban. Jadi, idea ini adalah untuk menyerang sederhana gembira antara yang mempunyai data yang mencukupi pada pelanggan bahawa anda boleh melakukan kebanyakan kerja anda di sana tetapi tidak hanya semasa mengambil semua sekali gus supaya anda mendapat masa beban benar-benar perlahan pada permulaan. Sebagai contoh, untuk data kucing anda anda mungkin mahu mengambil sekumpulan posts dinding baru-baru ini. Anda tidak mahu untuk mendapatkan semua daripada mereka kerana yang boleh kembali beberapa tahun. Tetapi anda tidak mahu mengambil mereka satu per satu kerana itu akan memperkenalkan banyak beban rangkaian. Ia sering agak keras - sebaik sahaja anda mempunyai berjalan pangkalan data - ia sering agak sukar untuk mengubah apa data yang anda mempunyai di dalamnya - iaitu, tambahkan lajur pangkalan data yang baru atau sesuatu - jadi satu strategi yang baik adalah benar-benar hanya untuk menyimpan banyak data anda dalam tompok teks - tompok JSON - JSON menjadi JavaScript Objek Notasi - Sebab itulah berguna adalah kerana anda boleh menambah ciri-ciri baru untuk semua ini gumpalan JSON tanpa mengubah pangkalan data anda. Kelemahan hanya untuk itu adalah bahawa jika anda mempunyai sekumpulan bidang yang anda tambah di kemudian hari - seperti yang tersembunyi di JSON tompok - maka ia lebih sukar untuk query mereka di dalam pangkalan data. Sebagai contoh, jika anda kemudian - jika anda mempunyai model post anda yang kami dibincangkan sebelum ini dengan hanya penulis, penerima dan teks - anda juga boleh mempunyai tompok JSON dan kemudian jika anda kemudian mahu menambah medan tarikh anda tidak perlu untuk menukar pangkalan data anda. Anda hanya boleh menambah tarikh untuk kesemua medan teks. Dan kemudian anda akan dapat melihat orang-orang di sebelah pelanggan, tetapi anda tidak akan dapat untuk query mereka di sebelah pelayan kerana ia tersembunyi di dalam teks itu. Isu lain yang anda mahu berfikir tentang ialah bagaimana pelanggan anda dan pelayan anda akan berkomunikasi. Anda biasanya ingin menyimpan ini semudah mungkin. Anda hanya boleh mempunyai seperti-me-ini mendapat permintaan data, yang mencipta-a-baru-objek perkara, dan permintaan update-an-lama-objek. Dan ini semua akan menjadi URL yang berbeza pada pelayan anda - bahawa pelayar akan - anda boleh menggunakan permintaan AJAX untuk semua ini dan sama ada menerima atau data pos. Sekali lagi, sebagai contoh Facebook Cat kami, anda boleh mempunyai URL yang untuk mendapatkan pos individu, dan anda akan mempunyai URL untuk membuat siaran dinding baru dan mungkin URL untuk memuat naik gambar profil anda, barangan seperti itu. Tetapi sekali lagi, itu untuk pra-mengambil sebahagian besar data anda supaya anda tidak perlu menyimpan membuat permintaan rangkaian. Atas sebab itu, anda mungkin tidak mahu mempunyai individu permintaan mendapatkan untuk bedah tunggal, dan sebaliknya anda hanya mahu mendapatkan 1 permintaan untuk keseluruhan dinding. Dan kemudian jika anda cuba untuk mencapai keseimbangan kerana - ini juga akan bergantung kepada permohonan anda. Kerana jika anda menjangkakan bahawa orang hanya mempunyai 10 atau 20 posts dinding yang akan halus. Tetapi jika anda menjangkakan mereka akan mempunyai beribu-ribu borang permintaan yang akan mengambil masa yang lama, dan supaya anda mungkin mahu menambah mendapatkan-semua-jawatan-sejak parameter. Untuk semua ini anda mungkin akan mahu untuk sync data anda dalam JSON - JavaScript Objek notation. Hampir setiap bahasa memperkatakan JSON dengan baik. JQuery mempunyai fungsi getJSON ini bagus yang akan melakukan semua kerja keras untuk anda. Dan pada PHP ada juga fungsi komunikasi JSON sangat bagus. Jadi, itu mungkin format terbaik untuk menghantar model anda ke belakang dan sebagainya. Sebagai contoh apa yang kita telah berbincang mengenai setakat ini, di sini adalah satu contoh aliran untuk aplikasi Facebook Cat anda. Ia bermula dengan pelayar anda meminta URL laman web asas. Pelayan mungkin akan menghantar lebih HTML statik dan ada JavaScript dan CSS. Ia biasanya baik untuk tidak melakukan apa-apa rendering pada pelayan. Anda mungkin tidak mahu - apa yang pelayan tidak melakukan ada akan ke bawah senarai jawatan dinding dan menjana beberapa HTML untuk masing-masing dan menghantar bahawa lebih. Ia biasanya terbaik untuk melakukannya di sebelah pelanggan kerana jika tidak, setiap kali anda mahu menarik semula sesuatu, anda perlu membuat permintaan pelayan. Dan yang dengan cepat memberikan anda banyak overhed. Ia biasanya terbaik hanya untuk kapal menurunkan statik HTML dan kemudian JavaScript dan CSS yang akan melakukan paparan di sebelah pelanggan. Sebaik sahaja barangan yang datang dalam, maka anda boleh mempunyai - dalam JavaScript - anda boleh melakukan permintaan untuk data dinding dan barangan seperti itu, dan selepas itu pelayan itu pada dasarnya hanya melakukan pertanyaan pangkalan data dan memeriksa kebenaran. Satu-satunya perkara yang penting ialah bahawa ia tidak boleh menghantar lebih pengguna beberapa jawatan lain dinding bahawa anda tidak dibenarkan untuk melihat. Ia pada dasarnya boleh menjadi lapisan nipis akses kepada pangkalan data anda, dan kemudian semua yang menunjukkan data - semua pandangan dan barangan - mereka boleh berlaku dalam pelayar anda, dan kemudian apabila anda mahu membuat post atau sesuatu anda hanya menghantar permintaan lain. Terdapat juga beberapa barangan mewah yang anda boleh lakukan di atas ini. Dari segi maklumat teknikal yang lebih khusus, membangun dalam JavaScript biasa boleh menjadi sedikit menyakitkan, jadi ada beberapa perpustakaan dan alat yang akan membantu anda banyak dengan itu. Saya rasa anda semua mungkin mendengar tentang jQuery yang menjadikan melakukan rendering HTML dan manipulasi lebih mudah - mempunyai banyak fungsi mewah untuk pudar dalam dan keluar, dan melakukan animasi bersemangat. Terdapat juga perpustakaan ini dipanggil Underscore.js. Ia mempunyai banyak fungsi utiliti berguna, barangan yang anda inginkan JavaScript untuk mempunyai bahawa ia benar-benar doesn't - perkara seperti shuffling array, mengeluarkan salinan dari senarai, atau mendatar senarai senarai. Ini hanyalah contoh kod kecil. Garis bawah mempunyai satu tan fungsi-fungsi ini baik yang anda ingin anda akan mempunyai semua masa. Dan kemudian ada 1 perpustakaan lagi yang saya ingin menghabiskan sedikit masa di dipanggil Backbone.js kerana Tulang Belakang benar-benar membantu anda berurusan dengan model di sebelah pelanggan dan banyak kekeliruan yang ia boleh menyebabkan. Tulang Belakang memberikan anda konsep ini model dan koleksi dalam JavaScript yang pada dasarnya sama seperti objek JavaScript dalam JavaScript tatasusunan tetapi mereka mempunyai acara apabila anda menukar sifat-sifat mereka. Sama seperti dalam JavaScript, anda boleh mempunyai acara apabila butang mendapat klik atau sesuatu model Tulang Belakang dan Tulang Belakang koleksi akan menyiarkan perkara-perkara seperti bahawa apabila mereka berubah. Ini bermakna bahawa anda hanya boleh menulis sesuatu seperti potongan kod ini di sini - ini berkata, setiap kali anda menambah apa-apa kepada pelbagai jawatan yang anda melukis semula keseluruhan dinding. Dan ini bererti setiap kali bilangan jawatan ini suka berubah, anda memberitahu pengguna bahawa seseorang menyukai siaran mereka. Atau bila-bila masa mana-mana harta jawatan perubahan yang anda melukis semula jawatan itu. Barangan seperti itu akan menjimatkan banyak kerumitan kerana jika tidak, jika anda tidak mempunyai rangka kerja seperti ini maka setiap kali dalam kod anda bahawa anda menukar apa-apa mengenai jawatan, anda akan perlu ingat diri anda untuk memanggil semua menyebabkan fungsi dan barangan seperti itu, dan jika anda mahu menambah sesuatu yang baru yang berlaku setiap kali anda diubahsuai jawatan anda akan perlu melalui setiap tempat di anda kod yang anda diubahsuai jawatan dan menambah bahawa perkara yang baru. Rangka kerja seperti ini akan mengeluarkan banyak bahawa komunikasi antara lapisan yang membuat kod anda kompleks dan sukar untuk mengekalkan. Ada sedikit tentang pandangan juga. Saya akan meninggalkan sebahagian besar daripada ini kepada Billy kerana mereka secara teknikal tidak begitu sukar. Gunakan jQuery untuk pandangan anda. Ia boleh dikatakan seperti satu keperluan pada ketika ini. Ia hanya menjadikan segala-galanya lebih mudah. Terdapat banyak perpustakaan. Jika anda telah rumit unsur-unsur antara muka pengguna, jika anda mahu satu perkara yang auto-lengkap atau suka salah seorang daripada mereka mewah berbilang selectors - jika anda mahu apa-apa seperti itu, anda mungkin perlu hanya mencari di sekeliling dan anda boleh menemui sebuah perpustakaan yang baik yang akan melakukan apa yang anda mahu. Billy akan menjelaskan lebih lanjut mengenai bahagian-bahagian yang benar-benar sukar pandangan. Juga, sebagai nota sampingan, Tulang Belakang mempunyai beberapa fungsi untuk membuat pandangan berkomunikasi baik dengan model - melihat dokumentasi untuk semua perpustakaan ini, sebenarnya. Lihat sahaja docs. Mereka sangat yang ditulis dengan baik dan mudah untuk diikuti. Secara umum, anda boleh cukup banyak hanya Google jika anda mempunyai masalah. Terdapat banyak orang yang menggunakan mereka. Saya rasa ini adalah sebagai nota akhir. Terdapat juga beberapa perkara yang lebih maju yang boleh anda lakukan jika anda sedang mencari untuk membuat aplikasi web anda tambahan hebat. Anda boleh melakukan - spesifikasi HTML5 baru mempunyai banyak perkara yang mewah yang boleh anda lakukan. Simpanan tempatan - yang anda boleh menyimpan data dalam browser - bukannya untuk kembali dan membaca dengan teliti pelayan untuk segala-galanya, anda boleh menyimpan sebahagian daripadanya pada pelanggan dan juga membolehkan orang - dalam beberapa kes ia juga boleh membenarkan anda menggunakan luar talian laman web. Ada perkara ini dipanggil WebSockets yang pelbagai jenis komunikasi rangkaian di mana bukan hanya anda membuat satu permintaan, anda akan mendapat sambutan dan anda selesai, anda menyimpan membuka sambungan kepada pelayan dan supaya anda boleh melakukan perkara-perkara seperti kemas kini masa nyata. Jadi, jika anda cuba untuk membuat app chat, anda boleh menggunakan WebSockets untuk berkomunikasi belakang dan sebagainya supaya anda tidak perlu menyimpan meminta, "Oh, pelayan, tidak sesiapa menghantar saya berbual?" setiap 10 saat atau sesuatu. Terdapat juga satu ciri HTML5 yang menarik di mana anda boleh membuat ia kelihatan seperti URL laman berubah tanpa pernah mempunyai untuk benar-benar menambah nilai itu. Anda boleh menggunakan belakang dan ke hadapan butang tanpa melakukan sekumpulan permintaan rangkaian. Barangan seperti itu adalah benar-benar berguna dari segi membuat ia cepat tetapi juga bekerja seperti aplikasi web sepatutnya. Terdapat juga perkara ini dipanggil CoffeeScript. CoffeeScript adalah bahasa yang berbeza, sebenarnya, yang menghimpunkan ke JavaScript. Anda akan menulis semua kod anda dalam CoffeeScript, dan kemudian anda menjalankan pengkompil ini, dan ia memuntahkannya keluar fail JavaScript anda boleh termasuk di dalam laman web anda. Alasan bahawa CoffeeScript bagus adalah kerana ia menghilangkan banyak yang kes pelik yang mempunyai JavaScript mana sama setaraf, dan sama setaraf melakukan perkara yang berbeza, atau suka - ia mempunyai sintaks lebih bagus untuk berurusan dengan tatasusunan dan fungsi. Ini adalah coretan sedikit CoffeeScript yang menghasilkan satu senarai semua kuasa dua dari 10 ^ 2-1 ^ 2 secara terbalik. Seperti yang anda lihat, CoffeeScript sering membolehkan anda meluahkan dalam 1 garis apa yang akan mengambil masa selama 5 baris JavaScript. Ia boleh membuat perkara yang lebih mudah. Ia sedikit sintaks baru untuk belajar pada mulanya, tetapi ia pasti akan membuat anda lebih produktif dalam jangka masa panjang. Anda juga boleh menggunakan bahasa lain pada pelayan daripada PHP - bahasa seperti Ruby, Python, atau ada juga projek yang dikenali sebagai node.js yang akan membolehkan anda menggunakan JavaScript pada pelayan. Secara peribadi, saya benar-benar, benar-benar benci PHP. Saya hanya tidak seronok bekerja dengannya. Jika anda juga berfikir bahawa ia adalah satu cluge besar bahasa, maka anda boleh menggunakan salah satu daripada sebaliknya. Secara umum, jika anda mahu melakukan sesuatu dan anda tidak benar-benar tahu bagaimana anda akan melakukannya, hanya mencari Internet. Terdapat tan dan tan sumber terutamanya di - StackOverflow adalah satu yang besar. Ia adalah laman web ini di mana pengaturcara meminta setiap soalan lain. Anda mungkin telah berjalan ke dalamnya jika anda menghadapi masalah pada set masalah CS50. Dan ada tan perpustakaan untuk melakukan cukup banyak apa sahaja yang anda mahu. Jika anda mahu melakukan sesuatu dan anda tidak tahu bagaimana untuk melakukannya, jangan menganggap bahawa ia adalah mustahil. Cuma melihat dan anda mungkin menemui beberapa sumber yang baik. Sebagai umum mengakhiri, yang takeaways utama ialah menjaga perkara-perkara mudah. Yang lebih kompleks kod anda adalah pada permulaan dan lebih banyak anda mencuba dan melakukan barangan mewah, semakin lama ia akan mengambil masa untuk mendapatkan sesuatu yang sebenarnya berfungsi dan sukar akan mengubah kemudian. Jadi, melakukan perkara-perkara, cara mudah bisu pertama. Untuk pergi bersama-sama dengan itu, jangan takut membuang kod lama atau membersihkannya sehingga banyak. Secara umum, apabila anda benar-benar mempunyai sesuatu kerja, ianya lebih mudah untuk berfikir tentang daripada apabila anda masih dalam peringkat permulaan bagaimana saya meletakkan ini semua bersama-sama. Ia terbaik untuk membuat reka bentuk yang paling bodoh mungkin yang bekerja dan kemudian memperbaikinya secara berulang daripada cuba untuk mendapatkan segala-galanya betul pada kali pertama. Dari segi pembahagian pelanggan-pelayan, cuba dan menyimpan pelayan anda sangat mudah - hanya pangkalan data dan beberapa pengesahan dan tidak melakukan apa-apa kerja keras di sana. Adakah semua barangan rumit anda di sebelah pelanggan dalam pelayar dalam JavaScript sebanyak yang anda boleh. Lihat sekeliling untuk perpustakaan yang membuat hidup anda lebih baik. Sentiasa lebih baik untuk menggunakan kod yang orang lain telah menulis jika anda - dan tidak menulis sendiri. Ada banyak barangan di Internet. Google adalah rakan anda yang terbaik. Google adalah rakan programmer terbaik. Ya, pasti tidak takut untuk melihat sekeliling untuk barangan. Baiklah. Dan kepada Billy. [Billy] Sebenarnya, sebelum saya bermula dengan beberapa barangan reka bentuk, adakah sesiapa mempunyai sebarang soalan untuk Ben mengenai apa-apa yang dia bercakap tentang? Baiklah, baik. Sekali lagi, marilah kita tahu jika apa-apa tidak jelas atau jika anda mahu kami pergi ke sesuatu yang sedikit lebih. Saya akan langkah ke belakang sedikit dan bercakap mengenai bahagian-bahagian yang lebih asas reka bentuk. Ben disebut model yang dipanggil - maaf, model sistem pandangan pengawal yang jenis aspek teknikal, jadi saya akan melihat pandangan khusus, dan saya akan bermula dengan bagaimana anda akan mereka bentuk pandangan yang kelihatan bagus. Berikut adalah jenis template benar-benar asas untuk Cat kami Facebook. Saya rasa terdapat beberapa asas-asas dalam reka bentuk UI moden yang bernilai mengambil. Anda boleh notis terdapat banyak ruang putih di seluruh halaman, banyak ruang untuk perkara-perkara. Jangan merasakan anda ada untuk skuasy sesuatu ke dalam halaman. Anda mahu meninggalkan banyak ruang terbuka, dan jika anda pergi ke hampir mana-mana laman web moden anda akan melihat ada putih mana-mana. Ada putih di tempat-tempat yang anda tidak akan mengharapkan. Anda mempunyai palet warna ini, dan ia adalah bijak pada awal untuk memilih palet warna yang anda akan bekerja dengan dan berkembang. Anda juga - ia membantu untuk memilih muka taip, dan cara bahawa anda seperti bergerak dengan ini asas-asas konkrit reka bentuk. Anda mempunyai jenis anda, anda mempunyai warna anda, dan kemudian anda boleh jenis muat segala-galanya dalam sebagai diperlukan. Jadi, seperti yang saya katakan, dengan skim warna anda, anda mahu menggunakan warna yang lebih berani skim warna anda berhati-hati. Tajuk yang bagus. Butang adalah baik untuk mempunyai benar-benar besar, warna mewah. Tetapi secara umum, jika anda mempunyai laman web yang mempunyai warna di mana-mana, semua merenung anda di muka, ia hanya kelihatan berantakan, dan ia tidak baik. Anda mahu untuk secara amnya menggunakan warna-warna cahaya. Cuba, sekali lagi, memilih skim warna cukup masuk akal. Anda boleh mempunyai percikan ini sedikit daripada banyak warna - yang boleh kelihatan cantik bagus, tetapi anda mahu menggunakan mereka cukup berhati-hati. Seperti yang saya katakan, anda mahu menjadi minimum. Kurang adalah hampir selalu lebih. Jika anda boleh memaparkan sesuatu atau tidak memaparkan sesuatu, dan anda jenis tidak pasti sama ada ia perlu berada di sana secara lalai - mungkin anda terbaik off meninggalkan ia daripada. Anda sentiasa boleh menambah dalam kemudian. Ya, menyimpan perkara-perkara yang mudah. Tetapi yang paling penting, anda perlu mempertimbangkan pelbagai reka bentuk. Jangan berfikir bahawa apabila anda membuat laman web, anda mempunyai dalam kepala anda yang anda akan membuat laman web dengan cara yang tertentu, dan ia akan kelihatan sama seperti ini. Ia akan mempunyai header biru di bahagian atas dan bar sebelah biru dan maka perkara sub-header kuning. Anda ingin pelbagai template. Anda boleh sama ada - jika anda baik dengan Belian Photo, anda boleh membuka yang dan jenis mereka bentuk laman web seperti yang anda suka untuk melihat. Jika tidak, anda hanya boleh menggunakan pen dan kertas, tetapi menggaru sehingga pelbagai reka bentuk. Anda mahu pada dasarnya mempunyai ditubuhkan di mana anda mempunyai banyak reka bentuk yang berbeza, dan jika seseorang berakhir kerja, maka itulah yang besar. Jika seseorang berakhir gagal, maka anda sentiasa mempunyai satu sama lain untuk beralih kepada. Secara umum, tidak merasa seperti anda harus dikekang untuk apa sahaja reka bentuk yang anda mulanya memutuskan. Reka bentuk adalah sangat berubah-ubah, dan sebahagian daripada kepentingan model yang sistem pandangan pengawal adalah bahawa anda boleh swap dalam dan di luar pandangan yang berbeza yang anda mahu. Anda boleh bergoyang data sehala, dan kemudian membuat keputusan, oh, sebenarnya, itu tidak berfungsi dengan baik. Saya fikir ia adalah jenis terlalu rumit atau ada sebahagian di sini yang tidak benar-benar bekerja, jadi saya hanya akan benar-benar meninggalkan pandangan ini dan swap dalam satu yang sama sekali baru. Kita masih boleh menggunakan model lama dan pengawal lama. Kita boleh melakukan segala-galanya pada pelayan dan pelanggan seperti yang kita akan sebelum ini. Tetapi gelombang sebenar data seperti yang dipaparkan akan menjadi sedikit berbeza. Setakat sebenarnya melaksanakan reka bentuk yang anda mahu, sekali anda mempunyai reka bentuk beberapa dilakarkan di atas kertas atau pada Belian Photo atau apa sahaja, terdapat beberapa alat-alat yang disediakan untuk anda. Yang pertama anda sangat biasa dengan yang HTML anda, PHP, atau apa sahaja bahasa anda dengan hanya menggunakan kod halaman statik pada laman web anda. Anda telah bekerja banyak dengan HTML yang jenis memberikan anda tag ini yang anda boleh meletakkan sesuatu ke dalam, dan pada dasarnya ia adalah cara yang menganjurkan kandungan anda. Sebagai contoh, anda mempunyai header di atas tu, jadi anda akan mempunyai tag header, dan ia akan mempunyai beberapa teks di dalamnya yang mungkin akan berada di dalam tag yang lain. Kemudian anda mempunyai bar sisi yang mungkin dengan beberapa pautan yang berbeza, dan mereka akan semua berada dalam tag yang berasingan. Jadi, pada dasarnya HTML di tengah-tengahnya adalah satu cara membahagikan halaman bagaimana anda akhirnya mahu format ia. Jadi sekali lagi, anda telah melihat bahawa sebelum ini. Anda cukup selesa dengan bekerja dengan sekarang memandangkan anda telah melakukan Serangga terakhir diharapkan, supaya tidak mendatangkan masalah. Kemudian anda mempunyai CSS yang pada asasnya mengendalikan semua reka bentuk aspek statik. Ia akan mengendalikan semua warna, semua kedudukan unsur-unsur yang berbeza, di mana mereka pergi berkenaan dengan satu sama lain, bagaimana besar mereka, pelbagai jenis positionings yang anda perlu - dalam erti kata lain, anda boleh mempunyai perkara tetap supaya apabila anda tatal ke bawah mereka tinggal, atau anda boleh mempunyai perkara berbanding dengan unsur-unsur lain. Semua yang jenis barangan adalah dalam CSS. Tambahan pula, anda boleh melakukan hiasan yang berbeza, anda boleh mempunyai warna teks, kesan teks, semua jenis barangan. Ben memberikan seminar benar-benar baik pada hujung minggu terakhir ini, dan saya pasti akan pastikan jika anda merancang untuk melakukan beberapa perkara yang mewah dengan CSS. CSS3 sebenarnya versi terbaru CSS, dan ia boleh melakukan pelbagai perkara benar-benar baik. Ia boleh melakukan kecerunan, anda boleh mempunyai bagus, sudut bulat, anda boleh melakukan pelbagai barangan untuk membuat laman web anda kelihatan lebih moden dan mewah. Alat seterusnya adalah JavaScript dan jQuery yang Ben bercakap sedikit tentang, tetapi saya akan mendapat sedikit lebih jauh ke dalam. JavaScript, seperti yang anda bekerja dengan ia sedikit, atau sekurang-kurangnya dilihat dalam kuliah, adalah jenis cara dinamik melakukan barangan dalam HTML. HTML, seperti yang anda tahu, adalah statik, jadi sebaik sahaja anda mempunyai HTML anda tidak boleh mengubah suai. Tetapi JavaScript, dalam beberapa cara, adalah satu cara untuk dapat mengubah suai HTML. Jadi, anda boleh melakukannya, dan yang hebat, tetapi benar-benar JavaScript adalah sakit untuk bekerja dengannya. Ia amat panjang dan bodoh dan untuk melakukan walaupun perkara yang paling mudah memerlukan banyak baris JavaScript. Jadi, jQuery pada dasarnya ialah perpustakaan untuk JavaScript yang memudahkan semua itu. Ia mengatakan, okay, jika anda mahu mempunyai peti persegi datang dari kiri dan pudar ke dalam halaman supaya ia di tengah-tengah, di JavaScript yang akan mengambil - Saya tidak tahu, seratus baris untuk lakukan, dan ia akan menjadi sakit, dan anda datang daripada itu membenci segala-galanya tentang pengaturcaraan web. JQuery anda pada dasarnya mempunyai unsur-dot-pudar masuk atau sesuatu seperti itu. Fungsi yang, sangat, sangat mudah yang akan membolehkan anda melakukan semua jenis animasi sejuk dan begitulah. Perkara lain yang ini 2 benar-benar baik untuk hanya melakukan perkara-perkara yang dinamik dengan laman web. Jadi, daripada hanya mempunyai halaman HTML anda - yang memaparkan beberapa data tetapi sebenarnya tidak melakukan apa-apa - JavaScript dan jQuery akan membolehkan anda mempunyai butang yang anda boleh klik pada, dan anda boleh menyeret dan unsur-unsur semula pesanan mereka dan menyusun mereka, dan mempunyai unsur-unsur baru ditambah atau dibuang. Anda boleh menambah-padam, perkara seperti. Jadi, jQuery tidak tan perkara yang sejuk. Dan Vipul sebenarnya memberi satu seminar mengenai hari ini, yang saya percaya, 5-pukul, jadi jika anda boleh melekat di sekitar untuk yang panjang, yang akan - 5 atau 4? Empat. Maaf. Ini sebenarnya selepas ini, jadi saya akan mengesyorkan melekat di sekeliling untuk itu jika anda boleh. JQuery adalah super, super berguna, dan anda akan dapat melakukan banyak perkara yang benar-benar baik dengan ia untuk cukup banyak mana-mana projek pembangunan web. Sekarang saya akan masuk ke dalam jenis perbezaan. Saya telah berbicara mengenai antara muka pengguna. Antara muka pengguna hanya reka bentuk laman web ini. Tetapi ada semacam satu lagi konsep yang pengalaman pengguna. Dua yang sangat berbeza. Muka memang sebahagian daripada pengalaman. Dalam erti kata lain, apabila anda pergi ke laman web, anda melihat antara muka. Itu sebahagian daripada bagaimana anda mengalami laman web ini. Tetapi pengalaman pengguna yang lebih daripada itu. Pengalaman pengguna adalah kira-kira apa tanggapan bahawa pengguna mendapat daripada laman anda. Jadi, jelas, antara muka adalah sebahagian daripada itu. Dan ia pasti sebahagian perlu, tetapi ia tidak mencukupi. Dalam erti kata lain, jika anda mempunyai antara muka yang bagus, dan ia cantik dan berwarna-warni dan semua itu, yang hebat, tetapi jika pengguna pergi ke laman web anda, melihat susun atur cantik dan ia keliru dengan segala-galanya, tidak tahu bagaimana untuk berbuat apa-apa, maka jelas anda telah membuat yang benar-benar laman web miskin. Itulah jenis di mana pengalaman pengguna datang masuk Saya akan bercakap sedikit tentang reka bentuk UX - UX singkat untuk pengalaman pengguna - dan jenis bagaimana anda boleh memastikan bahawa anda mempunyai pengalaman pengguna yang baik. Perkara pertama adalah bahawa anda boleh mereka bentuk laman web di mana pengguna boleh melakukan apa-apa yang pengguna yang mungkin mahu. Tetapi jika pengguna tidak boleh memikirkan bagaimana untuk melakukan perkara-perkara - dalam erti kata lain, jika pengguna tidak mempunyai idea yang baik apabila mereka pergi ke laman web anda, "Oh, jika saya mahu mengemas kini profil saya, maka saya klik butang ini, atau jika saya mahu pos pada dinding seseorang, maka saya pergi ke dinding mereka dan klik pada kotak kecil. " Jika pengguna tidak tahu itu, maka anda berkesan mempunyai tidak sebenarnya dilaksanakan fungsi yang betul. Sebahagian daripada melaksanakan fungsi adalah bahawa pengguna sebenarnya mampu untuk menggunakannya. Dan ia mungkin mengecewakan - anda mungkin membuat laman web, dan ia boleh melakukan semua jenis perkara yang indah, tetapi kemudian anda akan mempunyai orang mengujinya dan berkata, "Ia tidak boleh melakukan ini. Kenapa ia tidak boleh melakukan ini? "Dan anda akan mengatakan kembali kepada mereka, "Nah, ia boleh. Anda hanya perlu pergi ke dalam 7 menu drop-down pada ini kabur laman yang hanya ditemui oleh link di sudut kanan bawah tangan "atau sesuatu. Jelas sekali, anda tidak mahu itu. Anda mahu ia menjadi jelas kepada pengguna anda apa yang mereka sepatutnya lakukan, dan ia sepatutnya mudah dan intuitif untuk mereka. Satu lagi perkara yang anda ingin mencuba lakukan adalah, jika seseorang akan pergi ke laman web anda dan 9 daripada 10 kali melakukan tindakan A, dan 1 daripada 10 kali melakukan tindakan B, anda mungkin mahu memberi tumpuan pengalaman mereka mengenai tindakan A. Dalam erti kata lain, anda mahu untuk menjadikannya bagaimana sangat, sangat jelas untuk melakukan A. A harus depan dan pusat - pergi ke laman web ini, melihat ia; oh, ia di sana. Manakala B jelas anda mahu menjadi jelas, tetapi anda boleh meninggalkan ia sedikit lebih di latar belakang. David memberikan contoh yang baik ini dalam kuliah, yang merupakan sistem Boston T. Apabila anda pergi ke Boston T dan anda mahu membeli tiket, anda perlu masuk ke dalam 5 menu sebelum anda sebenarnya boleh membeli tiket untuk nilai $ 2, $ 2.50, yang adalah berapa banyak yang diperlukan untuk naik kereta bawah tanah dalam satu arah. Itulah masalah kerana kebanyakan orang yang menunggang kereta bawah tanah mungkin hanya mahu pergi ke satu tempat, membeli tiket mereka, dapatkan di segera. Ia tidak masuk akal bahawa mereka perlu melalui banyak menu yang berbeza untuk sampai ke sana. Satu pengalaman pengguna yang lebih baik akan menjadi butang cepat di halaman pertama yang hanya berkata, 'membeli tiket sehala,' dan yang akan dimasukkan ke dalam semua standard nilai lalai; dan kemudian jika seseorang mahu membeli tiket yang berbeza daripada itu, mereka masih, sudah tentu, mempunyai pilihan untuk, tetapi anda dioptimumkan untuk kes biasa digunakan yang benar-benar penting. Anda boleh melihat contoh-contoh ini di Facebook, bukan? Jika anda pergi ke Facebook dan anda hendak hantar status, ia kanan di bahagian atas iaitu apa yang anda sering mahu lakukan. Sebaik sahaja anda memasuki halaman, anda boleh melakukan perkara yang paling biasa yang anda mahu lakukan. Jika anda ingin melakukan perkara-perkara lebih rumit seperti, mengatakan saya mahu pergi ke dinding kawan saya dan hantar gambar di atasnya - yang saya akan mahu lakukan sering, tetapi tidak sekerap menghantar kemas kini status - jadi dalam kes itu, saya menaip nama mereka di dalam kotak di bahagian atas, klik pada profil mereka, dan kemudian, masih, ia betul-betul di atas sana sekali saya telah mendapat ke profil mereka. Sekali lagi, saya telah dioptimumkan dalam keutamaan bagi kes-kes yang paling biasa digunakan. Satu lagi perkara yang penting adalah yang sering orang jenis akan cuba untuk mendapatkan sekitar ini dengan berkata, okay, jadi saya membuat laman web dan orang yang mencari ia mengelirukan, dan itulah masalah, bukan? Jelas sekali, saya tidak mahu orang ramai keliru dengan kandungan laman saya. Tetapi cara untuk menyelesaikan yang tidak mempunyai sesuatu yang muncul dengan berkata, hey, saya akan mengajar anda bagaimana untuk menggunakan laman web ini. Langkah 1 - klik butang ini. Langkah 2 - pergi sini. Pasti, itu adalah satu cara di sekelilingnya - ia adalah satu cara yang anda boleh memberitahu orang apa yang perlu dilakukan, tetapi ia benar-benar tidak cara yang optimum. Jika saya pergi ke laman web dan tiba-tiba saya dihujani dengan tutorial ini yang yang memberitahu saya apa yang perlu dilakukan dan di mana untuk pergi dan semua itu, yang tidak menyeronokkan bagi saya. Ia bukan satu pengalaman yang baik untuk saya. Ia adalah jenis sakit. Saya mahu hanya mula melakukan barangan. Orang ramai akan menutup kotak dialog mereka, atau keluar dari tutorial, tidak tahu apa yang perlu dilakukan, dan kemudian merungut kerana anda tidak memberitahu mereka apa yang perlu lakukan. Cara untuk menyelesaikan ini bukanlah dengan memberikan apa-apa jenis tutorial atau arahan - apa-apa seperti itu. Sebanyak yang anda boleh mengelakkan ia, anda benar-benar mahu menunjukkan pengguna apa yang perlu dilakukan hanya dengan sifat bagaimana laman web ini dibentangkan. Dalam erti kata lain, jika saya pergi ke Facebook tanpa pembalakan di, perkara pertama yang saya lihat di laman utama - ia adalah satu kotak login sedikit. Jadi, duh. Saya harus daftar masuk Ia di sana. Manakala, jika saya pergi ke Facebook dan saya terpaksa klik pautan sedikit di bahagian bawah yang berkata 'log masuk' dan seluruh halaman itu hanya beberapa jenis gambar atau sesuatu, Saya tidak akan benar-benar tahu apa yang perlu dilakukan, bukan? Saya keliru. Jadi, ia boleh beritahu saya untuk pergi ke sana dan klik butang untuk log masuk, atau log pada butang boleh betul-betul di bahagian atas di mana saya akan melihatnya. Anda mahu untuk sentiasa menunjukkan pengguna apa yang perlu dilakukan, dan yang perlu wujud dalam halaman itu sendiri. Apabila anda berfikir tentang reka bentuk dan mengejek sehingga cara yang berbeza menyatakan laman web anda, anda benar-benar mahu berfikir tentang apa yang pengguna akan lakukan dan bagaimana anda boleh menunjukkan kepada mereka apa yang perlu dilakukan. Satu perkara yang lepas adalah ujian adalah benar-benar, benar-benar penting. Ia adalah baik untuk seseorang - dapatkan rakan, dapatkan seseorang yang anda tidak tahu walaupun - siapa yang pernah melihat laman web ini sebelum menggunakan laman web ini. Oleh kerana anda telah bekerja di laman web ini untuk beberapa jam, anda telah merenung pada itu, dan anda tahu apa yang perlu dilakukan dengan jelas anda akan menguji perkara-perkara yang anda telah bekerja pada dan anda tahu kerja. Tetapi jika orang lain datang bersama-sama dan menggunakan laman web ini yang tidak pernah digunakan sebelum ini, itu adalah satu pengalaman yang unik kerana anda mempunyai seseorang yang tidak mempunyai pengetahuan terlebih dahulu laman web ini akan ke dalamnya, supaya mereka akan perlu berkesan tidak tahu apa yang perlu dilakukan atau apa jenis kes-kes penggunaan hadir untuk mereka. Itu yang besar. Yang unik kerana mereka pada dasarnya seseorang yang mempunyai kosong untuk minda. Mereka boleh memberitahu anda jika sesuatu yang mengelirukan atau tidak jelas. Mereka boleh memberi anda idea tepat apa pengalaman pengguna laman anda. Ia boleh menjadi sangat sukar untuk mengetahui bahawa diri sendiri, jadi pastinya saya akan menggalakkan anda seperti yang anda sedang membangunkan projek-projek anda - jika anda melakukan projek-projek berasaskan web - untuk mendapatkan orang ramai menggunakan laman web ini seawal anda mempunyai beberapa jenis demo berfungsi. Kini saya akan bercakap sedikit tentang bagaimana untuk menguruskan projek pembangunan web. Kami telah pergi ke atas bagaimana anda boleh melakukan sebelah belakang-akhir teknikal, bagaimana anda boleh mereka bentuk laman web yang benar-benar baik, dan yang hebat jika anda bekerja sendiri tetapi - walaupun anda bekerja sendiri dan terutamanya jika anda bekerja pada satu pasukan, pengurusan projek menjadi satu isu besar. Anda jenis mendengar tentang pengurusan projek dalam bentuk yang berbeza sejak sekolah rendah apabila anda diberitahu kerja kumpulan. Anda perlu bekerjasama, berkomunikasi, semua itu. Yang semua masih terpakai di sini, tetapi terdapat beberapa keadaan yang unik dengan sains komputer yang ingin anda menyedari, dan anda ingin memastikan anda mengendalikan juga. Saya akan bercakap pertama sedikit tentang pasukan yang anda akan masuk Ia amat penting untuk memilih saiz yang betul daripada pasukan yang akan bekerja pada, dan dalam projek akhir anda Saya fikir anda mempunyai pilihan untuk memilih antara 1 dan 4 orang sekiranya saya betul. Anda ingin memastikan bahawa anda tidak hanya memilih bilangan orang yang yang anda mahu bekerja dengan kerana mereka rakan-rakan. Anda mahu memilih pasukan itulah saiz yang baik dan yang akan mendapat pekerjaan yang dilakukan. Ada keseimbangan dalam mempunyai lebih ramai orang berbanding kurang orang. Jika anda mempunyai lebih ramai orang, kerja jelas lagi yang boleh dilakukan kerana anda mempunyai banyak orang, banyak kod, banyak idea-idea, dan itu semua hebat. Tetapi ia juga memerlukan lebih banyak pengurusan dan komunikasi banyak lagi. Dalam erti kata lain, jika anda mempunyai 4 orang yang bekerja dalam projek yang sama dan mereka semua mengedit kod yang sama, lebih atau kurang mereka semua jenis keperluan untuk mengetahui apa yang berlaku jadi ia memerlukan anda - jika anda menambah beberapa fungsi baru yang anda jenis perlu memberitahu orang -: saya menambah ini, Saya berubah ini dengan cara ini - terutamanya jika anda masuk ke dalam barangan yang benar-benar mendalam seperti model dan pengawal yang sebenarnya akan mempengaruhi bagaimana laman web berfungsi. Keseluruhan pasukan perlu sedar itu, jadi anda perlu pastikan anda tidak memilih terlalu besar pasukan yang akan menjadi keras untuk membuat komunikasi itu. Anda juga tidak mahu memilih satu pasukan kecil yang cukup bahawa anda tidak akan dapat berkomunikasi kerana ia hanya anda. Satu lagi perkara yang perlu dipertimbangkan ialah baki di mana kemahiran orang adalah. Ia baik jika anda semua pengaturcara benar-benar baik. Tetapi jika anda semua orang back-end, maka laman web anda tidak akan kelihatan sangat baik kerana anda mempunyai pangkalan data yang besar ini, dan ia pertanyaan carian super cepat - yang besar - tetapi apabila anda pergi ke ia, ia seperti sebuah laman 1990-an dengan merah dan biru di mana-mana, dan itu tidak baik sama ada. Perhatikan bahawa Ben dan saya bekerja sebagai satu pasukan yang sangat bagus kerana saya jenis lebih di hujung depan, kedua-dua kami berinteraksi di tengah-tengah akhir tahun, dan Ben benar-benar baik dengan barangan back-end, supaya kerja-kerja benar-benar baik kerana kita boleh mereka bentuk mana-mana laman dan pada dasarnya lubang-lubang di laman web yang yang perlu diisi boleh diisi sama ada seorang daripada kita, atau mungkin kedua-duanya. Anda ingin memastikan bahawa tidak ada lubang dalam pasukan anda. Tidak mengapa jika ada sedikit pertindihan. Dalam erti kata lain, jika anda mempunyai 2 orang yang kedua-dua baik dengan hujung belakang, yang boleh baik dan juga kerana mereka boleh membantu antara satu sama lain dengan masalah bahawa mereka mempunyai. Ia boleh menjadi masalah jika anda hanya mempunyai 1 orang yang bertanggungjawab untuk perkara tertentu dan mereka menghadapi masalah, jadi anda mahu mempunyai sedikit pertindihan tetapi anda yang paling penting ingin memastikan bahawa semua lubang-lubang mungkin dipenuhi. Perkara terakhir - dan ini adalah jelas, tetapi ia sering tidak. Anda benar-benar mahu berseronok. Titik projek akhir ini dalam CS50 dan sering titik pembangunan web secara umum bukan untuk hanya melakukan kerja kerana ia memerlukan lakukan. Anda benar-benar mahu berseronok, dan anda mahu membuat sesuatu itu motivasi anda untuk bekerja di atasnya. Jika apa sahaja yang anda membuat adalah sakit untuk duduk dan bekerja pada, maka anda tidak memilih projek yang betul. Anda mahu memilih sesuatu yang anda dapati menarik, anda benar-benar mahu melihat hasilnya, anda teruja apabila anda mendapat idea baru tentang sesuatu yang anda boleh lakukan - jadi tidak semua jenis projek di sana yang saya pasti anda boleh mencari - semua orang mempunyai sesuatu yang benar-benar akan tipu daya mereka jika mereka melakukan projek berasaskan web. Saya akan katakan sekali lagi sekarang. Jika projek anda seolah-olah seperti sakit dan anda tidak mahu bekerja di atasnya, memilih projek lain. Pilih sesuatu yang benar-benar memberi inspirasi kepada anda. Ben disebut konsep ini lelaran sedikit, dan saya mahu pergi lebih sedikit. Ia benar-benar penting untuk bekerja dalam spurts di mana anda mendapatkan sesuatu yang berfungsi. Ia boleh menjadi besar jika anda mempunyai pelan ini untuk sebuah laman web yang akan melakukan A, B, dan C, dan akhirnya ia akan sampai ke sana. Tetapi anda terjebak dalam fasa ini di mana anda bekerja di atasnya dan bekerja di atasnya, tetapi apa-apa yang mendapat dilakukan. Anda tidak mempunyai apa-apa untuk melihat dan, perkara berfungsi ketara. Apa yang anda benar-benar mahu melakukan sebanyak kerana ia seolah-olah jenis sakit kadang-kadang untuk bekerja pada sesuatu dan kemudian jenis topi itu di luar supaya ia sekurang-kurangnya pada yang stabil, berlari versi walaupun ia tidak mempunyai semua ciri-ciri yang anda mahu. Dan mungkin ada beberapa ciri-ciri yang anda benar-benar mahu menambah tetapi anda tidak boleh kerana anda ingin mendapatkan laman ini dengan mata berfungsi. Dan sehingga anda ingin mempunyai jenis proses pembangunan keseluruhan kelihatan seperti itu. Anda ingin memulakan suatu tempat fungsi - atau pada dasarnya bermula dengan apa-apa - tetapi anda ingin mendapatkan tempat yang sangat asas dan berfungsi. Dan sekali lagi, membuat semacam melompat dan mendapat tempat berfungsi lagi. Anda perlahan-lahan akan membina, dan ia mungkin pergi agak perlahan daripada ia akan sebaliknya, tetapi dalam jangka masa panjang jika anda sentiasa terperangkap dalam fasa jalan tengah ini di mana anda sebenarnya tidak mempunyai apa-apa kerja, ia boleh menjadi satu kekecewaan benar-benar besar untuk bekerja dalam projek anda kerana anda sentiasa begitu dekat untuk mendapatkan ia bekerja, dan ia tidak pernah benar-benar bekerja. Anda mahu bekerja dalam spurts berfungsi, dan anda juga mahu melakukan refleksi selepas setiap satu. Dalam erti kata lain, sebaik sahaja anda berada di titik di mana laman web ini kini bekerja - ia tidak mempunyai segala-galanya yang anda suka tetapi ia beberapa perkara - anda mahu berfikir, okay, adalah laman web ini mencapai matlamat yang saya ingin lakukan? Dalam erti kata lain, jika laman web ini akan melakukan X, adalah apa yang saya telah bekerja dalam arah X? Adakah semua fungsi yang saya mahu di sana? Dan lebih-lebih lagi, ia berkhidmat tujuan keseluruhan yang saya mahu? Jika anda sedang mencari laman web anda sudah mula berubah arah dalam arah yang berbeza atau mungkin perkara yang hanya jenis tidak bekerja di luar, ia mungkin masa untuk anjakan gear sedikit. Dalam erti kata lain, ia adalah bernilai mengingati - ia bernilai membuang idea-idea jika perlu dan mempertimbangkan saya benar-benar berusaha ke arah apa yang saya mahu. Saya percaya itulah perkara seterusnya. Jangan takut untuk meninggalkan idea. Hanya kerana anda menghabiskan banyak masa bekerja pada ciri yang dan akhirnya mendapat ia bekerja tetapi ia benar-benar tidak akan begitu baik - seperti ia bukan yang berguna atau pengguna menghadapi masalah menggunakannya - perkara seperti - jangan takut untuk membuang ia jauh. Ia menghisap bahawa anda telah menghabiskan banyak masa bekerja di atasnya, tetapi akhirnya anda tidak mahu laman yang yang jenis meletakkan bersama-sama dengan buah ini yang jenis kerja tetapi tidak yang baik disampaikan. Juga, jangan takut untuk memeluk idea-idea baru. Jika seseorang datang dan berkata, hey, laman web yang kelihatan benar-benar sejuk tetapi bukankah juga menjadi besar jika ia juga melakukan ini? Hanya kerana itu sesuatu yang anda tidak berniat dan sesuatu yang tidak dalam anda ciri-ciri komputer, sesuatu yang anda tidak ingin lakukan, jangan takut untuk membawanya ke atas dan kemudian bekerja dengannya. Kerana sering idea-idea yang anda menjalankan dengan seluruh kursus pembangunan akhirnya menjadi ciri-ciri benar-benar sejuk laman web. Saya berkata sebelum ini. Saya akan katakan sekali lagi. Penguji adalah super, super berguna. Cuba untuk mendapatkan orang-orang yang tidak pernah melihat laman web ini sebelum untuk log masuk dan melihat apa yang berlaku kerana mereka bukan sahaja boleh menguji kebergunaan tapak dan pengalaman pengguna, tetapi mereka juga boleh menguji fungsi dengan cara yang anda tidak boleh. Jika anda membuat beberapa ciri yang melakukan perkara tertentu dan anda tahu ia akan melakukan perkara yang sama dengan betul setiap kali tunggal, itu hebat. Tetapi ia selalunya boleh sukar untuk akaun bagi kes-kes di mana sudut kekuatan pengguna menaip sesuatu yang anda tidak menjangkakan - tepat kerana anda ditakrifkan ciri-ciri sendiri. Jadi, untuk mempunyai seseorang datang pada yang tidak mempunyai idea bagaimana untuk menggunakan laman web ini dan hanya memecahkan dalam apa jua cara yang mereka boleh lakukan adalah benar-benar berguna kerana anda mendapatkan idea dari perspektif yang sama sekali berbeza daripada apa yang di laman anda bekerja dan apa yang perlu pembaikan. Lepas, saya akan bercakap tentang beberapa amalan yang baik umum, dan anda telah melihat banyak ini di CS50, tetapi mereka juga benar-benar, benar-benar memohon dalam suasana projek. Satu adalah komen. Sentiasa comment kod anda terutamanya jika anda bekerja dalam pasukan yang besar. Ia boleh jadi menjengkelkan dengan hanya mempunyai satu blok gergasi kod yang ditulis seseorang dan mungkin ia berfungsi, mungkin tidak, tetapi anda tidak tahu apa yang ia, jadi anda tidak tahu sama ada ia berguna atau tidak atau sama ada ia perlu berada di sana atau tidak, dan jika anda bekerja pada sesuatu yang lain ia lebih mungkin bahawa anda bekerja pada perkara yang sama, jadi hanya menjadi sangat, sangat berhati-hati untuk bertimbang rasa rakan-rakan anda dan kod tulis yang yang didokumentasikan dengan baik. Anda tidak perlu pergi setakat untuk melakukan perkara yang keseluruhannya di mana suka jika anda kenaikan kaunter mempunyai komen yang mengatakan, saya menambah 1 ke kaunter ini. Ia tidak perlu menjadi yang terperinci, tetapi untuk apa-apa fungsi yang anda pernah menulis anda perlu mempunyai beberapa dokumentasi apa fungsi yang sebenarnya tidak, apa input adalah, dan apa yang perlu kembali. Dengan cara itu anda boleh menggunakan lain-lain komponen rakyat tapak dan anda boleh berusaha ke arah membina sesuatu yang besar. Satu lagi perkara yang penting ialah anda mahu lakukan tetap bersih-up. Kod mendapat kemas. Jangan merasa buruk jika kod anda hanya boleh dibaca sama sekali dan keadaan huru-hara raksasa. Yang berlaku dalam pembangunan web sentiasa. Anda menambah ciri-ciri baru, menghapuskan yang lama. Barangan akan berada di sana yang tidak sepatutnya. Itu halus, tetapi anda ingin memastikan untuk menangani yang kerap. Anda tidak mahu untuk membiarkan ia membina sehingga tahap di mana anda tidak boleh mencari apa-apa dalam kod anda, dan anda tidak tahu apa yang apa-apa tidak. Itu berlaku dengan HTML. Kadang-kadang anda akan berakhir dengan objek yang tidak mengandungi apa-apa, dan anda akan mahu untuk menghapuskan mereka. Dalam CSS, anda boleh merujuk kepada unsur-unsur yang tidak ada lagi, jadi anda mahu untuk menghilangkan kod itu. Dalam JavaScript, anda mungkin telah mengeluarkan sesuatu dari HTML. Jadi, anda ingin memastikan bahawa anda sentiasa membersihkan, membuat perkara yang cantik sebagai banyak yang anda boleh secara tetap. Satu lagi perkara yang benar-benar berguna yang saya tidak fikir yang digariskan amat CS50 tetapi ia bernilai mendapat ke dalam adalah kawalan versi. Idea kawalan versi adalah apabila anda pada dasarnya mengesan segala kemajuan yang anda telah membuat ke arah laman web anda dan jika pada bila-bila anda sedar, oh, ini bekerja sebentar tadi tetapi ia tidak berfungsi lagi, anda boleh kembali ke versi sebelumnya dan melihat apa yang telah berubah sejak itu dan perkara seperti. Cara utama untuk melakukannya adalah dengan Git, dan Git adalah jenis ini seluruh sistem yang Saya percaya Tommy MacWilliam memberikan seminar kira-kira setahun lalu. Jika anda pergi ke seminar CS50 untuk tahun 2011, anda boleh melihat seminarnya pada itu. Idea Git pada dasarnya bahawa pada jangka masa yang tetap anda membuat komitmen ini yang cara untuk mengatakan laman web ini dalam versi yang agak stabil sekarang supaya Saya pembungkusan itu dan menghantarnya ke pelayan jauh, dan kemudian anda boleh pergi ke pelayan yang dan melihat semua versi terdahulu kod anda dan melihat bagaimana ia berkembang dan semua yang jenis barangan yang baik. Jadi, itu pada dasarnya ia. Setakat pembangunan web, kami gembira untuk melekat di sekeliling dan menjawab apa-apa soalan sejauh persembahan kami. Itu sahaja. Terima kasih. >> [Ben] Terima kasih. [Tepukan] [Billy] Kakitangan, adakah sesiapa yang mempunyai sebarang soalan mengenai perkara-perkara yang kami telah dilindungi atau perkara-perkara yang kita tidak dilindungi yang mereka berharap kita akan meliputi? Kami akan gembira untuk menjawab soalan-. Sesiapa sahaja? [Ahli penonton] Apakah kebaikan dan keburukan menggunakan Ruby atau menggunakan Python? [Ben] Persoalannya ialah, apakah kebaikan dan keburukan menggunakan Ruby atau Python bukannya seperti PHP. Kebaikan adalah yang Ruby dan Python adalah bahasa jauh lebih baik daripada PHP. Sekurang-kurangnya pada pendapat saya, dan saya rasa dalam banyak pendapat orang lain juga. Mereka direka lebih untuk melakukan hal yang kompleks, dan kurang bagi whacking bersama-sama laman web benar-benar cepat dengan sedikit kandungan dinamik. Yang kontra adalah bahawa ada sedikit - ada lebih daripada keluk pembelajaran untuk mendapatkan mereka ditubuhkan. Iaitu, seperti di PHP, anda hanya boleh mempunyai fail HTML dan anda menulis kurang-daripada, tanda tanya, dan kemudian anda menulis beberapa kod, dan kemudian anda menulis tanda tanya, lebih-daripada, dan kemudian anda selesai. Bahasa lain seperti Ruby atau Python, anda perlu melalui kerja sedikit lebih untuk dapatkan laman web ini berjalan awal. Terdapat juga - sekurang-kurangnya ia digunakan untuk menjadi kes itu - bahawa ada dokumentasi yang lebih disediakan untuk PHP hanya kerana ada ramai orang yang menggunakannya. Saya rasa itu bukan sebagai banyak isu lagi. Ada pasti dokumentasi yang sangat baik untuk barangan seperti Ruby on Rails atau Django Python adalah bersamaan. PHP adalah salah satu yang semua orang telah menggunakan selama bertahun-tahun, dan anda tahu bagaimana ia berfungsi. Ruby dan Python adalah sedikit kurang matang. [Ahli penonton] Sekiranya anda memilih antara salah seorang daripada mereka untuk belajar atau mengambil, yang anda lebih suka? Secara jujur, saya rasa yang bergantung pada orang itu. Saya minta maaf. Soalan itu yang anda akan memilih seseorang untuk belajar? Saya dapati Python yang paling baik secara peribadi. Terdapat ramai orang yang - yang saya lakukan projek dev web saya pertama di Python dan Django. Terdapat ramai orang yang suka Ruby on Rails juga. Mungkin ramai orang yang tahu Ruby on Rails. Secara jujur, saya hanya akan pergi dengan apa sahaja yang orang di sekeliling anda tahu supaya anda mempunyai orang untuk bertanya soalan. Persoalannya ialah - pada pelayan dikongsi adalah ia jenis sukar untuk bekerja pada Python? Itu bergantung kepada hosting anda. Terdapat beberapa semesta alam web yang akan menyiarkan barangan Python. WebFaction tidak itu, kan? WebFaction adalah salah satu yang Billy dan saya telah digunakan untuk beberapa projek. Mereka benar-benar hebat. Mereka menyokong kebanyakan bahasa. Tetapi ia benar bahawa PHP adalah lebih meluas disokong. Jadi, jika anda terjebak pada tuan rumah web yang sahaja PHP, itu adalah satu alasan yang baik untuk menggunakan PHP. [Ahli penonton] Saya hanya mendapat ke dalam belajar bagaimana untuk query beberapa pangkalan data, dan saya tahu SQL saya adalah di seluruh tempat, tetapi saya baru-baru ini mendapat terdedah kepada - dan anda menunjuk keluar. Anda lihat JSON dan pangkalan data diperkembangkan. SQL saya masih di seluruh tempat. Bagaimana anda melihat berlaku itu? Adakah terdapat akan menjadi kecenderungan yang semakin meningkat untuk lebih diperkembangkan (didengar)? Persoalannya ialah - saya fikir ada akan menjadi satu trend ke arah pangkalan data bukan SQL. Sebagai contoh, seperti MongoDB. Saya rasa itu adalah pasti benar. Nasihat saya kebanyakannya mySQL berkaitan di sini hanya kerana mySQL adalah piawaian industri. Secara peribadi, saya lebih memilih pangkalan data yang tidak mempunyai schemos seperti MongoDB di mana anda tidak mempunyai isu, oh, saya perlu menambah ruangan lain. Celakalah adalah saya, seperti apa yang saya lakukan? Ia amat sukar untuk berbuat demikian pada mySQL, tetapi apabila anda mempunyai sesuatu seperti Mongo ia lebih bagus. Perkara yang bagus lain tentang Mongo ialah rekod anda sebenarnya objek JavaScript. Tidak ada jenis langkah penukaran yang anda perlu mengambil ini baris pangkalan data dan menjadikan mereka objek JavaScript dan kemudian menghantar mereka dawai. Saya rasa barangan seperti itu akan menjadi sangat, sangat berguna untuk pembangunan web pesat pada masa hadapan. [Billy] Sesuatu yang saya akan menambah yang hanya satu titik umum adalah bahawa tidak merasa seperti anda seharusnya belajar semua bahasa yang kita telah dibincangkan daripada seminar kami. Jelas sekali persoalannya adalah untuk memberi anda idea tentang apa yang di luar sana, dan jika anda berminat dengan mana-mana perkara yang kita telah disebut anda boleh Google mereka dan membaca sehingga ke atas mereka. Dan seperti yang saya katakan, terdapat beberapa seminar yang berurusan dengan tepat perkara-perkara ini. Terdapat juga lebih banyak seminar yang saya telah tidak disebut yang mungkin masuk ke dalam barangan ini juga. Idea ini adalah bahawa jika anda mahu bekerja pada sesuatu, di sini adalah alat di pelupusan anda. Jangan berasa terharu jika anda tidak benar-benar pasti apa yang alat ini betul-betul, tetapi tahu bahawa mereka di luar sana dan anda boleh menggunakan pelbagai mereka oleh Google. [Ahli penonton] Apakah jenis perkara yang anda perlu lakukan untuk memastikan laman web anda kelihatan baik pada peranti mudah alih? [Billy] Peranti mudah alih adalah sedikit keras. Ada 2 cara anda boleh pendekatan itu. Cara pertama adalah bahawa anda sebenarnya mempunyai laman web mudah alih. Dalam erti kata lain, anda melakukan beberapa jenis pengesanan pada awal apabila pelayar membuat permintaan itu ke laman web anda yang sama ada kata kembali pandangan ini - yang akan menjadi pandangan untuk desktop atau komputer riba pelayar - dan pandangan ini lain untuk peranti mudah alih. Itulah tempat di mana pandangan yang benar-benar baik dalam yang anda boleh cukup banyak swap dua dan mempunyai antara muka yang benar-benar kerja-kerja baik pada peranti mudah alih dan ada yang sama sekali berbeza yang bekerja dengan baik pada peranti penyemak imbas. Masalah dengan yang ia mengambil masa yang panjang kerana ia bermakna pengekodan antara muka yang sama sekali berbeza. Cara lain yang boleh anda lakukan adalah - banyak telefon moden akan memaparkan laman web dan cuba untuk menjadikan mereka sebagai pelayar akan, dan mereka melakukan yang terbaik. Anda boleh jenis cuba untuk kekal cahaya kepada jumlah jQuery JavaScript anda menggunakan yang cenderung untuk menjadi di mana kesilapan boleh berlaku sedikit. Ini adalah jenis cara yang perlu anda gunakan jika anda tidak mempunyai banyak masa. Jika anda mempunyai masa untuk bekerja pada antara muka mudah alih, itu jelas pilihan terbaik anda. Saya rasa secara amnya bagi projek CS50, anda akan mahu untuk memilih satu atau yang lain. Dalam erti kata lain, anda mahu untuk membuat aplikasi mudah alih atau anda mahu untuk membuat laman web desktop. Dan yang jenis menentukan di mana anda pergi dengan itu. Tetapi jika anda mahu mengembangkan ia keluar kemudian, mungkin taruhan terbaik adalah untuk membuat satu lagi antara muka untuk yang lain. Saya mempunyai sedikit pengalaman dalam membangunkan laman web berasaskan WordPress. Saya menjadi tuan rumah laman web peribadi di WordPress seketika. Orang-orang jenis rangka kerja boleh baik perkara hanya sebagai sangat asas. Sering kali anda hanya akan menghadapi banyak isu-isu customizability walaupun. Anda akan mahu mempunyai sesuatu yang melihat cara yang tertentu atau cara tertentu dan anda tidak boleh kerana ia berwayar ke dalam sistem yang ini adalah bagaimana anda perlu melakukan perkara-perkara yang boleh menjadi sedikit masalah. Sejak peristiwa itu saya jenis menjadi lebih cenderung untuk bekerja dengan laman web dari bawah ke atas. Untuk perkara-perkara seperti pangkalan data blog dan perkara seperti itu benar-benar tidak sukar untuk membina satu rangka kerja. Jika anda benar-benar diregangkan untuk masa, anda sudah tentu boleh menggunakan sesuatu seperti WordPress atau perkara-perkara untuk blog. Jenis perkara yang kedai blog dan melakukan tidak benar-benar cukup keras yang jika anda menjalankan ke dalam mana-mana jenis perkara, anda mungkin terbaik hanya untuk membuat versi di-rumah. Saya rasa itu kira-kira, jadi terima kasih sekali lagi untuk yang akan datang. Kami benar-benar seronok bercakap dengan anda semua dan berharap anda belajar beberapa barangan. [Ben] Kami gembira untuk bercakap - kita perlu pergi tetapi kami gembira untuk bercakap lebih luar jika anda mempunyai soalan lain. Terima kasih sekali lagi. [Tepukan] [CS50.TV]