1 00:00:00,000 --> 00:00:02,500 [Powered by Google Translate] [Hội thảo] [Phát triển Web: Từ ý tưởng đến thực hiện] 2 00:00:02,500 --> 00:00:04,200 [Ben Kuhn] [Billy Janitsch] [Đại học Harvard] 3 00:00:04,200 --> 00:00:07,250 [Đây là CS50] [CS50.TV] 4 00:00:07,250 --> 00:00:10,840 [Billy] Xin chào, tôi Billy và đây là Ben. >> [Ben] Hi. 5 00:00:10,840 --> 00:00:12,840 Chúng ta sẽ nói về phát triển web ngày hôm nay. 6 00:00:12,840 --> 00:00:14,840 [Webdev] [Billy Janitsch và Bến Kuhn] 7 00:00:14,840 --> 00:00:16,840 Một chút về chúng tôi đầu tiên. 8 00:00:16,840 --> 00:00:19,590 Ben là loại người đàn ông phía sau. Ông làm cho mọi thứ làm việc. 9 00:00:19,590 --> 00:00:21,870 Và sau đó tôi đi vào và làm cho họ đẹp. 10 00:00:21,870 --> 00:00:26,610 Tôi chủ yếu tham gia với hơn front-end thiết kế bố trí loại công cụ, 11 00:00:26,610 --> 00:00:31,260 và Ben, mặt khác, biết mình đang làm gì để ông làm việc trên các công cụ back-end. 12 00:00:31,260 --> 00:00:34,050 Cùng nhau chúng ta đã thực hiện một vài điều. 13 00:00:34,050 --> 00:00:38,710 Ví dụ, năm ngoái chúng tôi đã làm việc trên Gimblium đó là một studio phát triển trò chơi trực tuyến. 14 00:00:38,710 --> 00:00:40,400 Đó là dự án cuối cùng của chúng tôi cho các lớp học, 15 00:00:40,400 --> 00:00:42,780 và kể từ đó chúng tôi đã thực hiện Harvard Lớp 16 00:00:42,780 --> 00:00:47,860 mà là một khuôn khổ trực tuyến cho các trình duyệt và các khóa học mua sắm tại Đại học Harvard. 17 00:00:47,860 --> 00:00:53,180 >> Chúng ta sẽ bắt đầu với ý tưởng này cho trang web của chúng tôi. 18 00:00:53,180 --> 00:00:57,480 Chúng ta sẽ làm cho Facebook, nhưng đối với mèo. 19 00:00:57,480 --> 00:00:59,520 Trước khi bạn thực sự làm cho trang web này, 20 00:00:59,520 --> 00:01:02,520 không làm cho trang web này bởi vì nó không tốt, nhưng chúng tôi sẽ sử dụng nó như là một khuôn khổ 21 00:01:02,520 --> 00:01:05,349 và đi qua quá trình làm thế nào chúng tôi có ý tưởng này 22 00:01:05,349 --> 00:01:07,450 và biến nó thành một trang web thực sự chúng tôi có thể sử dụng. 23 00:01:07,450 --> 00:01:11,940 Chúng tôi sẽ bắt đầu bằng cách phá vỡ các trang web xuống. 24 00:01:11,940 --> 00:01:13,190 Cũng giống như bạn đã làm trong CS50, 25 00:01:13,190 --> 00:01:17,360 bạn muốn suy nghĩ về các thành phần thực tế mà đi vào trang web này là gì. 26 00:01:17,360 --> 00:01:21,290 Về cơ bản biến nó từ một ý tưởng mà chỉ là sắp xếp của một khái niệm trừu tượng 27 00:01:21,290 --> 00:01:23,590 vào một thực tế, điều hữu hình mà bạn có thể làm. 28 00:01:23,590 --> 00:01:25,910 Chúng tôi bắt đầu bằng cách hỏi một số câu hỏi. 29 00:01:25,910 --> 00:01:28,070 Trang web này là gì? Tại sao chúng ta làm cho nó? 30 00:01:28,070 --> 00:01:30,670 Nó là những gì sẽ được sử dụng cho? Đại loại như vậy. 31 00:01:30,670 --> 00:01:33,660 Trong trường hợp của Facebook Cát, 32 00:01:33,660 --> 00:01:37,730 chúng ta về cơ bản muốn có một trang web cho phép mèo mạng xã hội với nhau. 33 00:01:37,730 --> 00:01:41,260 Ý tưởng được rằng họ có thể đăng bài trên các bức tường của nhau, 34 00:01:41,260 --> 00:01:43,510 họ có thể đưa ra nhận xét, đại loại như vậy. 35 00:01:43,510 --> 00:01:46,720 Và đó là nơi chúng tôi đi vào các thành phần chức năng. 36 00:01:46,720 --> 00:01:51,270 Bây giờ chúng tôi có loại này khuôn khổ - chúng tôi có hồ sơ người dùng, 37 00:01:51,270 --> 00:01:53,990 chúng tôi có ý kiến, và chúng tôi có thể đăng bài. 38 00:01:53,990 --> 00:01:57,390 Có lẽ một ngày nào đó chúng tôi sẽ chảy đến thích và loại điều đó. 39 00:01:57,390 --> 00:02:00,410 Và chúng tôi loại muốn ưu tiên các tính năng này sẽ in 40 00:02:00,410 --> 00:02:03,340 Chúng tôi muốn nói như thế, không sao, nó thực sự quan trọng là mọi người đều có một hồ sơ cá nhân 41 00:02:03,340 --> 00:02:06,440 và tất cả mọi người có thể gửi trên các bức tường của nhau. 42 00:02:06,440 --> 00:02:08,509 Thứ đó, ý kiến ​​sẽ được tốt đẹp. 43 00:02:08,509 --> 00:02:10,180 Có lẽ sau này chúng ta sẽ chảy đến thích. 44 00:02:10,180 --> 00:02:13,700 Vì vậy, bạn muốn có một ý tưởng về những gì cơ bản để dự án của bạn 45 00:02:13,700 --> 00:02:17,260 và sắp xếp của một tính năng tổng quát hơn có thể được áp dụng sau đó là những gì. 46 00:02:17,260 --> 00:02:20,870 Bạn muốn loại có một danh sách cụ thể, 47 00:02:20,870 --> 00:02:24,090 nhưng các dự án mà bạn bắt đầu với không có được những dự án mà bạn kết thúc với. 48 00:02:24,090 --> 00:02:27,100 Nói cách khác, mọi thứ sẽ thay đổi trong khi bạn đang phát triển trang web, 49 00:02:27,100 --> 00:02:30,090 và bạn muốn rời khỏi phòng cho điều đó. 50 00:02:30,090 --> 00:02:34,470 Tôi sẽ biến nó cho Ben ai sẽ nói một chút về cấu trúc. 51 00:02:34,470 --> 00:02:39,610 >> [Ben] Tôi sẽ nói về mặt kỹ thuật hơn của phát triển web. 52 00:02:39,610 --> 00:02:42,370 Chúng ta hãy đi qua một số vấn đề cơ bản đầu tiên. 53 00:02:42,370 --> 00:02:45,730 Khi bạn đang làm một ứng dụng web, 54 00:02:45,730 --> 00:02:50,470 bộ phận chính mà bạn sẽ cần phải có là 55 00:02:50,470 --> 00:02:52,700 bạn sẽ có một số thứ đang diễn ra ở phía khách hàng - 56 00:02:52,700 --> 00:02:56,700 đó là, mã mà bạn đang trình duyệt có từ các trang web 57 00:02:56,700 --> 00:03:01,910 và JavaScript, HTML, CSS công cụ. 58 00:03:01,910 --> 00:03:04,490 Đó là tất cả về phía khách hàng. 59 00:03:04,490 --> 00:03:08,680 Bạn sẽ có mã khác chạy về phía máy chủ 60 00:03:08,680 --> 00:03:10,770 mà theo dõi tất cả các dữ liệu mà mọi người gửi cho bạn, 61 00:03:10,770 --> 00:03:15,060 quyết định ai để cung cấp cho những gì, những thứ như thế. 62 00:03:15,060 --> 00:03:20,380 Đây chỉ là một số thuật ngữ để các bạn đều quen thuộc với những gì chúng ta đang nói về. 63 00:03:20,380 --> 00:03:28,600 Ngoài bộ phận đó rất tốt để nghĩ về ứng dụng web của bạn về 64 00:03:28,600 --> 00:03:32,500 một vài thành phần riêng biệt. 65 00:03:32,500 --> 00:03:35,270 Khi bạn đang làm phát triển web 66 00:03:35,270 --> 00:03:41,710 một trong những điều mà bạn luôn luôn cần phải cố gắng làm là để giảm độ phức tạp. 67 00:03:41,710 --> 00:03:45,710 Phức tạp hơn mã của bạn là cơ hội nhiều hơn có làm lỗi, 68 00:03:45,710 --> 00:03:47,710 thì càng khó thay đổi sau đó. 69 00:03:47,710 --> 00:03:50,140 Vì vậy, nếu bạn có thể phá vỡ ứng dụng của bạn vào một số khu chức năng riêng biệt 70 00:03:50,140 --> 00:03:57,640 rằng sẽ - và bạn có thể giảm các loại số lượng giao tiếp giữa các khu vực - 71 00:03:57,640 --> 00:04:03,530 sẽ giúp bạn rất nhiều trong thời gian dài trong việc giảm lỗi. 72 00:04:03,530 --> 00:04:07,950 >> Được cụ thể, thường là người phân chia một ứng dụng web vào - 73 00:04:07,950 --> 00:04:13,190 đây là những loại từ buzz bây giờ, nhưng họ vẫn còn hữu ích. 74 00:04:13,190 --> 00:04:17,940 Bạn có thể đã nghe người ta nói về các mô hình, quan điểm, và bộ điều khiển. 75 00:04:17,940 --> 00:04:23,210 Mô hình là những dữ liệu thực tế mà ứng dụng của bạn sẽ đối phó với. 76 00:04:23,210 --> 00:04:28,260 Ví dụ, trong Cát của bạn Facebook, các mô hình của bạn sẽ được - 77 00:04:28,260 --> 00:04:35,340 bạn muốn có một mô hình cho các bài viết như thế, và một mô hình cho hồ sơ người dùng, công cụ như thế. 78 00:04:35,340 --> 00:04:41,090 Quan điểm của bạn là cách bạn thể hiện dữ liệu cho người sử dụng của bạn. 79 00:04:41,090 --> 00:04:46,660 Bạn có thể có 1 điểm để nhìn vào một bài duy nhất và tất cả các ý kiến 80 00:04:46,660 --> 00:04:51,720 và một cái nhìn khác nhau cho bức tường của bạn có một danh sách của tất cả các bài viết 81 00:04:51,720 --> 00:04:57,170 được chuyển đến bạn, và một cái nhìn khác nhau cho nguồn tin của bạn - công cụ như thế. 82 00:04:57,170 --> 00:05:00,610 Cuối cùng, bạn có bộ điều khiển đó là cơ bản khi người ta gửi cho bạn bài viết 83 00:05:00,610 --> 00:05:03,310 và bạn thực hiện cập nhật cho hệ thống back-end của bạn, 84 00:05:03,310 --> 00:05:06,400 bạn tăng một loạt các quầy, và bất cứ điều gì. 85 00:05:06,400 --> 00:05:07,860 Đó là những điều khiển của bạn. 86 00:05:07,860 --> 00:05:11,030 >> Tôi sẽ nói chuyện chủ yếu là về các mô hình. 87 00:05:11,030 --> 00:05:14,030 Xem mặt kỹ thuật không phải là khó khăn và vấn đề là nhiều hơn với thiết kế chúng 88 00:05:14,030 --> 00:05:22,040 Bộ điều khiển sẽ được cụ thể cho bất cứ điều gì bạn đang thiết kế. 89 00:05:22,040 --> 00:05:25,220 Nhưng có một số kỹ thuật khá Nói chung, bạn có thể sử dụng 90 00:05:25,220 --> 00:05:30,220 để làm cho mô hình của bạn đẹp hơn và dễ dàng hơn để làm việc với mà tôi nghĩ là rất hữu ích. 91 00:05:30,220 --> 00:05:35,860 Này chủ yếu có được về làm thế nào để đối phó với các dữ liệu các ứng dụng web của bạn một cách tốt đẹp. 92 00:05:35,860 --> 00:05:40,420 Các vấn đề chính với các mô hình 93 00:05:40,420 --> 00:05:44,540 được rằng họ sống trên máy khách và máy chủ và bạn phải tìm ra 94 00:05:44,540 --> 00:05:51,170 a) làm thế nào để có được chúng - tất cả những người có liên quan - từ máy chủ cho khách hàng, 95 00:05:51,170 --> 00:05:53,440 và b) làm thế nào để giữ cho chúng đồng bộ. 96 00:05:53,440 --> 00:05:58,700 Người dùng của bạn sẽ muốn làm cho một số nâng cấp. 97 00:05:58,700 --> 00:06:00,470 Họ sẽ muốn làm cho bài viết mới. 98 00:06:00,470 --> 00:06:04,800 Họ sẽ muốn như điều và các công cụ nếu bạn có thích. 99 00:06:04,800 --> 00:06:11,490 Đó là những thách thức kỹ thuật chính đối phó với các mô hình. 100 00:06:11,490 --> 00:06:15,680 Điều đầu tiên mà bạn sẽ muốn tự hỏi mình là 101 00:06:15,680 --> 00:06:18,420 loại dữ liệu đi trong mô hình này và những gì loại truy vấn chúng ta sẽ muốn làm - 102 00:06:18,420 --> 00:06:24,290 có nghĩa là, làm thế nào chúng ta sẽ xem xét các mô hình? 103 00:06:24,290 --> 00:06:26,940 Cho Cát Facebook ví dụ của bạn, 104 00:06:26,940 --> 00:06:31,520 bài viết của bạn là sẽ có một tác giả liên kết với nó, 105 00:06:31,520 --> 00:06:35,660 một số bài tường văn bản, và một người nhận bài tường. 106 00:06:35,660 --> 00:06:38,470 Và sau đó bạn có thể muốn truy vấn trong một loạt các cách khác nhau. 107 00:06:38,470 --> 00:06:42,220 Bạn sẽ muốn nhìn vào nó bởi người viết bài đó, 108 00:06:42,220 --> 00:06:46,620 bởi người nhận mà gửi, có lẽ do ngày họ đã được đăng. 109 00:06:46,620 --> 00:06:50,340 Nhưng nếu bạn đang đi để làm điều đó theo ngày, sau đó bạn phải thêm các lĩnh vực khác để bài viết của bạn 110 00:06:50,340 --> 00:06:52,490 khi nó được thực sự được đăng. 111 00:06:52,490 --> 00:07:00,220 Các 2 yếu tố - những dữ liệu bạn muốn sử dụng và làm thế nào bạn muốn để xem nó - 112 00:07:00,220 --> 00:07:04,200 bạn nên suy nghĩ về họ đầu tiên bởi vì họ phụ thuộc lẫn nhau, 113 00:07:04,200 --> 00:07:08,030 và nó sẽ khó khăn hơn để thêm chúng sau này. 114 00:07:08,030 --> 00:07:12,750 >> Có một số cân nhắc khác. 115 00:07:12,750 --> 00:07:17,540 Khi bạn đang suy nghĩ về cách bạn đối phó với các mô hình trên máy chủ 116 00:07:17,540 --> 00:07:20,540 những gì bạn muốn xem xét là - 117 00:07:20,540 --> 00:07:27,440 về cơ bản bạn muốn làm cho máy chủ như đơn giản càng tốt. 118 00:07:29,440 --> 00:07:35,500 Làm công cụ trên các mặt hàng nói chung là nhanh hơn nhiều nếu bạn có thể làm điều đó hoàn toàn trên máy khách 119 00:07:35,500 --> 00:07:38,230 mà không làm bất kỳ loại yêu cầu mạng. 120 00:07:38,230 --> 00:07:47,860 Ý tưởng là để làm càng nhiều của các truy vấn như bạn có thể trên máy khách. 121 00:07:47,860 --> 00:07:51,560 Vấn đề duy nhất với điều đó 122 00:07:51,560 --> 00:07:54,160 là nếu bạn yêu cầu tất cả các dữ liệu của bạn ngay từ đầu 123 00:07:54,160 --> 00:07:57,160 sau đó sẽ mất một thời gian để tải. 124 00:07:57,160 --> 00:08:02,290 Vì vậy, ý tưởng là để tấn công một trung hạnh phúc giữa có đủ dữ liệu trên máy khách 125 00:08:02,290 --> 00:08:07,640 mà bạn có thể làm hầu hết công việc của bạn có nhưng không chỉ lấy tất cả mọi thứ cùng một lúc 126 00:08:07,640 --> 00:08:09,710 để bạn có được thời gian tải rất chậm lúc đầu. 127 00:08:09,710 --> 00:08:12,610 Ví dụ, đối với dữ liệu con mèo của bạn 128 00:08:12,610 --> 00:08:20,340 có thể bạn sẽ muốn lấy một loạt các bài viết tường gần đây. 129 00:08:20,340 --> 00:08:23,790 Bạn sẽ không muốn lấy tất cả trong số họ bởi vì đó có thể trở lại một vài năm. 130 00:08:23,790 --> 00:08:25,470 Nhưng bạn không muốn lấy chúng cùng một lúc 131 00:08:25,470 --> 00:08:28,740 vì đó sẽ giới thiệu rất nhiều trên mạng. 132 00:08:28,740 --> 00:08:33,620 >> Nó thường khá khó khăn - một khi bạn có một cơ sở dữ liệu đang chạy - 133 00:08:33,620 --> 00:08:37,210 nó thường khá khó khăn để thay đổi những dữ liệu bạn có trong nó - 134 00:08:37,210 --> 00:08:40,510 có nghĩa là, thêm một cột cơ sở dữ liệu mới hoặc một cái gì đó - 135 00:08:40,510 --> 00:08:43,510 do đó, một chiến lược tốt thực sự là chỉ để giữ rất nhiều dữ liệu của bạn trong một blob văn bản - 136 00:08:43,510 --> 00:08:53,880 một blob JSON - JSON là JavaScript Object Notation - 137 00:08:53,880 --> 00:08:58,330 Lý do đó là hữu ích là bởi vì sau đó bạn có thể thêm các thuộc tính mới 138 00:08:58,330 --> 00:09:01,920 cho tất cả các đốm màu JSON mà không thay đổi cơ sở dữ liệu của bạn. 139 00:09:01,920 --> 00:09:06,860 Nhược điểm duy nhất đó là nếu bạn có một loạt các lĩnh vực 140 00:09:06,860 --> 00:09:09,890 mà bạn thêm vào sau này - như ẩn trong đó JSON blob - 141 00:09:09,890 --> 00:09:12,850 sau đó nó khó hơn để truy vấn họ trong cơ sở dữ liệu. 142 00:09:12,850 --> 00:09:17,690 Ví dụ, nếu bạn sau này - nếu bạn đã có mô hình bài viết của bạn mà chúng ta đã thảo luận trước đó 143 00:09:17,690 --> 00:09:25,380 chỉ với các tác giả, người nhận và các văn bản - 144 00:09:25,380 --> 00:09:29,000 bạn cũng có thể có một blob JSON và sau đó nếu bạn sau muốn thêm một lĩnh vực ngày 145 00:09:29,000 --> 00:09:31,000 bạn sẽ không phải thay đổi cơ sở dữ liệu của bạn. 146 00:09:31,000 --> 00:09:36,140 Bạn chỉ có thể thêm ngày để tất cả các lĩnh vực văn bản. 147 00:09:36,140 --> 00:09:39,640 Và sau đó bạn sẽ có thể nhìn vào những trên các mặt hàng, 148 00:09:39,640 --> 00:09:42,430 nhưng bạn sẽ không thể truy vấn họ ở phía máy chủ 149 00:09:42,430 --> 00:09:44,430 bởi vì nó ẩn bên trong văn bản. 150 00:09:44,430 --> 00:09:49,920 >> Các vấn đề khác mà bạn muốn suy nghĩ về 151 00:09:49,920 --> 00:09:52,400 là làm thế nào khách hàng của bạn và máy chủ của bạn sẽ giao tiếp. 152 00:09:52,400 --> 00:09:56,040 Bạn thường muốn giữ điều này như là đơn giản càng tốt. 153 00:09:56,040 --> 00:10:02,230 Bạn chỉ có thể có như một get-tôi-này yêu cầu dữ liệu, 154 00:10:02,230 --> 00:10:09,140 một tạo-một-mới-đối tượng điều, và một yêu cầu cập nhật-một tuổi-đối tượng. 155 00:10:09,140 --> 00:10:12,930 Và những tất cả sẽ được các URL khác nhau trên một máy chủ bạn - 156 00:10:12,930 --> 00:10:20,030 trình duyệt sẽ - bạn có thể sử dụng các yêu cầu AJAX cho tất cả các 157 00:10:20,030 --> 00:10:24,000 và một trong hai nhận hoặc đăng dữ liệu. 158 00:10:24,000 --> 00:10:26,600 Một lần nữa, cho Cát Facebook ví dụ của chúng tôi, 159 00:10:26,600 --> 00:10:32,350 bạn có thể có URL để có được một bài viết cá nhân, 160 00:10:32,350 --> 00:10:39,750 và bạn muốn có một URL để tạo ra một bài tường mới 161 00:10:39,750 --> 00:10:45,670 và có thể là một URL để tải lên hình ảnh cá nhân của bạn, công cụ như thế. 162 00:10:45,670 --> 00:10:51,730 Nhưng một lần nữa, đó là để tiền lấy hầu hết dữ liệu của bạn để bạn không cần phải giữ 163 00:10:51,730 --> 00:10:53,360 làm cho yêu cầu mạng. 164 00:10:53,360 --> 00:10:59,030 Vì lý do đó, bạn có thể không muốn có mà nhận được yêu cầu cá nhân cho một bài duy nhất, 165 00:10:59,030 --> 00:11:03,210 và thay vào đó bạn sẽ chỉ muốn 1 nhận được yêu cầu cho toàn bộ bức tường. 166 00:11:03,210 --> 00:11:06,110 Và sau đó nếu bạn đang cố gắng để cân bằng bởi vì - 167 00:11:06,110 --> 00:11:10,970 này cũng sẽ phụ thuộc vào ứng dụng của bạn. 168 00:11:10,970 --> 00:11:13,430 Bởi vì nếu bạn đang mong đợi rằng người ta chỉ có 10 hoặc 20 bài viết tường 169 00:11:13,430 --> 00:11:15,430 rằng sẽ tốt đẹp. 170 00:11:15,430 --> 00:11:17,390 Nhưng nếu bạn đang mong họ sẽ có hàng ngàn sau đó yêu cầu rằng sẽ mất nhiều thời gian, 171 00:11:17,390 --> 00:11:23,580 và do đó bạn có thể muốn thêm một tham số được-tất cả các bài viết-từ. 172 00:11:23,580 --> 00:11:26,580 >> Cho tất cả các bạn có thể sẽ muốn đồng bộ dữ liệu của bạn trong JSON - 173 00:11:26,580 --> 00:11:29,260 JavaScript Object Notation. 174 00:11:29,260 --> 00:11:34,600 Khá nhiều mỗi ngôn ngữ đề với JSON rất tốt. 175 00:11:34,600 --> 00:11:40,880 JQuery có chức năng này getJSON tốt đẹp mà sẽ làm tất cả các công việc khó khăn cho bạn. 176 00:11:40,880 --> 00:11:47,390 Và trên PHP cũng có chức năng thông tin liên lạc JSON rất tốt đẹp. 177 00:11:47,390 --> 00:11:52,660 Vì vậy, có lẽ đó là định dạng tốt nhất để gửi mô hình của bạn lại. 178 00:11:52,660 --> 00:11:56,570 >> Như một ví dụ về những gì chúng tôi đã nói chuyện về cho đến nay, 179 00:11:56,570 --> 00:12:00,520 đây là một ví dụ cho dòng chảy ứng dụng Facebook Cát của bạn. 180 00:12:00,520 --> 00:12:07,760 Nó bắt đầu với yêu cầu URL của trang web cơ sở trình duyệt của bạn. 181 00:12:07,760 --> 00:12:15,470 Các máy chủ có thể sẽ gửi qua HTML tĩnh và một số JavaScript và CSS. 182 00:12:15,470 --> 00:12:19,170 Nó thường tốt nhất là không làm bất cứ vẽ trên máy chủ. 183 00:12:19,170 --> 00:12:23,370 Có thể bạn không muốn - 184 00:12:23,370 --> 00:12:28,360 những gì các máy chủ không được làm ở đó sẽ xuống danh sách các bài viết tường 185 00:12:28,360 --> 00:12:31,120 và tạo ra một số HTML cho mỗi một và gửi mà hơn. 186 00:12:31,120 --> 00:12:34,960 Nó thường là tốt nhất để làm điều đó trên các mặt hàng bởi vì nếu không 187 00:12:34,960 --> 00:12:38,580 mỗi khi bạn muốn vẽ lại một cái gì đó, bạn phải thực hiện một yêu cầu máy chủ. 188 00:12:38,580 --> 00:12:42,450 Và rất nhanh chóng cung cấp cho bạn rất nhiều chi phí. 189 00:12:42,450 --> 00:12:47,430 Nó thường là tốt nhất chỉ để gửi xuống tàu tĩnh HTML 190 00:12:47,430 --> 00:12:50,660 và sau đó JavaScript và CSS mà sẽ làm việc vẽ trên các mặt hàng. 191 00:12:50,660 --> 00:12:56,750 Ngay sau khi những thứ đó đến, 192 00:12:56,750 --> 00:13:03,500 sau đó bạn có thể có - trong JavaScript - bạn có thể làm cho các yêu cầu dữ liệu tường 193 00:13:03,500 --> 00:13:08,740 và các công cụ như thế, và sau đó máy chủ được về cơ bản chỉ làm các truy vấn cơ sở dữ liệu 194 00:13:08,740 --> 00:13:10,740 và kiểm tra quyền truy cập. 195 00:13:10,740 --> 00:13:16,690 Điều quan trọng duy nhất là nó không có thể gửi qua một số người dùng khác bài viết tường 196 00:13:16,690 --> 00:13:19,220 rằng bạn không được phép để xem. 197 00:13:19,220 --> 00:13:28,050 Nó về cơ bản có thể là một lớp truy cập rất mỏng để cơ sở dữ liệu, 198 00:13:28,050 --> 00:13:32,820 và sau đó tất cả các hiển thị dữ liệu - tất cả các quan điểm và các công cụ - 199 00:13:32,820 --> 00:13:37,280 những người có thể xảy ra trong trình duyệt của bạn, và sau đó khi bạn muốn thực hiện một bài hoặc một cái gì đó 200 00:13:37,280 --> 00:13:40,000 bạn chỉ cần gửi một yêu cầu khác. 201 00:13:40,000 --> 00:13:45,350 >> Ngoài ra còn có một số công cụ ưa thích bạn có thể làm trên đầu trang này. 202 00:13:45,350 --> 00:13:49,550 Về thông tin cụ thể hơn về kỹ thuật, 203 00:13:49,550 --> 00:13:53,360 phát triển ở đồng bằng JavaScript có thể là một chút đau đớn, 204 00:13:53,360 --> 00:13:56,220 do đó, có một số thư viện và công cụ mà sẽ giúp bạn rất nhiều với điều đó. 205 00:13:56,220 --> 00:14:03,690 Tôi nghĩ rằng tất cả các bạn đã có thể nghe nói về jQuery mà làm cho làm rendering HTML 206 00:14:03,690 --> 00:14:08,890 và thao tác dễ dàng hơn nhiều - có rất nhiều chức năng ưa thích cho phai trong và ngoài, 207 00:14:08,890 --> 00:14:12,020 và làm hình ảnh động vụt qua. 208 00:14:12,020 --> 00:14:13,720 Ngoài ra còn có thư viện này được gọi là Underscore.js. 209 00:14:13,720 --> 00:14:20,760 Nó có rất nhiều chức năng hữu ích hữu ích, công cụ mà bạn mong chờ JavaScript để có 210 00:14:20,760 --> 00:14:24,740 rằng nó thực sự doesnt - những thứ như xáo trộn một mảng, 211 00:14:24,740 --> 00:14:28,900 loại bỏ bản sao từ một danh sách, hoặc làm phẳng một danh sách liệt kê. 212 00:14:28,900 --> 00:14:30,900 Đây chỉ là một mẫu mã nhỏ. 213 00:14:30,900 --> 00:14:36,520 Gạch dưới có một tấn của các chức năng tốt đẹp mà bạn muốn bạn sẽ có tất cả các thời gian. 214 00:14:36,520 --> 00:14:38,840 >> Và sau đó có hơn 1 thư viện mà tôi muốn dành một chút thời gian trên 215 00:14:38,840 --> 00:14:44,800 gọi là Backbone.js vì Backbone thực sự giúp bạn đối phó với các mô hình trên các mặt hàng 216 00:14:44,800 --> 00:14:47,210 và rất nhiều sự nhầm lẫn rằng nó có thể gây ra. 217 00:14:47,210 --> 00:14:53,550 Xương sống mang đến cho bạn khái niệm này của các mô hình và bộ sưu tập 218 00:14:53,550 --> 00:14:58,300 trong JavaScript mà về cơ bản chính xác như các đối tượng JavaScript 219 00:14:58,300 --> 00:15:04,900 trong mảng JavaScript nhưng họ có sự kiện khi bạn thay đổi các thuộc tính của họ. 220 00:15:04,900 --> 00:15:09,090 Cũng giống như trong JavaScript, bạn có thể có một sự kiện khi một nút được nhấp chuột hay một cái gì đó 221 00:15:09,090 --> 00:15:14,800 các mô hình Backbone và bộ sưu tập Backbone sẽ phát sóng những thứ như 222 00:15:14,800 --> 00:15:17,510 khi họ thay đổi. 223 00:15:17,510 --> 00:15:22,270 Điều đó có nghĩa rằng bạn chỉ có thể viết một cái gì đó giống như đoạn mã này ở đây - 224 00:15:22,270 --> 00:15:27,530 này nói, bất cứ khi nào bạn thêm bất cứ điều gì để các bài viết mảng bạn vẽ lại toàn bộ bức tường. 225 00:15:27,530 --> 00:15:34,270 Và điều này có thể nói bất cứ khi nào số một của bài viết của thích thay đổi, 226 00:15:34,270 --> 00:15:38,970 bạn thông báo cho người dùng rằng ai đó thích bài viết của họ. 227 00:15:38,970 --> 00:15:45,210 Hoặc bất cứ khi nào bất kỳ tài sản của một bài thay đổi bạn vẽ lại bài. 228 00:15:45,210 --> 00:15:51,050 Công cụ như thế sẽ tiết kiệm tấn phức tạp bởi vì nếu không 229 00:15:51,050 --> 00:15:55,440 nếu bạn không có một số khuôn khổ như thế này thì mỗi lần trong mã của bạn mà bạn thay đổi 230 00:15:55,440 --> 00:16:04,280 bất cứ điều gì về một bài, bạn phải nhớ mình để gọi tất cả các chức năng làm 231 00:16:04,280 --> 00:16:07,680 và các công cụ như thế, và nếu bạn muốn thêm một cái gì đó mới xảy ra 232 00:16:07,680 --> 00:16:10,680 mỗi khi bạn sửa đổi một bài bạn phải đi qua mọi nơi trong của bạn 233 00:16:10,680 --> 00:16:14,610 mã mà bạn sửa đổi một bài và thêm rằng điều mới. 234 00:16:14,610 --> 00:16:21,450 Một khuôn khổ như thế này sẽ loại bỏ rất nhiều mà thông tin liên lạc giữa các lớp 235 00:16:21,450 --> 00:16:28,280 mà làm cho mã của bạn phức tạp và khó khăn để duy trì. 236 00:16:28,280 --> 00:16:31,170 >> Có một chút về quan điểm cũng có. 237 00:16:31,170 --> 00:16:35,960 Tôi sẽ để lại hầu hết các này đến Billy vì họ về mặt kỹ thuật không phải là rất khó khăn. 238 00:16:35,960 --> 00:16:43,540 Sử dụng jQuery cho quan điểm của bạn. Đó là thực tế như một điều cần thiết vào thời điểm này. 239 00:16:43,540 --> 00:16:46,290 Nó chỉ làm cho mọi thứ dễ dàng hơn nhiều. 240 00:16:46,290 --> 00:16:48,290 Có rất nhiều các thư viện. 241 00:16:48,290 --> 00:16:49,970 Nếu bạn đã phức tạp các yếu tố giao diện người dùng, 242 00:16:49,970 --> 00:16:57,250 nếu bạn muốn một điều tự động hoàn tất hoặc thích một trong những ưa thích nhiều bộ chọn - 243 00:16:57,250 --> 00:17:04,790 nếu bạn muốn bất cứ điều gì như thế, bạn nên có lẽ chỉ cần tìm kiếm xung quanh 244 00:17:04,790 --> 00:17:08,130 và bạn có thể tìm thấy một thư viện tốt sẽ làm những gì bạn muốn. 245 00:17:08,130 --> 00:17:11,579 Billy sẽ giải thích thêm về các bộ phận thực sự khó khăn quan điểm. 246 00:17:11,579 --> 00:17:17,530 Ngoài ra, như một mặt lưu ý, đường trục có một số chức năng để làm điểm giao tiếp 247 00:17:17,530 --> 00:17:22,800 độc đáo với mô hình - nhìn vào tài liệu hướng dẫn cho tất cả các thư viện, thực sự. 248 00:17:22,800 --> 00:17:28,270 Chỉ cần nhìn vào các tài liệu. Họ rất tốt bằng văn bản và dễ làm theo. 249 00:17:28,270 --> 00:17:33,890 Nói chung, bạn có thể khá nhiều chỉ Google nếu bạn có vấn đề. 250 00:17:33,890 --> 00:17:36,370 Có rất nhiều người sử dụng chúng. 251 00:17:36,370 --> 00:17:42,020 Tôi nghĩ rằng đây là một lưu ý cuối cùng. 252 00:17:42,020 --> 00:17:48,770 >> Cũng có một số điều cao cấp hơn mà bạn có thể làm 253 00:17:48,770 --> 00:17:53,400 nếu bạn đang tìm kiếm để làm cho ứng dụng web của bạn thêm tuyệt vời. 254 00:17:53,400 --> 00:17:59,760 Bạn có thể làm - các đặc điểm kỹ thuật HTML5 mới có rất nhiều thứ lạ mắt bạn có thể làm. 255 00:17:59,760 --> 00:18:05,780 Lưu trữ địa phương - đó là bạn có thể lưu trữ dữ liệu trong trình duyệt - 256 00:18:05,780 --> 00:18:09,470 thay vì phải quay trở lại và kiểm tra nội dung các máy chủ cho tất cả mọi thứ, 257 00:18:09,470 --> 00:18:12,470 bạn có thể giữ một số của nó trên máy khách và thậm chí cho phép người - 258 00:18:12,470 --> 00:18:20,850 trong một số trường hợp thậm chí có thể cho phép bạn sử dụng các trang web offline. 259 00:18:20,850 --> 00:18:26,980 Có điều này được gọi là WebSockets mà là một loại khác nhau của truyền thông mạng 260 00:18:26,980 --> 00:18:30,930 nơi thay vì chỉ bạn thực hiện một yêu cầu, bạn nhận được phản ứng và bạn đang làm, 261 00:18:30,930 --> 00:18:35,240 bạn tiếp tục mở một kết nối đến máy chủ và vì vậy bạn có thể làm những việc như 262 00:18:35,240 --> 00:18:37,240 cập nhật thời gian thực. 263 00:18:37,240 --> 00:18:42,020 Vì vậy, nếu bạn đang cố gắng để làm cho một ứng dụng chat, bạn có thể sử dụng WebSockets 264 00:18:42,020 --> 00:18:43,790 để giao tiếp qua lại do đó bạn sẽ không phải tiếp tục yêu cầu, 265 00:18:43,790 --> 00:18:48,410 "Oh, máy chủ, có ai gửi cho tôi một cuộc trò chuyện?" mỗi 10 giây hoặc một cái gì đó. 266 00:18:48,410 --> 00:18:55,620 Ngoài ra còn có một tính năng HTML5 thú vị mà bạn có thể làm cho nó trông giống như 267 00:18:55,620 --> 00:18:58,340 URL của trang đang thay đổi mà không bao giờ phải thực sự lại nó. 268 00:18:58,340 --> 00:19:03,230 Bạn có thể sử dụng lại và chuyển tiếp nút mà không làm một loạt các yêu cầu mạng. 269 00:19:03,230 --> 00:19:14,660 Công cụ như thế là thực sự hữu ích trong việc làm cho nó nhanh chóng nhưng cũng làm việc như một ứng dụng web nên. 270 00:19:14,660 --> 00:19:17,680 >> Ngoài ra còn có điều này được gọi là CoffeeScript. 271 00:19:17,680 --> 00:19:24,450 CoffeeScript là một ngôn ngữ khác nhau, trên thực tế, đó biên dịch xuống JavaScript. 272 00:19:24,450 --> 00:19:30,080 Bạn sẽ viết tất cả các mã trong CoffeeScript, và sau đó bạn chạy trình biên dịch này, 273 00:19:30,080 --> 00:19:33,300 và nó phun ra một tập tin JavaScript mà bạn có thể bao gồm trong trang web của bạn. 274 00:19:33,300 --> 00:19:38,860 Lý do mà CoffeeScript là tốt đẹp là bởi vì nó giúp loại bỏ rất nhiều các 275 00:19:38,860 --> 00:19:44,760 trường hợp lạ mà JavaScript có nơi bằng bằng, 276 00:19:44,760 --> 00:19:51,130 và bằng bình đẳng làm những việc khác nhau, hoặc muốn - 277 00:19:51,130 --> 00:19:55,740 nó có cú pháp đẹp hơn để đối phó với mảng và chức năng. 278 00:19:55,740 --> 00:20:00,460 Đây là một đoạn nhỏ của CoffeeScript sản xuất một danh sách của tất cả các hình vuông 279 00:20:00,460 --> 00:20:04,900 từ 10 ^ 2-1 ^ 2 theo thứ tự ngược. 280 00:20:04,900 --> 00:20:08,410 Như bạn thấy, CoffeeScript thường cho phép bạn thể hiện trong 1 dòng 281 00:20:08,410 --> 00:20:10,890 những gì sẽ mất 5 dòng mã JavaScript. 282 00:20:10,890 --> 00:20:13,230 Nó có thể làm cho mọi việc dễ dàng hơn nhiều. 283 00:20:13,230 --> 00:20:15,390 Đó là một chút của cú pháp mới để tìm hiểu ban đầu, 284 00:20:15,390 --> 00:20:18,010 nhưng nó chắc chắn sẽ làm cho bạn hiệu quả hơn trong thời gian dài. 285 00:20:18,010 --> 00:20:22,050 >> Bạn cũng có thể sử dụng các ngôn ngữ khác trên máy chủ hơn PHP - 286 00:20:22,050 --> 00:20:27,570 ngôn ngữ như Ruby, Python, hoặc thậm chí có một dự án gọi là Node.js 287 00:20:27,570 --> 00:20:31,450 mà sẽ cho phép bạn sử dụng JavaScript trên máy chủ. 288 00:20:31,450 --> 00:20:34,700 Cá nhân, tôi thực sự, thực sự ghét PHP. 289 00:20:34,700 --> 00:20:38,310 Tôi chỉ không thích làm việc với nó. 290 00:20:38,310 --> 00:20:43,450 Nếu bạn cũng nghĩ rằng đó là một cluge khủng khiếp của một ngôn ngữ, 291 00:20:43,450 --> 00:20:46,160 sau đó bạn có thể sử dụng một trong những thay thế. 292 00:20:46,160 --> 00:20:54,780 Nói chung, nếu bạn muốn làm một cái gì đó và bạn không thực sự biết làm thế nào bạn sẽ làm điều đó, 293 00:20:54,780 --> 00:20:56,780 chỉ tìm kiếm trên Internet. 294 00:20:56,780 --> 00:20:59,990 Có tấn và tấn tài nguyên đặc biệt trên - 295 00:20:59,990 --> 00:21:03,260 StackOverflow là một tuyệt vời nhất. 296 00:21:03,260 --> 00:21:06,400 Đó là trang web này, nơi các lập trình viên yêu cầu mỗi câu hỏi khác. 297 00:21:06,400 --> 00:21:09,690 Bạn có thể đã chạy vào nó nếu bạn đang gặp khó khăn về vấn đề bộ CS50. 298 00:21:09,690 --> 00:21:16,820 Và có tấn của các thư viện để làm khá nhiều bất cứ điều gì bạn muốn. 299 00:21:16,820 --> 00:21:21,710 Nếu bạn muốn làm một cái gì đó và bạn không biết làm thế nào để làm điều đó, 300 00:21:21,710 --> 00:21:23,710 đừng cho rằng đó là không thể. 301 00:21:23,710 --> 00:21:26,160 Chỉ cần nhìn xung quanh và bạn có thể tìm thấy một số nguồn tài nguyên tốt. 302 00:21:26,160 --> 00:21:29,280 >> Như một vị tướng quấn lên, 303 00:21:29,280 --> 00:21:33,650 các đồ ăn tay cầm chính là giữ cho mọi thứ đơn giản. 304 00:21:33,650 --> 00:21:36,010 Phức tạp hơn mã của bạn là ngay từ đầu 305 00:21:36,010 --> 00:21:40,370 và càng có nhiều bạn cố gắng và làm công cụ ưa thích, 306 00:21:40,370 --> 00:21:43,300 về lâu nó sẽ đi để có được một cái gì đó thực sự chức năng 307 00:21:43,300 --> 00:21:46,480 và khó khăn hơn nó sẽ được thay đổi sau đó. 308 00:21:46,480 --> 00:21:49,580 Vì vậy, làm những việc ngớ ngẩn, cách dễ dàng đầu tiên. 309 00:21:49,580 --> 00:21:51,720 Đi cùng với đó, 310 00:21:51,720 --> 00:21:59,070 không được sợ hãi của vứt đi mã cũ hoặc làm sạch nó lên rất nhiều. 311 00:21:59,070 --> 00:22:05,320 Nói chung, một khi bạn thực sự có một cái gì đó làm việc, 312 00:22:05,320 --> 00:22:09,640 nó dễ dàng hơn để suy nghĩ về hơn khi bạn vẫn còn ở giai đoạn đầu 313 00:22:09,640 --> 00:22:12,610 làm thế nào để tôi đặt này tất cả cùng nhau. 314 00:22:12,610 --> 00:22:17,500 Cách tốt nhất để làm cho thiết kế ngớ ngẩn nhất có thể hoạt động 315 00:22:17,500 --> 00:22:22,270 và sau đó cải thiện nó lặp đi lặp lại hơn là cố gắng để có được tất cả mọi thứ ngay lần đầu tiên. 316 00:22:22,270 --> 00:22:28,330 Về bộ phận client-server, cố gắng và giữ cho máy chủ của bạn rất đơn giản - 317 00:22:28,330 --> 00:22:33,030 chỉ là một cơ sở dữ liệu và một số xác thực và không làm bất kỳ công việc khó khăn đó. 318 00:22:33,030 --> 00:22:37,540 Làm tất cả các công cụ phức tạp của bạn trên các mặt hàng trong trình duyệt 319 00:22:37,540 --> 00:22:40,650 trong JavaScript như nhiều như bạn có thể. 320 00:22:40,650 --> 00:22:43,420 Nhìn xung quanh cho các thư viện mà làm cho cuộc sống của bạn tốt hơn. 321 00:22:43,420 --> 00:22:46,850 Luôn luôn tốt hơn để sử dụng mã người khác đã viết 322 00:22:46,850 --> 00:22:49,850 nếu bạn - và không viết nó cho mình. 323 00:22:49,850 --> 00:22:57,560 Có rất nhiều thứ trên Internet. Google là người bạn tốt nhất của bạn. 324 00:22:57,560 --> 00:22:59,560 Google là người bạn tốt nhất của lập trình viên. 325 00:22:59,560 --> 00:23:07,620 Yeah, chắc chắn không sợ phải nhìn xung quanh cho các công cụ. 326 00:23:07,620 --> 00:23:11,860 Được rồi. Và giao cho Billy. 327 00:23:11,860 --> 00:23:14,600 >> [Billy] Trên thực tế, trước khi tôi bắt đầu với một số công cụ thiết kế, 328 00:23:14,600 --> 00:23:17,250 không ai có bất kỳ câu hỏi Ben về bất cứ điều gì ông nói về? 329 00:23:17,250 --> 00:23:20,290 Được rồi, tốt. 330 00:23:20,290 --> 00:23:22,220 Một lần nữa, cho chúng tôi biết nếu bất cứ điều gì không rõ ràng 331 00:23:22,220 --> 00:23:25,420 hoặc nếu bạn muốn chúng tôi đi qua một cái gì đó nhiều hơn một chút. 332 00:23:25,420 --> 00:23:30,330 Tôi sẽ lùi lại một bước và nói về những phần cơ bản hơn của thiết kế. 333 00:23:30,330 --> 00:23:34,840 Bến đề cập đến mô hình được gọi là - xin lỗi, mô hình hệ thống điều khiển xem 334 00:23:34,840 --> 00:23:38,520 được sắp xếp của các khía cạnh kỹ thuật, vì vậy tôi sẽ xem xét quan điểm cụ thể, 335 00:23:38,520 --> 00:23:42,930 và tôi sẽ bắt đầu với cách bạn muốn thiết kế một cái nhìn có vẻ tốt đẹp. 336 00:23:42,930 --> 00:23:50,540 Đây là loại một mẫu thực sự cơ bản cho Cát của chúng tôi Facebook. 337 00:23:50,540 --> 00:23:54,190 Tôi nghĩ rằng có một số nguyên tắc cơ bản trong thiết kế giao diện người dùng hiện đại 338 00:23:54,190 --> 00:23:56,190 có giá trị lại tăng cao. 339 00:23:56,190 --> 00:23:58,210 Bạn có thể nhận thấy có rất nhiều không gian màu trắng trên tất cả các trang, 340 00:23:58,210 --> 00:24:00,790 nhiều chỗ cho mọi thứ. 341 00:24:00,790 --> 00:24:02,580 Không cảm thấy như bạn phải dẹp mọi thứ vào một trang. 342 00:24:02,580 --> 00:24:06,700 Bạn muốn để lại rất nhiều phòng mở, và nếu bạn đi đến hầu hết các trang web hiện đại 343 00:24:06,700 --> 00:24:08,380 bạn sẽ thấy có màu trắng ở khắp mọi nơi. 344 00:24:08,380 --> 00:24:10,380 Có màu trắng ở những nơi bạn sẽ không mong đợi. 345 00:24:10,380 --> 00:24:14,570 Bạn có bảng màu này, và đó là khôn ngoan ngay từ đầu 346 00:24:14,570 --> 00:24:17,880 để lựa chọn một bảng màu mà bạn sẽ làm việc với và phát triển. 347 00:24:17,880 --> 00:24:22,250 Bạn cũng có - nó giúp để lựa chọn một kiểu chữ, và cách mà bạn đang làm việc với các loại 348 00:24:22,250 --> 00:24:24,450 các nguyên tắc cơ bản cụ thể của thiết kế. 349 00:24:24,450 --> 00:24:26,910 Bạn có loại của bạn, bạn có màu sắc của bạn, và sau đó bạn có thể loại 350 00:24:26,910 --> 00:24:29,380 phù hợp với tất cả mọi thứ khác trong khi cần thiết. 351 00:24:29,380 --> 00:24:37,710 Vì vậy, như tôi đã nói, với màu sắc của bạn, bạn muốn sử dụng màu sắc táo bạo của màu sắc của bạn 352 00:24:37,710 --> 00:24:40,320 ít. Tiêu đề là tốt đẹp. Nút là tốt đẹp để có, màu sắc sặc sỡ thực sự lớn. 353 00:24:40,320 --> 00:24:43,710 Nhưng nói chung, nếu bạn có một trang web có màu sắc ở khắp mọi nơi, 354 00:24:43,710 --> 00:24:47,250 tất cả nhìn chằm chằm vào mặt bạn, nó chỉ trông lộn xộn, và nó không tốt. 355 00:24:47,250 --> 00:24:50,430 Bạn muốn thường sử dụng màu sắc ánh sáng. 356 00:24:50,430 --> 00:24:52,890 Cố gắng, một lần nữa, chọn một màu sắc khá mạch lạc. 357 00:24:52,890 --> 00:24:56,640 Bạn có thể có những splashes ít nhiều màu sắc - 358 00:24:56,640 --> 00:25:00,240 có thể trông khá đẹp, nhưng bạn muốn sử dụng chúng khá ít. 359 00:25:00,240 --> 00:25:04,270 >> Như tôi đã nói, bạn muốn được tối thiểu. Ít hơn là hầu như luôn luôn nhiều hơn. 360 00:25:04,270 --> 00:25:07,430 Nếu bạn có thể hiển thị một cái gì đó hoặc không hiển thị một cái gì đó, 361 00:25:07,430 --> 00:25:10,230 và bạn loại không chắc chắn liệu nó cần phải có theo mặc định - 362 00:25:10,230 --> 00:25:13,400 có lẽ bạn đang tắt tốt nhất để lại nó ra. Bạn luôn có thể thêm nó vào sau đó. 363 00:25:13,400 --> 00:25:16,620 Yeah, giữ cho mọi thứ đơn giản. 364 00:25:16,620 --> 00:25:19,510 Nhưng quan trọng nhất, bạn muốn xem xét nhiều mẫu thiết kế. 365 00:25:19,510 --> 00:25:23,520 Đừng nghĩ rằng khi bạn thực hiện một trang web, bạn có nó trong đầu của bạn mà bạn sẽ 366 00:25:23,520 --> 00:25:26,310 làm cho các trang web trong một cách nào đó, và nó sẽ trông giống hệt như thế này. 367 00:25:26,310 --> 00:25:29,830 Nó sẽ có tiêu đề màu xanh ở đầu trang và thanh bên màu xanh 368 00:25:29,830 --> 00:25:32,670 và sau đó là điều phụ tiêu đề màu vàng. 369 00:25:32,670 --> 00:25:34,670 Bạn muốn thực hiện nhiều mẫu. 370 00:25:34,670 --> 00:25:37,350 Bạn có thể - nếu bạn tốt với hình ảnh cửa hàng, bạn có thể mở mà lên và loại 371 00:25:37,350 --> 00:25:39,600 thiết kế một trang web như bạn muốn nó để xem xét. 372 00:25:39,600 --> 00:25:41,680 Nếu không, bạn chỉ có thể sử dụng bút và giấy, 373 00:25:41,680 --> 00:25:44,000 nhưng xước lên nhiều thiết kế. 374 00:25:44,000 --> 00:25:47,000 Bạn muốn cơ bản có một thiết lập nơi mà bạn có rất nhiều thiết kế khác nhau, 375 00:25:47,000 --> 00:25:50,810 và nếu một kết thúc làm việc, thì đó là tuyệt vời. 376 00:25:50,810 --> 00:25:53,370 Nếu một kết thúc không, sau đó bạn luôn luôn có một số khác chuyển sang. 377 00:25:53,370 --> 00:25:57,960 Nói chung, không cảm thấy như bạn nên hạn chế 378 00:25:57,960 --> 00:26:00,830 để bất cứ điều gì thiết kế ban đầu bạn quyết định. 379 00:26:00,830 --> 00:26:04,420 Thiết kế rất biến, và một phần của tầm quan trọng của mô hình 380 00:26:04,420 --> 00:26:09,480 hệ thống điều khiển xem là bạn có thể trao đổi trong và ngoài quan điểm khác nhau mà bạn muốn. 381 00:26:09,480 --> 00:26:13,510 Bạn có thể gây ảnh hưởng đến dữ liệu một cách, và sau đó quyết định, oh, trên thực tế, điều đó không làm việc tốt. 382 00:26:13,510 --> 00:26:19,190 Tôi nghĩ rằng đó là loại quá phức tạp hoặc có một phần ở đây mà không thực sự làm việc, 383 00:26:19,190 --> 00:26:22,150 vì vậy tôi chỉ cần đi để hoàn toàn từ bỏ quan điểm này và trao đổi trong một hoàn toàn mới. 384 00:26:22,150 --> 00:26:24,790 Chúng ta vẫn có thể sử dụng các mô hình cũ và các bộ điều khiển cũ. 385 00:26:24,790 --> 00:26:27,490 Chúng ta có thể làm tất cả mọi thứ trên máy chủ và khách hàng như chúng tôi sẽ trước. 386 00:26:27,490 --> 00:26:32,850 Nhưng làn sóng thực tế của dữ liệu được hiển thị là có được hơi khác nhau. 387 00:26:32,850 --> 00:26:35,840 >> Theo như thực sự thực hiện thiết kế mà bạn muốn, 388 00:26:35,840 --> 00:26:39,330 một khi bạn có một vài thiết kế phác thảo trên giấy hoặc trên hình ảnh cửa hàng hoặc bất cứ điều gì, 389 00:26:39,330 --> 00:26:42,120 có một số công cụ được tạo sẵn cho bạn. 390 00:26:42,120 --> 00:26:45,700 Đầu tiên bạn rất quen thuộc với đó là HTML, PHP, hay bất cứ điều gì 391 00:26:45,700 --> 00:26:48,990 ngôn ngữ mà bạn đang sử dụng chỉ để mã các trang tĩnh trên trang web của bạn. 392 00:26:48,990 --> 00:26:51,990 Bạn đã làm việc rất nhiều với HTML mà loại cung cấp cho bạn các thẻ 393 00:26:51,990 --> 00:26:57,820 mà bạn có thể đưa mọi thứ vào, và về cơ bản đó là một cách tổ chức nội dung của bạn. 394 00:26:57,820 --> 00:27:00,990 Ví dụ, bạn có tiêu đề lên đó, vì vậy bạn sẽ có một thẻ tiêu đề, 395 00:27:00,990 --> 00:27:05,770 và nó sẽ có một số văn bản bên trong của nó mà có lẽ sẽ là trong một thẻ khác. 396 00:27:05,770 --> 00:27:08,380 Sau đó, bạn có một bên có thể với một số liên kết khác nhau, 397 00:27:08,380 --> 00:27:10,160 và những người sẽ được tất cả trong các thẻ riêng biệt. 398 00:27:10,160 --> 00:27:13,870 Vì vậy, về cơ bản HTML tại trái tim của nó là một cách để phân chia trang như thế nào 399 00:27:13,870 --> 00:27:16,980 bạn cuối cùng muốn định dạng nó. 400 00:27:16,980 --> 00:27:18,980 Vì vậy, một lần nữa, bạn đã nhìn thấy rằng trước. 401 00:27:18,980 --> 00:27:20,540 Bạn đang khá thoải mái với làm việc với nó bây giờ 402 00:27:20,540 --> 00:27:23,120 cho rằng bạn đã thực hiện các pset cuối cùng hy vọng, 403 00:27:23,120 --> 00:27:26,150 để nên có vấn đề. 404 00:27:26,150 --> 00:27:31,280 >> Sau đó, bạn có CSS ​​mà về cơ bản xử lý tất cả các khía cạnh của thiết kế tĩnh. 405 00:27:31,280 --> 00:27:35,320 Nó sẽ xử lý tất cả các màu sắc, tất cả các vị trí của các yếu tố khác nhau, 406 00:27:35,320 --> 00:27:36,840 nơi họ đi đối với nhau với, 407 00:27:36,840 --> 00:27:41,530 lớn như thế nào họ đang có, các loại khác nhau của positionings là bạn sẽ có - 408 00:27:41,530 --> 00:27:46,030 nói cách khác, bạn có thể có những thứ cố định để khi bạn di chuyển xuống họ ở lại, 409 00:27:46,030 --> 00:27:48,700 hoặc bạn có thể có những điều liên quan đến các yếu tố khác. 410 00:27:48,700 --> 00:27:50,730 Tất cả các loại công cụ mà là trong CSS. 411 00:27:50,730 --> 00:27:54,630 Hơn nữa, bạn có thể làm đồ trang trí khác nhau, bạn có thể có màu sắc văn bản, 412 00:27:54,630 --> 00:27:56,630 hiệu ứng văn bản, tất cả các loại công cụ. 413 00:27:56,630 --> 00:28:00,360 Ben đã đưa ra một hội thảo thực sự tốt vào cuối tuần cuối cùng này, 414 00:28:00,360 --> 00:28:04,450 và vì vậy tôi chắc chắn sẽ kiểm tra xem ra nếu bạn có kế hoạch để được làm một số việc ưa thích với CSS. 415 00:28:04,450 --> 00:28:09,850 CSS3 thực sự là phiên bản mới nhất của CSS, và nó có thể làm tất cả các loại điều thực sự tốt đẹp. 416 00:28:09,850 --> 00:28:14,750 Nó có thể làm gradient, bạn có thể có tốt đẹp, góc tròn, bạn có thể làm tất cả các loại công cụ 417 00:28:14,750 --> 00:28:17,940 để làm cho trang web của bạn trông hiện đại hơn và lạ mắt. 418 00:28:17,940 --> 00:28:22,150 >> Công cụ tiếp theo là JavaScript và jQuery mà Ben nói chuyện một chút về, 419 00:28:22,150 --> 00:28:24,150 nhưng tôi sẽ có được một chút sâu hơn vào. 420 00:28:24,150 --> 00:28:28,100 JavaScript, như bạn đã làm việc với nó một chút, hoặc ít nhất là nhìn thấy nó trong bài giảng, 421 00:28:28,100 --> 00:28:31,870 là loại một cách tự động làm công cụ trong HTML. 422 00:28:31,870 --> 00:28:35,950 HTML, như bạn đã biết, là tĩnh, vì vậy khi bạn có HTML bạn không thể sửa đổi nó. 423 00:28:35,950 --> 00:28:40,050 Nhưng JavaScript, trong một số cách, là một cách để có thể sửa đổi HTML. 424 00:28:40,050 --> 00:28:44,520 Vì vậy, bạn có thể làm điều đó, và đó là tuyệt vời, nhưng JavaScript thực sự là một nỗi đau để làm việc với. 425 00:28:44,520 --> 00:28:49,050 Nó rất dài và tù và thậm chí những điều đơn giản 426 00:28:49,050 --> 00:28:51,630 đòi hỏi rất nhiều dòng mã JavaScript. 427 00:28:51,630 --> 00:28:55,410 Vì vậy, jQuery cơ bản là một thư viện JavaScript đơn giản hóa tất cả. 428 00:28:55,410 --> 00:28:59,880 Nó nói, không sao, nếu bạn muốn có một hộp vuông đến từ bên trái 429 00:28:59,880 --> 00:29:03,980 và dần vào trang để nó ở giữa, trong JavaScript mà có thể mất - 430 00:29:03,980 --> 00:29:06,340 Tôi không biết, một trăm dòng để làm, và nó sẽ là một nỗi đau, 431 00:29:06,340 --> 00:29:10,540 và bạn đi ra khỏi nó ghét tất cả mọi thứ về lập trình web. 432 00:29:10,540 --> 00:29:15,380 JQuery bạn về cơ bản có các yếu tố-dot-fade-in, hoặc một cái gì đó như thế. 433 00:29:15,380 --> 00:29:18,580 Chức năng như vậy, rất, rất đơn giản mà sẽ cho phép bạn làm tất cả các loại hình ảnh động mát mẻ 434 00:29:18,580 --> 00:29:20,580 và đó là điều mà. 435 00:29:20,580 --> 00:29:23,300 Một thứ khác mà những 2 có thực sự tốt cho chỉ được làm những việc năng động 436 00:29:23,300 --> 00:29:25,300 với các trang web. 437 00:29:25,300 --> 00:29:28,370 Vì vậy, thay vì chỉ có trang HTML của bạn - mà hiển thị một số dữ liệu nhưng không thực sự 438 00:29:28,370 --> 00:29:32,130 làm bất cứ điều gì - JavaScript và jQuery sẽ cho phép bạn có các nút mà bạn có thể click vào, 439 00:29:32,130 --> 00:29:37,960 và bạn có thể kéo các yếu tố và sắp xếp lại chúng và sắp xếp chúng, và có những yếu tố mới 440 00:29:37,960 --> 00:29:40,500 thêm vào hoặc gỡ bỏ. Bạn có thể thêm-xóa, loại điều đó. 441 00:29:40,500 --> 00:29:44,570 Vì vậy, jQuery làm nhiều thứ mát mẻ. 442 00:29:44,570 --> 00:29:48,840 Và Vipul thực sự cho một cuộc hội thảo về nó ngày hôm nay, tôi tin rằng, tại 5 giờ, 443 00:29:48,840 --> 00:29:51,220 vì vậy nếu bạn có thể dính vào xung quanh cho rằng lâu, mà có thể - 5 hoặc 4? 444 00:29:51,220 --> 00:29:54,930 Bốn. Xin lôi. Nó thực sự ngay sau đó, vì vậy tôi muốn giới thiệu 445 00:29:54,930 --> 00:29:56,680 bám xung quanh cho nó nếu bạn có thể. 446 00:29:56,680 --> 00:30:00,180 JQuery là siêu, siêu hữu ích, và bạn sẽ có thể làm rất nhiều điều thực sự tốt đẹp với nó 447 00:30:00,180 --> 00:30:03,460 cho khá nhiều bất kỳ dự án phát triển web. 448 00:30:03,460 --> 00:30:06,200 >> Bây giờ tôi sẽ nhận được vào loại một sự phân biệt. 449 00:30:06,200 --> 00:30:08,210 Tôi đã nói chuyện về cơ bản về giao diện người dùng. 450 00:30:08,210 --> 00:30:11,510 Giao diện người dùng chỉ việc thiết kế các trang web. 451 00:30:11,510 --> 00:30:13,780 Nhưng có loại một khái niệm đó là trải nghiệm người dùng. 452 00:30:13,780 --> 00:30:15,900 Hai rất khác nhau. 453 00:30:15,900 --> 00:30:19,440 Giao diện chắc chắn là một phần của kinh nghiệm. 454 00:30:19,440 --> 00:30:21,340 Nói cách khác, khi bạn đi đến một trang web, bạn nhìn vào giao diện. 455 00:30:21,340 --> 00:30:22,960 Đó là một phần của cách bạn trải nghiệm các trang web. 456 00:30:22,960 --> 00:30:24,960 Nhưng kinh nghiệm người dùng là nhiều hơn thế. 457 00:30:24,960 --> 00:30:29,910 Kinh nghiệm người dùng là về những gì ấn tượng mà người dùng nhận được từ trang web của bạn. 458 00:30:29,910 --> 00:30:31,910 Vì vậy, rõ ràng, giao diện là một phần trong đó. 459 00:30:31,910 --> 00:30:35,340 Và nó chắc chắn là một phần cần thiết, nhưng nó không đủ. 460 00:30:35,340 --> 00:30:38,790 Nói cách khác, nếu bạn có một giao diện đẹp, và nó khá và đầy màu sắc và tất cả điều đó, 461 00:30:38,790 --> 00:30:43,650 đó là tuyệt vời, nhưng nếu người dùng đi vào trang web của bạn, thấy một bố trí khá và nó bối rối bởi 462 00:30:43,650 --> 00:30:47,060 tất cả mọi thứ, không có ý tưởng làm thế nào để làm bất cứ điều gì, thì rõ ràng bạn đã thực hiện một thực sự 463 00:30:47,060 --> 00:30:48,930 trang web nghèo. 464 00:30:48,930 --> 00:30:50,930 Đó là loại nơi mà kinh nghiệm người sử dụng có in 465 00:30:50,930 --> 00:30:54,570 Tôi sẽ nói một chút về thiết kế UX - UX là viết tắt của kinh nghiệm người dùng - 466 00:30:54,570 --> 00:30:58,050 và loại làm thế nào bạn có thể chắc chắn rằng bạn có một trải nghiệm người dùng tốt. 467 00:30:58,050 --> 00:31:04,330 Điểm đầu tiên là bạn có thể thiết kế một trang web mà người dùng có thể làm bất cứ điều gì 468 00:31:04,330 --> 00:31:06,820 người sử dụng mà có thể muốn. 469 00:31:06,820 --> 00:31:08,940 Nhưng nếu người dùng không thể tìm ra cách để làm những điều - 470 00:31:08,940 --> 00:31:12,850 nói cách khác, nếu người dùng không có một ý tưởng tốt khi họ đi đến trang web của bạn, 471 00:31:12,850 --> 00:31:17,660 "Ồ, nếu tôi muốn cập nhật hồ sơ cá nhân của tôi, sau đó tôi nhấp vào nút này, hoặc nếu tôi muốn đăng bài trên 472 00:31:17,660 --> 00:31:20,850 bức tường của một ai đó, sau đó tôi đi đến bức tường của họ và nhấp chuột vào một hộp nhỏ. " 473 00:31:20,850 --> 00:31:24,410 Nếu người sử dụng không biết rằng, sau đó bạn không thực sự có hiệu quả có 474 00:31:24,410 --> 00:31:27,080 thực hiện chức năng một cách chính xác. 475 00:31:27,080 --> 00:31:30,900 Một phần của việc thực hiện một chức năng là những người sử dụng thực sự có thể sử dụng nó. 476 00:31:30,900 --> 00:31:34,810 Và nó có thể là bực bội - bạn có thể làm cho một trang web, và nó có thể làm tất cả các loại 477 00:31:34,810 --> 00:31:37,810 những điều tuyệt vời, nhưng sau đó bạn sẽ có người kiểm tra nó và nói, "Nó không thể làm điều này. 478 00:31:37,810 --> 00:31:39,770 Tại sao nó không thể làm điều này? "Và bạn sẽ nói lại với họ, 479 00:31:39,770 --> 00:31:44,420 "Vâng, nó có thể. Bạn chỉ cần có để đi vào thứ 7 trình đơn thả xuống này tối nghĩa 480 00:31:44,420 --> 00:31:48,470 trang đó chỉ được tìm thấy bởi một liên kết ở góc dưới bên phải "hay một cái gì đó. 481 00:31:48,470 --> 00:31:50,430 Rõ ràng, bạn không muốn điều đó. 482 00:31:50,430 --> 00:31:53,420 Bạn muốn nó được rõ ràng cho người dùng của bạn những gì họ đang phải làm, 483 00:31:53,420 --> 00:31:56,240 và nó phải là đơn giản và trực quan cho họ. 484 00:31:56,240 --> 00:32:01,180 >> Một điều mà bạn muốn cố gắng làm là, nếu một người nào đó sẽ đi đến trang web của bạn 485 00:32:01,180 --> 00:32:05,520 và 9 trong số 10 lần làm hành động A, và 1 trong số 10 lần làm hành động B, 486 00:32:05,520 --> 00:32:08,950 có thể bạn muốn tập trung kinh nghiệm của họ về hành động A. 487 00:32:08,950 --> 00:32:12,240 Nói cách khác, bạn muốn làm cho nó rất, rất rõ ràng làm thế nào để làm A. 488 00:32:12,240 --> 00:32:15,980 Một nên phía trước và trung tâm - hãy vào trang web, nhìn thấy nó, oh, nó phải có. 489 00:32:15,980 --> 00:32:20,850 Trong khi B rõ ràng là bạn muốn được rõ ràng, nhưng bạn có thể để nó nhiều hơn một chút 490 00:32:20,850 --> 00:32:22,850 trong nền. 491 00:32:22,850 --> 00:32:24,640 David cho một ví dụ tốt về điều này trong bài giảng, 492 00:32:24,640 --> 00:32:26,640 đó là hệ thống Boston T. 493 00:32:26,640 --> 00:32:29,440 Khi bạn đi đến Boston T và bạn muốn mua một vé, 494 00:32:29,440 --> 00:32:32,700 bạn có để có được thành 5 đơn trước khi bạn thực sự có thể mua vé 495 00:32:32,700 --> 00:32:37,130 cho $ 2, $ 2,50 giá trị, đó là phải mất bao nhiêu để đi tàu điện ngầm 496 00:32:37,130 --> 00:32:39,130 theo một hướng. 497 00:32:39,130 --> 00:32:41,600 Đó là một vấn đề bởi vì hầu hết những người đang đi tàu điện ngầm 498 00:32:41,600 --> 00:32:44,880 có lẽ chỉ muốn đi đến một nơi, mua vé của họ, có được trên ngay lập tức. 499 00:32:44,880 --> 00:32:47,550 Nó không có ý nghĩa rằng họ phải đi qua rất nhiều menu khác nhau 500 00:32:47,550 --> 00:32:49,550 để đến đó. 501 00:32:49,550 --> 00:32:51,760 Một trải nghiệm người dùng tốt hơn sẽ là một nút nhanh chóng trên trang đầu tiên 502 00:32:51,760 --> 00:32:54,760 mà chỉ nói: "mua một vé một chiều," và đó sẽ đưa vào tất cả các tiêu chuẩn 503 00:32:54,760 --> 00:32:58,550 giá trị mặc định, và sau đó nếu ai đó muốn mua một vé khác nhau hơn, 504 00:32:58,550 --> 00:33:01,690 họ vẫn còn, tất nhiên, có tùy chọn, nhưng bạn đã tối ưu hóa cho 505 00:33:01,690 --> 00:33:04,080 trường hợp sử dụng chung mà thực sự là quan trọng. 506 00:33:04,080 --> 00:33:06,830 Bạn có thể xem các ví dụ về điều này trên Facebook, phải không? 507 00:33:06,830 --> 00:33:09,410 Nếu bạn đi đến Facebook và bạn muốn gửi một trạng thái, 508 00:33:09,410 --> 00:33:11,710 nó phải ở trên cùng đó là những gì bạn thường muốn làm. 509 00:33:11,710 --> 00:33:14,730 Ngay sau khi bạn nhập vào trang, bạn có thể làm những điều phổ biến nhất mà 510 00:33:14,730 --> 00:33:16,730 bạn muốn làm. 511 00:33:16,730 --> 00:33:17,550 Nếu bạn muốn làm những điều hơi phức tạp hơn như, 512 00:33:17,550 --> 00:33:21,070 nói rằng tôi muốn đi đến bức tường của bạn tôi và gửi một hình ảnh trên đó - 513 00:33:21,070 --> 00:33:24,810 mà tôi sẽ muốn làm thường xuyên, nhưng không thường xuyên như đăng cập nhật trạng thái - 514 00:33:24,810 --> 00:33:28,200 do đó, trong trường hợp đó, tôi gõ tên của họ trong hộp ở đầu trang, click vào hồ sơ của họ, 515 00:33:28,200 --> 00:33:31,680 và sau đó, vẫn còn, đó là ngay ở đầu trang có một lần tôi đã nhận được để hồ sơ của họ. 516 00:33:31,680 --> 00:33:38,240 Một lần nữa, tôi đã tối ưu hóa ưu tiên cho các trường hợp nhất sử dụng chung. 517 00:33:38,240 --> 00:33:41,800 >> Một điều quan trọng là thường mọi người sẽ loại cố gắng làm được việc này 518 00:33:41,800 --> 00:33:44,890 bởi nói, được rồi, vì vậy tôi đã thực hiện các trang web và những người đang tìm nó khó hiểu, 519 00:33:44,890 --> 00:33:46,110 và đó là một vấn đề, phải không? 520 00:33:46,110 --> 00:33:49,210 Rõ ràng, tôi không muốn mọi người bị nhầm lẫn bởi nội dung của trang web của tôi. 521 00:33:49,210 --> 00:33:53,210 Tuy nhiên, cách giải quyết đó không phải là để có cái gì bật lên nói, 522 00:33:53,210 --> 00:33:55,290 hey, tôi sẽ dạy cho bạn cách sử dụng trang web này. 523 00:33:55,290 --> 00:33:58,130 Bước 1 - nhấp vào nút này. Bước 2 - đi đây. 524 00:33:58,130 --> 00:34:03,080 Chắc chắn, đó là một cách xung quanh nó - đó là một cách mà bạn có thể nói với mọi người phải làm gì, nhưng nó 525 00:34:03,080 --> 00:34:05,080 thực sự không phải là cách tối ưu. 526 00:34:05,080 --> 00:34:07,420 Nếu tôi đi đến một trang web và đột nhiên tôi ném bom với hướng dẫn này như muốn nói 527 00:34:07,420 --> 00:34:11,739 phải làm gì và đi đâu và tất cả điều đó, đó không phải là niềm vui đối với tôi. 528 00:34:11,739 --> 00:34:13,739 Nó không phải là một kinh nghiệm tốt cho tôi. 529 00:34:13,739 --> 00:34:17,130 Đó là loại một nỗi đau. Tôi muốn chỉ bắt đầu làm công cụ. 530 00:34:17,130 --> 00:34:19,449 Mọi người sẽ đóng cửa ra khỏi hộp thoại của họ, 531 00:34:19,449 --> 00:34:23,580 hoặc có được ra khỏi hướng dẫn, không biết phải làm gì, và sau đó phàn nàn vì 532 00:34:23,580 --> 00:34:25,580 bạn đã không nói với họ phải làm gì. 533 00:34:25,580 --> 00:34:29,530 Cách giải quyết này không phải là bằng cách cho bất kỳ loại hướng dẫn hoặc hướng dẫn - 534 00:34:29,530 --> 00:34:31,530 bất cứ điều gì như thế. 535 00:34:31,530 --> 00:34:33,719 Nhiều như bạn có thể tránh nó, bạn thực sự muốn thể hiện cho người dùng phải làm gì 536 00:34:33,719 --> 00:34:36,429 chỉ bởi bản chất của cách các trang web được đặt ra. 537 00:34:36,429 --> 00:34:39,090 Nói cách khác, nếu tôi đi đến Facebook mà không cần đăng nhập, 538 00:34:39,090 --> 00:34:40,920 điều đầu tiên mà tôi nhìn thấy trên trang chính - 539 00:34:40,920 --> 00:34:44,480 đó là một hộp đăng nhập ít. Vì vậy, duh. Tôi phải đăng nhập Đó là ngay tại đó. 540 00:34:44,480 --> 00:34:48,030 Trong khi đó, nếu tôi đi đến Facebook và tôi đã phải bấm vào một liên kết nhỏ ở phía dưới 541 00:34:48,030 --> 00:34:51,920 mà nói "đăng nhập" và phần còn lại của trang chỉ là một số loại hình ảnh hoặc một cái gì đó, 542 00:34:51,920 --> 00:34:54,820 Tôi sẽ không thực sự biết phải làm gì, phải không? Tôi sẽ bị nhầm lẫn. 543 00:34:54,820 --> 00:34:58,590 Vì vậy, nó có thể cho tôi đi xuống đó và nhấp vào nút đăng nhập, 544 00:34:58,590 --> 00:35:01,080 hoặc đăng nhập nút trong có thể là ngay ở đầu nơi tôi sẽ nhìn thấy nó. 545 00:35:01,080 --> 00:35:04,780 Bạn muốn luôn luôn được hiển thị cho người dùng những gì để làm, 546 00:35:04,780 --> 00:35:06,750 và cần được vốn có trong trang riêng của mình. 547 00:35:06,750 --> 00:35:09,880 >> Khi bạn đang suy nghĩ về thiết kế và chế nhạo lên những cách khác nhau 548 00:35:09,880 --> 00:35:13,810 thể hiện trang web của bạn, bạn thực sự muốn suy nghĩ về những gì người dùng sẽ 549 00:35:13,810 --> 00:35:19,380 được làm và làm thế nào bạn có thể cho họ phải làm gì. 550 00:35:19,380 --> 00:35:23,530 Một điều cuối cùng là thử nghiệm thực sự, thực sự quan trọng. 551 00:35:23,530 --> 00:35:27,400 Nó là rất tốt để có được một người nào đó - được một người bạn, có được một người nào đó bạn không biết ngay cả - 552 00:35:27,400 --> 00:35:30,420 người chưa bao giờ nhìn thấy các trang web trước khi sử dụng trang web. 553 00:35:30,420 --> 00:35:33,650 Bởi vì bạn đã làm việc trên các trang web trong nhiều giờ, bạn đã được nhìn chằm chằm vào nó, 554 00:35:33,650 --> 00:35:36,670 và bạn biết chính xác những gì để làm như vậy rõ ràng là bạn sẽ được kiểm tra 555 00:35:36,670 --> 00:35:39,520 những điều mà bạn đã làm việc trên và rằng bạn biết làm việc. 556 00:35:39,520 --> 00:35:42,680 Nhưng nếu ai đó xuất hiện và sử dụng các trang web đó đã không bao giờ sử dụng nó trước, 557 00:35:42,680 --> 00:35:46,880 đó là một kinh nghiệm độc đáo bởi vì bạn có một người không có kiến ​​thức 558 00:35:46,880 --> 00:35:51,530 của trang web đi sâu vào nó, vì vậy chúng sẽ có hiệu quả không có ý tưởng gì để làm 559 00:35:51,530 --> 00:35:54,890 hoặc những loại trường hợp sử dụng có mặt cho họ. 560 00:35:54,890 --> 00:36:00,930 Đó là tuyệt vời. Đó là duy nhất bởi vì chúng thực chất là một người có một khoảng trống cho một tâm trí. 561 00:36:00,930 --> 00:36:03,750 Họ có thể cho bạn biết nếu có điều gì là khó hiểu hoặc không rõ ràng. 562 00:36:03,750 --> 00:36:07,580 Họ có thể cung cấp cho bạn một ý tưởng về chính xác những gì trải nghiệm người dùng của trang web của bạn. 563 00:36:07,580 --> 00:36:10,630 Nó có thể rất khó để nói rằng bản thân mình, vì vậy chắc chắn tôi sẽ khuyến khích bạn 564 00:36:10,630 --> 00:36:13,640 như bạn đang phát triển các dự án của bạn - nếu bạn đang làm dự án dựa trên web - 565 00:36:13,640 --> 00:36:18,290 để có được những người sử dụng các trang web như đầu là bạn có một số loại demo chức năng. 566 00:36:18,290 --> 00:36:25,330 >> Bây giờ tôi sẽ nói một chút về cách quản lý một dự án phát triển web. 567 00:36:25,330 --> 00:36:28,900 Chúng tôi đã đi qua như thế nào bạn có thể làm mặt sau cấp kỹ thuật, 568 00:36:28,900 --> 00:36:31,050 làm thế nào bạn có thể thiết kế một trang web thực sự tốt, 569 00:36:31,050 --> 00:36:34,150 và đó là tuyệt vời nếu bạn đang làm việc một mình nhưng - 570 00:36:34,150 --> 00:36:37,300 ngay cả khi bạn đang làm việc một mình và đặc biệt là nếu bạn đang làm việc trên một đội, 571 00:36:37,300 --> 00:36:39,580 quản lý dự án sẽ trở thành một vấn đề lớn. 572 00:36:39,580 --> 00:36:42,340 Bạn đã nghe nói về loại quản lý dự án theo các hình thức khác nhau kể từ 573 00:36:42,340 --> 00:36:45,410 trường tiểu học khi bạn được cho biết làm việc theo nhóm. 574 00:36:45,410 --> 00:36:46,820 Bạn phải hợp tác, giao tiếp, tất cả điều đó. 575 00:36:46,820 --> 00:36:49,620 Rằng tất cả vẫn được áp dụng ở đây, nhưng có một số trường hợp duy nhất với 576 00:36:49,620 --> 00:36:54,910 khoa học máy tính mà bạn muốn được nhận thức, và bạn muốn chắc chắn rằng bạn xử lý tốt. 577 00:36:54,910 --> 00:36:58,050 Tôi sẽ nói chuyện đầu tiên một chút về đội bóng mà bạn sẽ được in 578 00:36:58,050 --> 00:37:03,280 Nó rất quan trọng để chọn đúng kích cỡ của một đội bóng được làm việc trên, 579 00:37:03,280 --> 00:37:05,890 và trong dự án cuối cùng của bạn tôi nghĩ bạn có tùy chọn để lựa chọn 580 00:37:05,890 --> 00:37:08,610 từ 1 đến 4 người, nếu tôi là chính xác. 581 00:37:08,610 --> 00:37:12,050 Bạn muốn chắc chắn rằng bạn không chỉ là lựa chọn số lượng người 582 00:37:12,050 --> 00:37:14,950 mà bạn muốn làm việc với vì họ là bạn của bạn. 583 00:37:14,950 --> 00:37:18,170 Bạn muốn chọn một đội bóng đó là một kích thước khá lớn và sẽ nhận được công việc làm. 584 00:37:18,170 --> 00:37:22,700 Có một off thương mại có nhiều người so với người ít hơn. 585 00:37:22,700 --> 00:37:25,320 Nếu bạn có nhiều người, công việc rõ ràng hơn có thể được thực hiện 586 00:37:25,320 --> 00:37:28,450 bởi vì bạn có rất nhiều người, rất nhiều mã, rất nhiều ý tưởng, 587 00:37:28,450 --> 00:37:29,870 và đó là tất cả tuyệt vời. 588 00:37:29,870 --> 00:37:32,590 Nhưng nó cũng đòi hỏi quản lý nhiều hơn và giao tiếp nhiều hơn nữa. 589 00:37:32,590 --> 00:37:34,720 Nói cách khác, nếu bạn có 4 người làm việc trên cùng một dự án 590 00:37:34,720 --> 00:37:39,200 và tất cả họ đang chỉnh sửa mã giống nhau, ít nhiều họ tất cả các loại cần biết 591 00:37:39,200 --> 00:37:40,920 những gì đang xảy ra vậy nó đòi hỏi bạn - 592 00:37:40,920 --> 00:37:44,580 nếu bạn thêm một số chức năng mới mà bạn loại phải nói với mọi người - tôi thêm này, 593 00:37:44,580 --> 00:37:48,510 Tôi thay đổi này theo cách này - đặc biệt là nếu bạn nhận được vào những thứ thực sự sâu 594 00:37:48,510 --> 00:37:52,730 như các mô hình và các bộ điều khiển được thực sự sẽ ảnh hưởng đến cách trang web của các công trình. 595 00:37:52,730 --> 00:37:54,500 Cả đội cần phải được nhận thức của nó, 596 00:37:54,500 --> 00:37:58,140 vì vậy bạn cần phải chắc chắn rằng bạn không chọn một đội bóng quá lớn đó là có được khó khăn 597 00:37:58,140 --> 00:37:59,970 để làm cho truyền thông. 598 00:37:59,970 --> 00:38:02,930 Bạn cũng không muốn chọn một đội ngũ đủ nhỏ mà bạn sẽ không 599 00:38:02,930 --> 00:38:06,250 có thể giao tiếp bởi vì nó chỉ là bạn. 600 00:38:06,250 --> 00:38:11,270 >> Một điều cần xem xét là sự cân bằng của nơi kỹ năng của người dân đang có. 601 00:38:11,270 --> 00:38:14,350 Thật tuyệt vời nếu bạn là tất cả các lập trình viên thực sự tốt. 602 00:38:14,350 --> 00:38:17,050 Nhưng nếu bạn là tất cả mọi người phía sau, sau đó trang web của bạn sẽ không nhìn rất tốt 603 00:38:17,050 --> 00:38:20,860 bởi vì bạn có cơ sở dữ liệu tuyệt vời này, và nó truy vấn tìm kiếm siêu nhanh - 604 00:38:20,860 --> 00:38:26,130 đó là rất tốt - nhưng khi bạn đi đến nó, nó giống như một trang web năm 1990 với màu đỏ và màu xanh 605 00:38:26,130 --> 00:38:30,370 ở khắp mọi nơi, và đó là không tốt, hoặc. 606 00:38:30,370 --> 00:38:34,210 Chú ý rằng Ben và tôi làm việc như một đội bóng là rất tốt đẹp bởi vì tôi là loại hơn 607 00:38:34,210 --> 00:38:38,030 ở cuối phía trước, cả hai chúng tôi tương tác giữa cấp, và Ben là thực sự tốt với back-end công cụ, 608 00:38:38,030 --> 00:38:43,550 để hoạt động thực sự tốt bởi vì chúng tôi có thể thiết kế trang web bất kỳ và về cơ bản các lỗ 609 00:38:43,550 --> 00:38:47,580 trong trang web đó mà cần phải được lấp đầy có thể được lấp đầy bởi một trong hai chúng tôi, hoặc có thể cả hai. 610 00:38:47,580 --> 00:38:50,210 Bạn muốn chắc chắn rằng không có lỗ hổng trong nhóm của bạn. 611 00:38:50,210 --> 00:38:51,180 Không sao nếu có một chút của chồng lên nhau. 612 00:38:51,180 --> 00:38:53,670 Nói cách khác, nếu bạn có 2 người được cả hai tốt với kết thúc trở lại, 613 00:38:53,670 --> 00:38:57,250 có thể được tốt là tốt bởi vì họ có thể giúp đỡ lẫn nhau với các vấn đề 614 00:38:57,250 --> 00:38:58,820 mà họ đang có. 615 00:38:58,820 --> 00:39:02,590 Nó có thể là một vấn đề nếu bạn chỉ có 1 người chịu trách nhiệm cho một điều gì đó 616 00:39:02,590 --> 00:39:06,650 và họ chạy vào một vấn đề, do đó bạn muốn có một chút của chồng lên nhau 617 00:39:06,650 --> 00:39:10,760 nhưng quan trọng nhất là bạn muốn chắc chắn rằng tất cả các lỗ hổng có thể được lấp đầy. 618 00:39:10,760 --> 00:39:17,550 >> Điều cuối cùng - và điều này nên được rõ ràng, nhưng nó thường không. 619 00:39:17,550 --> 00:39:19,550 Bạn thực sự muốn được vui vẻ. 620 00:39:19,550 --> 00:39:23,360 Điểm của dự án cuối cùng này trong CS50 và thường là điểm phát triển web ở chung 621 00:39:23,360 --> 00:39:26,360 không phải là để chỉ làm một công việc bởi vì nó cần làm. 622 00:39:26,360 --> 00:39:29,140 Bạn thực sự muốn được vui vẻ, và bạn muốn được làm một cái gì đó 623 00:39:29,140 --> 00:39:31,180 đó là động cơ thúc đẩy bạn làm việc trên đó. 624 00:39:31,180 --> 00:39:33,650 Nếu bất cứ điều gì bạn đang làm là một nỗi đau để ngồi xuống và làm việc trên, 625 00:39:33,650 --> 00:39:35,650 sau đó bạn không lựa chọn các dự án đúng. 626 00:39:35,650 --> 00:39:37,730 Bạn muốn chọn một cái gì đó mà bạn thấy thú vị, 627 00:39:37,730 --> 00:39:41,150 bạn thực sự muốn xem kết quả, bạn đang vui mừng khi bạn nhận được một ý tưởng mới về 628 00:39:41,150 --> 00:39:44,700 một cái gì đó bạn có thể làm - do đó, có tất cả các loại dự án đó mà tôi chắc chắn 629 00:39:44,700 --> 00:39:47,290 bạn có thể tìm thấy - mọi người đều có một cái gì đó thực sự sẽ âm mưu chúng 630 00:39:47,290 --> 00:39:49,290 nếu họ đang làm một dự án dựa trên web. 631 00:39:49,290 --> 00:39:52,210 Tôi sẽ nói lại nó ngay bây giờ. 632 00:39:52,210 --> 00:39:54,520 Nếu dự án của bạn có vẻ như là một nỗi đau và bạn không muốn làm việc trên đó, 633 00:39:54,520 --> 00:39:57,260 chọn dự án khác. Chọn cái gì đó thực sự truyền cảm hứng cho bạn. 634 00:39:57,260 --> 00:40:00,260 >> Ben đã đề cập khái niệm này lặp đi lặp lại một chút, và tôi muốn đi qua nó một chút. 635 00:40:00,260 --> 00:40:08,250 Nó thực sự quan trọng để làm việc trong giai đoạn lớn, nơi bạn có được một cái gì đó chức năng. 636 00:40:08,250 --> 00:40:13,420 Nó có thể là tuyệt vời nếu bạn có kế hoạch này cho một trang web đó sẽ làm A, B, và C, 637 00:40:13,420 --> 00:40:16,000 và cuối cùng nó sẽ đến đó. 638 00:40:16,000 --> 00:40:18,600 Nhưng bạn đang mắc kẹt trong giai đoạn này, nơi bạn đang làm việc trên đó và làm việc trên nó, 639 00:40:18,600 --> 00:40:23,330 nhưng không có gì là nhận được thực hiện. Bạn không có bất cứ điều gì để xem và một điều chức năng hữu hình. 640 00:40:23,330 --> 00:40:27,940 Những gì bạn thực sự muốn làm nhiều như nó có vẻ như loại một nỗi đau đôi khi để 641 00:40:27,940 --> 00:40:32,300 làm việc trên một cái gì đó và sau đó sắp xếp của nắp nó đi để nó ít nhất là ở mức ổn định, chạy 642 00:40:32,300 --> 00:40:34,910 phiên bản thậm chí nếu nó không có tất cả các tính năng bạn muốn. 643 00:40:34,910 --> 00:40:37,690 Và có thể có một số tính năng mà bạn thực sự muốn thêm nhưng bạn chỉ có thể 644 00:40:37,690 --> 00:40:41,830 bởi vì bạn muốn để có được trang web này đến một điểm chức năng. 645 00:40:41,830 --> 00:40:44,400 Và do đó bạn muốn loại có quá trình phát triển toàn bộ trông như thế. 646 00:40:44,400 --> 00:40:47,810 Bạn muốn bắt đầu một nơi nào đó chức năng - hoặc về cơ bản bắt đầu với không có gì - 647 00:40:47,810 --> 00:40:49,890 nhưng bạn muốn để có được một nơi nào đó rất cơ bản và chức năng. 648 00:40:49,890 --> 00:40:54,940 Và sau đó một lần nữa, làm cho một loại nhảy và nhận được một nơi nào đó chức năng một lần nữa. 649 00:40:54,940 --> 00:40:59,190 Bạn sẽ từ từ xây dựng, và nó có thể đi chậm hơn một chút hơn nó sẽ khác, 650 00:40:59,190 --> 00:41:03,000 nhưng về lâu dài nếu bạn liên tục bị mắc kẹt trong giai đoạn giữa mặt đất này, nơi bạn 651 00:41:03,000 --> 00:41:06,380 không thực sự có bất cứ điều gì làm việc, nó có thể là một sự thất vọng thực sự lớn 652 00:41:06,380 --> 00:41:09,970 để làm việc trên dự án của bạn bởi vì bạn luôn luôn rất gần để nhận được nó làm việc, 653 00:41:09,970 --> 00:41:12,130 và nó không bao giờ thực sự làm việc. 654 00:41:12,130 --> 00:41:14,810 Bạn muốn làm việc trong những giai đoạn lớn chức năng, 655 00:41:14,810 --> 00:41:17,950 và bạn cũng muốn làm một số phản ánh sau khi mỗi người. 656 00:41:17,950 --> 00:41:21,260 Nói cách khác, một khi bạn đang ở một điểm mà các trang web đang làm việc - 657 00:41:21,260 --> 00:41:24,790 nó không có tất cả mọi thứ bạn thích nhưng nó có một số điều - 658 00:41:24,790 --> 00:41:28,870 bạn muốn suy nghĩ, được rồi, là trang web này hoàn thành các mục tiêu mà tôi đặt ra để làm gì? 659 00:41:28,870 --> 00:41:33,410 Nói cách khác, nếu trang web sẽ làm X, là những gì tôi đã làm việc theo hướng X? 660 00:41:33,410 --> 00:41:36,450 Có phải tất cả các chức năng mà tôi muốn có? 661 00:41:36,450 --> 00:41:39,340 Và hơn thế nữa, là nó phục vụ mục đích chung mà tôi muốn? 662 00:41:39,340 --> 00:41:43,200 Nếu bạn đang tìm kiếm trang web của bạn đang bắt đầu rẽ theo một hướng khác 663 00:41:43,200 --> 00:41:47,330 hoặc có thể điều chỉ là loại không làm việc ra, nó có thể là thời gian để sang số một chút. 664 00:41:47,330 --> 00:41:51,700 Nói cách khác, nó có giá trị xem xét - nó có giá trị ném ra những ý tưởng nếu cần thiết 665 00:41:51,700 --> 00:41:57,950 và xem xét tôi thực sự làm việc hướng tới những gì tôi muốn. 666 00:41:57,950 --> 00:42:00,760 >> Tôi tin rằng đó là điểm tiếp theo của tôi. Đừng sợ phải từ bỏ ý tưởng. 667 00:42:00,760 --> 00:42:03,750 Chỉ vì bạn đã dành rất nhiều thời gian làm việc trên một tính năng 668 00:42:03,750 --> 00:42:07,890 và cuối cùng đã nhận nó làm việc nhưng nó thực sự là không tốt đẹp như - 669 00:42:07,890 --> 00:42:12,690 như nó không phải là hữu ích hoặc người sử dụng đang gặp khó khăn sử dụng nó - mà loại điều - 670 00:42:12,690 --> 00:42:15,300 không ngại vứt nó đi. 671 00:42:15,300 --> 00:42:17,650 Nó hút mà bạn đã dành rất nhiều thời gian làm việc trên nó, 672 00:42:17,650 --> 00:42:21,870 nhưng cuối cùng bạn không muốn có một trang web đó là loại để cùng nhau bởi những mảnh 673 00:42:21,870 --> 00:42:25,380 sắp xếp công việc nhưng không phải là phục vụ tốt. 674 00:42:25,380 --> 00:42:27,990 Ngoài ra, không ngại ôm hôn những ý tưởng mới. 675 00:42:27,990 --> 00:42:30,050 Nếu một người nào đó xuất hiện và nói, hey, trang web có vẻ thực sự mát mẻ nhưng 676 00:42:30,050 --> 00:42:32,290 nó sẽ không thậm chí là tuyệt vời nếu nó cũng đã làm điều này? 677 00:42:32,290 --> 00:42:36,220 Chỉ vì đó là một cái gì đó mà bạn không có ý định và một cái gì đó mà không có trong bạn 678 00:42:36,220 --> 00:42:37,900 thông số kỹ thuật, một cái gì đó mà bạn đã không đặt ra để làm, 679 00:42:37,900 --> 00:42:40,860 không ngại mang nó về và sau đó làm việc với nó. 680 00:42:40,860 --> 00:42:43,680 Bởi vì thường những ý tưởng mà bạn chạy với trong suốt quá trình phát triển 681 00:42:43,680 --> 00:42:47,630 kết thúc được các tính năng thực sự mát mẻ của trang web. 682 00:42:47,630 --> 00:42:49,630 >> Tôi đã nói điều này trước đây. Tôi sẽ nói lại một lần nữa. 683 00:42:49,630 --> 00:42:51,630 Xét nghiệm siêu, siêu hữu ích. 684 00:42:51,630 --> 00:42:56,350 Cố gắng để có được những người chưa bao giờ thấy các trang web trước khi đăng nhập vào và xem những gì đang xảy ra 685 00:42:56,350 --> 00:42:59,080 bởi vì họ không chỉ có thể kiểm tra tính hữu ích của các trang web và trải nghiệm người dùng, 686 00:42:59,080 --> 00:43:02,070 nhưng họ cũng có thể kiểm tra các chức năng trong những cách mà bạn có thể không. 687 00:43:02,070 --> 00:43:06,430 Nếu bạn thực hiện một số tính năng mà không một điều nào đó 688 00:43:06,430 --> 00:43:11,620 và bạn biết điều đó sẽ làm điều đó một cách chính xác cùng một điều mỗi lần duy nhất, đó là tuyệt vời. 689 00:43:11,620 --> 00:43:16,610 Nhưng nó thường có thể được khó khăn để chiếm trường hợp góc, nơi một sức mạnh người sử dụng 690 00:43:16,610 --> 00:43:19,500 gõ một cái gì đó mà bạn không mong muốn - một cách chính xác bởi vì bạn xác định 691 00:43:19,500 --> 00:43:21,500 các tính năng chính mình. 692 00:43:21,500 --> 00:43:23,730 Vì vậy, để có một người nào đó đi trên những người không có ý tưởng làm thế nào để sử dụng trang web 693 00:43:23,730 --> 00:43:26,840 và chỉ cần phá vỡ nó trong bất cứ cách thức mà họ có thể làm là thực sự hữu ích bởi vì bạn 694 00:43:26,840 --> 00:43:30,340 được một ý tưởng từ một quan điểm hoàn toàn khác nhau về những gì trên trang web của bạn đang làm việc 695 00:43:30,340 --> 00:43:33,300 và những gì cần sửa chữa. 696 00:43:33,300 --> 00:43:37,070 >> Cuối cùng, tôi sẽ nói về một số thông lệ tốt chung, 697 00:43:37,070 --> 00:43:42,470 và bạn đã nhìn thấy rất nhiều trong số này trong CS50, nhưng họ cũng thực sự, thực sự áp dụng trong một thiết lập dự án. 698 00:43:42,470 --> 00:43:47,600 Một là ý kiến. Luôn luôn nhận xét mã của bạn đặc biệt là nếu bạn đang làm việc trên một đội bóng lớn. 699 00:43:47,600 --> 00:43:51,230 Nó có thể được như vậy gây phiền nhiễu để chỉ có một khối khổng lồ mã mà một người nào đó được viết 700 00:43:51,230 --> 00:43:54,230 và có thể nó hoạt động, có thể không, nhưng bạn không có ý tưởng những gì nó làm, 701 00:43:54,230 --> 00:43:58,010 vì vậy bạn không có ý tưởng cho dù đó là hữu ích hay không hay nó nên được có hay không, 702 00:43:58,010 --> 00:44:00,200 và nếu bạn đang làm việc trên cái gì khác nó thậm chí còn có thể là bạn đang làm việc trên 703 00:44:00,200 --> 00:44:06,590 điều tương tự, vì vậy chỉ cần rất, rất cẩn thận để được ân cần của các đồng nghiệp của bạn 704 00:44:06,590 --> 00:44:09,710 và viết mã đó là tài liệu tốt. 705 00:44:09,710 --> 00:44:13,580 Bạn không cần phải đi xa như vậy để làm toàn bộ điều đó nếu bạn muốn tăng 706 00:44:13,580 --> 00:44:16,620 một truy cập có một bình luận nói rằng, tôi thêm 1 để truy cập này. 707 00:44:16,620 --> 00:44:20,450 Nó không phải là chi tiết, nhưng cho bất kỳ chức năng mà bạn đã bao giờ viết 708 00:44:20,450 --> 00:44:23,160 bạn cần phải có một số tài liệu về những gì chức năng mà chính xác không, 709 00:44:23,160 --> 00:44:25,140 những đầu vào của nó, và những gì nó phải trả lại. 710 00:44:25,140 --> 00:44:27,800 Bằng cách đó bạn có thể sử dụng các thành phần của người khác của trang web 711 00:44:27,800 --> 00:44:31,990 và bạn có thể làm việc hướng tới xây dựng một cái gì đó lớn. 712 00:44:31,990 --> 00:44:34,100 >> Một điều quan trọng là bạn muốn làm sạch thường xuyên-up. 713 00:44:34,100 --> 00:44:40,490 Mã bị lộn xộn. Không cảm thấy xấu nếu mã của bạn chỉ là hoàn toàn không thể đọc được và một mớ hỗn độn khổng lồ. 714 00:44:40,490 --> 00:44:42,770 Điều đó xảy ra trong phát triển web luôn. 715 00:44:42,770 --> 00:44:46,530 Bạn đang thêm tính năng mới, loại bỏ những cái cũ. Thứ là có được có đó không phải là. 716 00:44:46,530 --> 00:44:49,330 Đó là tốt, nhưng bạn muốn chắc chắn rằng để đối phó với điều đó thường xuyên. 717 00:44:49,330 --> 00:44:53,430 Bạn không muốn để cho nó xây dựng lên đến điểm mà bạn không thể tìm thấy bất cứ điều gì 718 00:44:53,430 --> 00:44:56,430 trong mã của bạn, và bạn không có ý tưởng gì bất cứ điều gì không. 719 00:44:56,430 --> 00:44:58,430 Đó là trường hợp với HTML. 720 00:44:58,430 --> 00:44:59,490 Đôi khi bạn sẽ kết thúc với các đối tượng không chứa bất cứ điều gì, 721 00:44:59,490 --> 00:45:01,320 và bạn sẽ muốn thoát khỏi những. 722 00:45:01,320 --> 00:45:04,610 Trong CSS, bạn có thể được đề cập đến yếu tố không còn ở đó nữa, 723 00:45:04,610 --> 00:45:06,340 do đó bạn muốn thoát khỏi mã. 724 00:45:06,340 --> 00:45:09,900 Trong JavaScript, bạn có thể loại bỏ một cái gì đó từ HTML. 725 00:45:09,900 --> 00:45:13,150 Vì vậy, bạn muốn chắc chắn rằng bạn đang luôn luôn làm sạch, làm những điều khá 726 00:45:13,150 --> 00:45:17,450 nhiều như bạn có thể vào một cách thường xuyên. 727 00:45:17,450 --> 00:45:21,060 >> Một điều thực sự hữu ích mà tôi không nghĩ được trình bày rất nhiều trong CS50 728 00:45:21,060 --> 00:45:23,430 nhưng nó có giá trị nhận được vào là điều khiển phiên bản. 729 00:45:23,430 --> 00:45:27,180 Ý tưởng về điều khiển phiên bản là khi bạn về cơ bản theo dõi của tất cả các tiến bộ 730 00:45:27,180 --> 00:45:30,820 bạn đã thực hiện đối với trang web của bạn và nếu bất cứ lúc nào bạn nhận ra, oh, điều này đã làm việc 731 00:45:30,820 --> 00:45:35,220 trong khi trước đây nhưng nó không làm việc nữa, bạn có thể quay trở lại phiên bản trước 732 00:45:35,220 --> 00:45:37,720 và xem những gì đã thay đổi kể từ đó và đại loại như vậy. 733 00:45:37,720 --> 00:45:41,670 Cách chính để làm điều đó là với Git, và Git là toàn bộ loại này của hệ thống đó 734 00:45:41,670 --> 00:45:46,390 Tôi tin rằng Tommy MacWilliam cho một cuộc hội thảo về năm ngoái. 735 00:45:46,390 --> 00:45:51,520 Nếu bạn đi vào các cuộc hội thảo CS50 năm 2011, bạn có thể nhìn thấy buổi nói chuyện về điều đó. 736 00:45:51,520 --> 00:45:57,070 Ý tưởng của Git là cơ bản mà đều đặn bạn đang làm cho các cam kết 737 00:45:57,070 --> 00:46:01,430 đó là cách nói trang web là trong một phiên bản khá ổn định ngay bây giờ để 738 00:46:01,430 --> 00:46:05,910 Tôi đóng gói nó lên và gửi nó đi đến một máy chủ, và sau đó bạn có thể vào máy chủ 739 00:46:05,910 --> 00:46:07,910 và xem xét tất cả các phiên bản trước của mã của bạn và xem nó như thế nào tiến triển 740 00:46:07,910 --> 00:46:12,210 và tất cả những loại công cụ tốt. 741 00:46:12,210 --> 00:46:14,210 Vì vậy, đó là về cơ bản nó. 742 00:46:14,210 --> 00:46:17,870 Theo như phát triển web, chúng tôi vui mừng thanh xung quanh và trả lời bất kỳ 743 00:46:17,870 --> 00:46:20,570 câu hỏi như xa như trình bày của chúng tôi. 744 00:46:20,570 --> 00:46:22,900 Đó là nó. Cảm ơn. >> [Ben] Cảm ơn. 745 00:46:22,900 --> 00:46:28,480 [Vỗ tay] 746 00:46:28,480 --> 00:46:30,950 >> [Billy] Nhân viên, không ai có thắc mắc về những điều mà chúng tôi đã được bảo hiểm 747 00:46:30,950 --> 00:46:33,950 hoặc những điều mà chúng tôi đã không được bảo hiểm rằng họ đã hy vọng chúng tôi bao gồm? 748 00:46:33,950 --> 00:46:35,950 Chúng tôi muốn được hạnh phúc để trả lời những người. Bất cứ ai? 749 00:46:35,950 --> 00:46:50,360 [Khán giả] ưu và nhược điểm của việc sử dụng Ruby hay Python sử dụng là gì? 750 00:46:50,360 --> 00:46:58,660 [Ben] Câu hỏi đặt ra là, những ưu và khuyết điểm của việc sử dụng Ruby hay Python là gì 751 00:46:58,660 --> 00:46:59,900 thay vì như PHP. 752 00:46:59,900 --> 00:47:11,340 Những thuận là Ruby và Python là ngôn ngữ tốt hơn nhiều so với PHP. 753 00:47:11,340 --> 00:47:14,920 Ít nhất là trong quan điểm của tôi, và tôi nghĩ rằng trong rất nhiều ý kiến ​​của người khác là tốt. 754 00:47:14,920 --> 00:47:20,990 Chúng được thiết kế nhiều hơn để làm công cụ phức tạp, 755 00:47:20,990 --> 00:47:25,380 và ít hơn cho cùng chia nhau phần các trang web thực sự nhanh chóng với 756 00:47:25,380 --> 00:47:28,400 một chút nội dung động. 757 00:47:28,400 --> 00:47:35,180 Các khuyết điểm là rằng có một chút - có nhiều hơn một đường cong học tập 758 00:47:35,180 --> 00:47:37,220 để có được họ thiết lập. 759 00:47:37,220 --> 00:47:41,010 Đó là, như trong PHP, bạn chỉ có thể có một tập tin HTML và bạn viết ít hơn, 760 00:47:41,010 --> 00:47:43,060 dấu hỏi, và sau đó bạn viết một số mã, và sau đó bạn viết dấu hỏi, 761 00:47:43,060 --> 00:47:45,700 lớn hơn, và sau đó bạn đã thực hiện xong. 762 00:47:45,700 --> 00:47:50,300 Trong các ngôn ngữ khác như Ruby hay Python, 763 00:47:50,300 --> 00:47:56,810 bạn phải đi qua làm việc nhiều hơn một chút để có được những trang web đang chạy ban đầu. 764 00:47:56,810 --> 00:48:02,730 Ngoài ra còn có - ít nhất là nó được sử dụng phải là trường hợp - đó có tài liệu nhiều hơn 765 00:48:02,730 --> 00:48:05,480 có sẵn cho PHP chỉ vì có nhiều người sử dụng nó. 766 00:48:05,480 --> 00:48:09,370 Tôi nghĩ rằng đó không phải là nhiều của một vấn đề nữa. 767 00:48:09,370 --> 00:48:12,520 Có chắc chắn tài liệu rất tốt cho các công cụ như Ruby on Rails 768 00:48:12,520 --> 00:48:16,080 hoặc Django cho Python là tương đương. 769 00:48:16,080 --> 00:48:25,910 PHP là một trong đó mọi người được sử dụng trong nhiều năm, và bạn biết làm thế nào nó hoạt động. 770 00:48:25,910 --> 00:48:28,460 Ruby và Python là ít hơn một chút trưởng thành. 771 00:48:28,460 --> 00:48:33,130 >> [Khán giả] Nếu bạn đã phải lựa chọn giữa một trong số họ để tìm hiểu hoặc nhận, 772 00:48:33,130 --> 00:48:36,130 mà bạn muốn? 773 00:48:36,130 --> 00:48:38,870 Thành thật mà nói, tôi nghĩ rằng điều đó phụ thuộc vào mỗi người. 774 00:48:38,870 --> 00:48:45,450 Tôi xin lỗi. Câu hỏi đặt ra là bạn sẽ chọn ai đó để học hỏi? 775 00:48:45,450 --> 00:48:50,230 Tôi tìm thấy Python đẹp nhất cá nhân. 776 00:48:50,230 --> 00:48:55,360 Có rất nhiều người đã - tôi đã làm dự án dev web đầu tiên của tôi trong Python và Django. 777 00:48:55,360 --> 00:49:00,300 Có rất nhiều người thích Ruby on Rails cũng có. 778 00:49:00,300 --> 00:49:02,650 Có lẽ nhiều người biết Ruby on Rails. 779 00:49:02,650 --> 00:49:05,270 Thành thật mà nói, tôi sẽ chỉ đi với bất cứ điều gì những người xung quanh bạn biết 780 00:49:05,270 --> 00:49:09,680 để bạn có những người đặt câu hỏi. 781 00:49:19,640 --> 00:49:24,170 >> Câu hỏi đặt ra là - trên các máy chủ chia sẻ là nó rất khó để làm việc trên Python? 782 00:49:24,170 --> 00:49:26,170 Điều đó phụ thuộc vào lưu trữ của bạn. 783 00:49:26,170 --> 00:49:29,400 Có một số máy chủ web sẽ gửi Python thứ. 784 00:49:29,400 --> 00:49:31,400 WebFaction nào đó, phải không? 785 00:49:31,400 --> 00:49:34,400 WebFaction là một trong đó Billy và tôi đã sử dụng cho một số dự án. 786 00:49:34,400 --> 00:49:37,750 Họ thực sự tuyệt vời. Họ hỗ trợ hầu hết các ngôn ngữ. 787 00:49:37,750 --> 00:49:40,020 Nhưng đó là sự thật rằng PHP là nhiều hỗ trợ rộng rãi hơn. 788 00:49:40,020 --> 00:49:45,210 Vì vậy, nếu bạn đang bị mắc kẹt trên một máy chủ web mà chỉ làm PHP, đó là một lý do tốt để sử dụng PHP. 789 00:49:45,210 --> 00:49:56,010 >> [Khán giả thành viên] Tôi chỉ có vào học làm thế nào để truy vấn một số cơ sở dữ liệu, 790 00:49:56,010 --> 00:50:00,680 và tôi biết SQL của tôi là tất cả các nơi, nhưng tôi gần đây đã tiếp xúc với - 791 00:50:00,680 --> 00:50:04,470 và bạn đã chỉ ra. Bạn nhìn thấy JSON và cơ sở dữ liệu mở rộng. 792 00:50:04,470 --> 00:50:14,580 SQL của tôi vẫn còn ở khắp mọi nơi. Làm thế nào để bạn nhìn thấy điều đó xảy ra? 793 00:50:14,580 --> 00:50:21,330 Có sẽ là một xu hướng ngày càng tăng về mở rộng hơn (không nghe được)? 794 00:50:21,330 --> 00:50:30,100 Câu hỏi đặt ra là - Tôi nghĩ rằng có sẽ là một xu hướng cơ sở dữ liệu không SQL. 795 00:50:30,100 --> 00:50:33,850 Ví dụ, như MongoDB. Tôi nghĩ rằng chắc chắn là đúng. 796 00:50:33,850 --> 00:50:38,730 Lời khuyên của tôi đã được chủ yếu là mySQL liên quan đến đây chỉ vì mySQL là 797 00:50:38,730 --> 00:50:40,950 tiêu chuẩn công nghiệp. 798 00:50:40,950 --> 00:50:45,950 Cá nhân, tôi rất thích cơ sở dữ liệu mà không có schemos như MongoDB 799 00:50:45,950 --> 00:50:49,520 nơi bạn không có vấn đề, oh, tôi cần phải thêm cột khác. 800 00:50:49,520 --> 00:50:51,600 Khốn nạn cho tôi, như tôi phải làm bất cứ điều gì? 801 00:50:51,600 --> 00:50:55,840 Nó rất khó để làm điều đó trên mySQL, nhưng khi bạn có một cái gì đó như Mongo 802 00:50:55,840 --> 00:50:57,840 nó đẹp hơn nhiều. 803 00:50:57,840 --> 00:51:03,780 Những điều tốt đẹp khác về Mongo là hồ sơ của bạn thực sự là đối tượng JavaScript. 804 00:51:03,780 --> 00:51:10,110 Không có loại bước chuyển đổi mà bạn cần phải có những cơ sở dữ liệu hàng 805 00:51:10,110 --> 00:51:13,140 và biến chúng thành một đối tượng JavaScript và sau đó gửi chúng qua dây dẫn. 806 00:51:13,140 --> 00:51:20,290 Tôi nghĩ rằng công cụ như thế là có được rất, rất hữu ích cho phát triển web nhanh chóng trong tương lai. 807 00:51:20,290 --> 00:51:23,060 >> [Billy] Một cái gì đó tôi sẽ thêm mà chỉ là một điểm chung là 808 00:51:23,060 --> 00:51:26,580 không cảm thấy như bạn nên đã học được tất cả các ngôn ngữ chúng tôi đã thảo luận 809 00:51:26,580 --> 00:51:28,580 từ hội thảo của chúng tôi. 810 00:51:28,580 --> 00:51:30,560 Rõ ràng điểm này là để cung cấp cho bạn một ý tưởng về những gì trên mạng, 811 00:51:30,560 --> 00:51:33,450 và nếu bạn đang bị hấp dẫn bởi bất kỳ trong những điều chúng tôi đã đề cập, bạn có thể Google chúng 812 00:51:33,450 --> 00:51:35,830 và đọc lên trên chúng. 813 00:51:35,830 --> 00:51:38,750 Và như tôi đã đề cập, có một vài cuộc hội thảo mà đối phó với chính xác những điều này. 814 00:51:38,750 --> 00:51:41,660 Thậm chí còn có nhiều buổi hội thảo mà tôi đã không đề cập đến việc có thể nhận được vào 815 00:51:41,660 --> 00:51:43,660 công cụ này là tốt. 816 00:51:43,660 --> 00:51:46,610 Ý tưởng là nếu bạn muốn làm việc trên một cái gì đó, đây là những công cụ theo ý của bạn. 817 00:51:46,610 --> 00:51:51,630 Không cảm thấy choáng ngợp nếu bạn không thực sự chắc chắn những gì các công cụ thực hiện chính xác, 818 00:51:51,630 --> 00:51:54,830 nhưng biết rằng họ đang ra khỏi đó và bạn có thể làm cho sử dụng rộng rãi trong số họ 819 00:51:54,830 --> 00:51:56,830 bởi Google. 820 00:51:56,830 --> 00:51:59,960 >> [Khán giả] Những loại những thứ bạn cần phải làm để đảm bảo trang web của bạn 821 00:51:59,960 --> 00:52:02,530 có vẻ tốt trên các thiết bị di động? 822 00:52:02,530 --> 00:52:05,590 [Billy] các thiết bị di động là một chút khó khăn. 823 00:52:05,590 --> 00:52:07,590 Có 2 cách bạn có thể tiếp cận nó. 824 00:52:07,590 --> 00:52:11,500 Cách thứ nhất là bạn thực sự có một trang web di động. 825 00:52:11,500 --> 00:52:14,660 Nói cách khác, bạn thực hiện một số loại phát hiện ngay từ đầu 826 00:52:14,660 --> 00:52:18,830 khi trình duyệt đưa ra yêu cầu đến trang web của bạn mà sẽ nói: 827 00:52:18,830 --> 00:52:25,240 trở về điểm này - đó sẽ là xem cho máy tính để bàn hoặc máy tính xách tay các trình duyệt - 828 00:52:25,240 --> 00:52:27,710 và xem khác cho các thiết bị di động. 829 00:52:27,710 --> 00:52:33,090 Đó là một nơi mà quan điểm là thực sự tốt đẹp trong đó bạn có thể khá nhiều trao đổi các 830 00:52:33,090 --> 00:52:37,580 hai ra ngoài và có một giao diện làm việc thực sự độc đáo trên các thiết bị di động 831 00:52:37,580 --> 00:52:40,770 và có một hoàn toàn khác nhau mà công trình độc đáo trên các thiết bị trình duyệt. 832 00:52:40,770 --> 00:52:43,770 Vấn đề với đó là phải mất một thời gian dài bởi vì nó có nghĩa là mã hóa 833 00:52:43,770 --> 00:52:47,060 một giao diện hoàn toàn khác nhau. 834 00:52:47,060 --> 00:52:49,720 Một cách khác mà bạn có thể làm điều đó là - 835 00:52:49,720 --> 00:52:55,250 rất nhiều điện thoại hiện đại sẽ hiển thị các trang web và cố gắng làm cho họ như là một trình duyệt sẽ, 836 00:52:55,250 --> 00:52:57,680 và họ làm tốt nhất của họ. 837 00:52:57,680 --> 00:53:04,340 Bạn có thể loại cố gắng để ở ánh sáng vào lượng jQuery JavaScript bạn đang sử dụng 838 00:53:04,340 --> 00:53:07,360 mà có xu hướng được nơi mà mọi thứ có thể đi sai một chút. 839 00:53:07,360 --> 00:53:13,430 Đây là loại cách mà bạn nên sử dụng nếu bạn không có nhiều thời gian. 840 00:53:13,430 --> 00:53:18,540 Nếu bạn không có thời gian để làm việc trên một giao diện điện thoại di động, mà rõ ràng là lựa chọn tốt nhất của bạn. 841 00:53:18,540 --> 00:53:23,320 >> Tôi nghĩ rằng nói chung cho các dự án CS50, bạn sẽ muốn chọn một hay khác. 842 00:53:23,320 --> 00:53:27,990 Nói cách khác, bạn muốn làm một ứng dụng điện thoại di động hoặc bạn muốn tạo một trang web máy tính để bàn. 843 00:53:27,990 --> 00:53:32,200 Và sắp xếp của quyết định nơi bạn đi với điều đó. 844 00:53:32,200 --> 00:53:35,360 Nhưng nếu bạn muốn mở rộng nó ra sau đó, có thể đặt cược tốt nhất của bạn là 845 00:53:35,360 --> 00:53:37,360 để thực hiện một giao diện cho người kia. 846 00:53:51,650 --> 00:53:56,340 Tôi có một chút kinh nghiệm trong việc phát triển các trang web dựa trên WordPress. 847 00:53:56,340 --> 00:53:58,670 Tôi đã tổ chức một trang web cá nhân trên WordPress cho một lúc. 848 00:53:58,670 --> 00:54:02,310 Các loại của các khuôn khổ có thể được tốt đẹp mọi thứ chỉ là rất cơ bản. 849 00:54:02,310 --> 00:54:07,050 Thông thường bạn sẽ chỉ chạy vào rất nhiều vấn đề tùy biến mặc dù. 850 00:54:07,050 --> 00:54:10,940 Bạn sẽ muốn có một cái gì đó tìm một cách nào đó hoặc là một cách nhất định 851 00:54:10,940 --> 00:54:14,510 và bạn chỉ cần không có thể bởi vì nó cứng có dây vào hệ thống mà 852 00:54:14,510 --> 00:54:17,480 đây là cách bạn phải làm những việc mà có thể là một chút của một vấn đề. 853 00:54:17,480 --> 00:54:22,020 Kể từ đó tôi đã loại được nghiêng nhiều hơn để làm việc với các trang web từ mặt đất lên. 854 00:54:22,020 --> 00:54:26,840 Cho những thứ như cơ sở dữ liệu blog và đại loại như vậy nó thực sự không phải là khó để xây dựng một khuôn khổ. 855 00:54:26,840 --> 00:54:29,970 Nếu bạn đang thực sự kéo dài thời gian, bạn có thể sử dụng tất nhiên cái gì đó như WordPress 856 00:54:29,970 --> 00:54:33,120 hay đại loại như vậy cho một blog. 857 00:54:33,120 --> 00:54:38,790 Các loại điều mà các blog lưu trữ và làm không phải là thực sự khó khăn đủ mà 858 00:54:38,790 --> 00:54:41,500 nếu bạn đang chạy vào bất kỳ của những loại của sự vật, có lẽ bạn đang tốt nhất chỉ để 859 00:54:41,500 --> 00:54:43,500 thực hiện một phiên bản trong nhà. 860 00:54:43,500 --> 00:54:48,350 >> Tôi nghĩ rằng đó là về nó, do đó, nhờ một lần nữa cho tới. 861 00:54:48,350 --> 00:54:51,960 Chúng tôi thật sự rất thích nói chuyện với các bạn và hy vọng rằng bạn đã học được một số công cụ. 862 00:54:51,960 --> 00:54:55,350 [Ben] Chúng tôi vui mừng nói - chúng tôi phải đi nhưng chúng tôi vui mừng nói chuyện bên ngoài hơn 863 00:54:55,350 --> 00:55:01,650 nếu bạn có một câu hỏi. Nhờ một lần nữa. [Vỗ tay] 864 00:55:03,750 --> 00:55:06,000 [CS50.TV]