Tài nguyên dành cho nhà phát triển web Một phần tổng hợp lớn

Internet không ngừng phát triển và có hàng trăm ngàn tài nguyên tập thể cho các nhà phát triển web sắp tới. Từ các bài viết trực tuyến, hướng dẫn, công cụ, hướng dẫn, cho đến video, bạn có thể tìm hiểu mọi thứ qua Web. Nó thực sự chưa bao giờ dễ dàng hơn để nhảy trực tuyến!

Dưới đây tôi đã tập hợp một bộ sưu tập lớn các tài nguyên dành cho nhà phát triển web rất hữu ích. Chúng bao gồm tài liệu dành cho người mới bắt đầu cho HTML5 / CSS3 cùng với các lý thuyết phức tạp hơn về lập trình JavaScript và PHP. Một vài nhà phát triển nhiệt tình có thể nghiên cứu các ngôn ngữ này và xây dựng các ứng dụng web cực kỳ phổ biến tương tự như Twitter hoặc Tumblr. Nếu bạn có hứng thú với các tài sản hữu ích cho các nhà phát triển web hiện đại thì bạn sẽ thích phần tổng hợp các tài nguyên đáng tin cậy này.

Tạp chí trực tuyến hữu ích

Thế giới blog đã bùng nổ với hàng trăm ngàn nhà văn mới tham gia Internet. Nhiều trong số các blog trực tuyến này tập trung vào thiết kế và phát triển web. Bạn có thể tìm thấy rất nhiều tài nguyên hữu ích bằng cách chỉ cần lướt qua các nguồn cấp RSS này.

Tùy thuộc vào loại ngôn ngữ bạn mã, nó sẽ xác định mối quan tâm của bạn đối với bất kỳ blog nào trong số này. Chúng tôi có thể tập trung vào phát triển web và giả định điều này bao gồm tất cả các công việc mặt trước (HTML5 / CSS3 / JavaScript) cũng như các tập lệnh phụ trợ đơn giản (PHP / RoR / Python / SQL). Tôi đã được tự do xây dựng một danh sách duy nhất các blog dev phổ biến nhất tập trung vào cả mã front-end và back-end.

Cây tầm ma+
24 cách
Webmonkey
Đập vỡ mã hóa
Kiến trúc sư
Kiểm tra nguyên tố
Mèo Ai Mã
Blog thiết kế web Line25

Chắc chắn có nhiều người khác để xem xét. Tôi khuyên bạn nên nhấn Google để tìm kiếm các hướng dẫn và bài viết về ngôn ngữ nhà phát triển ưa thích của bạn. Sau đó, sử dụng trình tổng hợp nguồn cấp dữ liệu RSS như Google Reader, bạn có thể thiết lập danh sách tất cả các bài viết mới nhất từ các tạp chí này. Đây là một cách tuyệt vời để bắt đầu ngày làm việc của bạn, hoặc thậm chí để giết một chút thời gian chu đáo thông qua các hướng dẫn.

Plugins Galore

Cả thư viện lõi jQuery và jQuery Mobile đã đạt được rất nhiều lực kéo trong năm qua. Các thư viện mã nguồn mở này hoạt động để thiết kế trải nghiệm mặt trước đầy đủ hoạt hình phong phú và các tính năng Ajax dễ thực hiện, mặc dù thư viện di động đã không bắt kịp với cha mẹ của nó về các plugin và mã của bên thứ ba.

Tương tự, một sản phẩm tuyệt vời khác bgStretcher có thể được sử dụng làm tập lệnh nền động. Nó sẽ lấy một loạt hình ảnh và một số tỷ lệ kích thước tỷ lệ thuận với độ phân giải màn hình của người dùng của bạn. Kiểm tra bản demo tuyệt vời để thấy điều này trong hành động. Cả hai plugin này đều miễn phí để tải xuống và hoạt động như các ví dụ đơn giản cho mã bên thứ 3 tuyệt vời được tạo ra từ jQuery. Làm việc với các tài nguyên này sẽ giúp bạn tiết kiệm rất nhiều thời gian cho công việc dự án để bạn không phải phát minh lại bánh xe.

Nói chung, tôi cũng khuyên bạn nên duyệt các trang web Ajax Blender và Dynamic Drive để tìm các đoạn mã / plugin JavaScript. Thư viện không lớn nhưng nó liên tục phát triển từ nội dung mới do người dùng gửi. Các trang web không chỉ bao gồm các plugin jQuery mà còn các thư viện MooTools và Prototype.

Nếu bạn kết thúc làm việc với thư viện jQuery Mobile, tôi muốn giới thiệu một công cụ khác jqmPhp. Đó là một lớp PHP động, nơi bạn có thể tham chiếu các hàm đơn giản để xuất các dòng và dòng mã HTML5 được cung cấp thông qua jQuery Mobile. Đây thực sự là cách dễ nhất để tạo nguyên mẫu cho các ứng dụng di động được xây dựng xung quanh trình bao PHP. Blog trang web có rất nhiều tài liệu tham khảo ví dụ để tìm hiểu kỹ.

Xây dựng trong HTML5 & CSS3

Khi chúng ta nói về phát triển web front-end, nói chung tất cả là về hiệu quả. Bạn không gặp vấn đề tương tự khi xây dựng một trang web bằng HTML / CSS như bạn sẽ mã hóa một ứng dụng Ruby phụ trợ. Không có logic thực sự hoặc xử lý lỗi trong HTML - chủ yếu là về việc bạn có thể chia tỷ lệ thiết kế bố trí đúng cách trong tất cả các trình duyệt.

Đầu tiên tôi phải bắt đầu bằng cách giới thiệu HTML5 Boilerplate. Đây là một mẫu xương trần bị tước bao gồm tất cả “Tiêu chuẩn” Các yếu tố trang web HTML5 trong một gói. Điều này bao gồm biểu định kiểu mặc định, JavaScript, favicon, biểu tượng cảm ứng của Apple và nhiều tính năng khác. Đây là một dự án miễn phí 100% và bạn thậm chí có thể đóng góp vào repo Github của họ. Đây là tài nguyên bắt buộc phải có cho tất cả các nhà phát triển trước khi bắt đầu bất kỳ dự án web nghiêm túc nào.

Bây giờ nếu bạn làm việc với bản tóm tắt này thì bạn có tùy chọn thêm tất cả mã tùy chỉnh của riêng bạn. Nhưng tôi khuyên bạn nên thực hiện bước tiếp theo và xây dựng với một ứng dụng như Initializr. Điều này sẽ tạo ra một bố cục trang web điển hình và thậm chí cho phép bạn tùy chỉnh các yếu tố được bao gồm trong gói soạn sẵn. Mã Google Analytics, các tệp jQuery, .htaccess hoặc web.config đã rút gọn, cùng với khoảng một chục tùy chọn khác có sẵn.

Nhà thiết kế CSS

Bây giờ chúng ta đã xem xét một chút về mã hóa HTML5, chúng ta cũng nên xem xét một số khung CSS3 phổ biến. Đây là những kết thúc mở hơn các mẫu HTML vì bạn có thể làm được nhiều hơn với CSS. Các nhà thiết kế cũng sẽ nhận ra những khó khăn trong việc xây dựng mã tuân thủ tiêu chuẩn cho tất cả các trình duyệt web hiện đại.

Hệ thống lưới vàng là tuyệt vời như một khung trên các thiết kế web đáp ứng. Các bố cục này sẽ thích ứng với màn hình di động và gập vào trong khi bạn thay đổi kích thước cửa sổ trình duyệt. Nó cũng giúp lập kế hoạch chiều rộng và kích thước của từng khu vực cột. Blueprint là một khung CSS tiện dụng khác mà bạn nên kiểm tra. Thật tuyệt vời khi xây dựng các trang web tùy chỉnh và cung cấp tài liệu tuyệt vời.

Tuy nhiên, khi nói đến các công cụ CSS, CSS3 PIE phải nằm trong ba mục yêu thích hàng đầu của tôi. Đây là một ứng dụng web đơn giản cung cấp mã phù hợp để hiển thị các hiệu ứng CSS3 được hỗ trợ trong Internet Explorer 6-9. Bạn có thể tạo độ dốc tuyến tính động, góc tròn và bóng hộp với các cài đặt tùy chỉnh. Trang web có các ví dụ về IE nếu bạn cũng muốn kiểm tra chúng.

Các nhà phát triển cũng sẽ tìm cách giảm kích thước tập tin của họ để sản xuất. Clean CSS là một tài nguyên nơi bạn có thể chọn từ nhiều tùy chọn để đơn giản hóa mã của mình và giảm kích thước tệp. Một công cụ làm đẹp mã thay thế khác không cung cấp nhiều tùy chọn nhưng có thể dễ sử dụng hơn.

Tùy chỉnh chủ đề với WordPress

Xuất bản WordPress dễ dàng là CMS phổ biến nhất trong thời đại này. Chúng tôi đã thấy có thể hàng triệu blog và trang web mới được cung cấp bởi giải pháp quản lý nội dung tuyệt vời này. Và vì các nhà phát triển WordPress như vậy đang có nhu cầu cao trong việc xây dựng các widget và chủ đề trang web tùy chỉnh.

Bản phát hành mới của Constname Theme mang đến cho các nhà phát triển WordPress một điểm khởi đầu dễ dàng hơn các mẫu mặc định. Chủ đề Twenty Eleven mới rất xảo quyệt và tối giản, nhưng nó không thể cạnh tranh với toàn bộ mẫu chủ đề được xây dựng dựa trên HTML5Boilerplate. Chủ đề Constname WP thậm chí bao gồm các truy vấn phương tiện cho các độ phân giải thiết bị khác nhau như máy tính bảng iPhone và iPad.

Wonderflux là một mẫu chủ đề WordPress khác không quá xa trong quá trình phát triển. Nó mới được phát hành gần đây từ phiên bản beta thành v1.0 cùng với một số tài liệu trực tuyến. Chủ đề này phức tạp hơn một chút so với Chòm sao cho phép bạn kiểm soát bố cục nhiều hơn. Các nhà phát triển đã bao gồm các móc, hàm và bộ lọc PHP tùy chỉnh để làm cho trang web WordPress của bạn năng động hơn.

Các nhà phát triển WP nghiêm túc nên kiểm tra cả hai giải pháp để xem liệu một trong hai sẽ giúp ích cho công việc dự án trong tương lai.

Tìm kiếm các nhà phát triển web miễn phí

So với PSD và đồ họa, cộng đồng phát triển web có vẻ hơi thiếu các phòng trưng bày miễn phí. Bạn luôn có thể tìm thấy các tập lệnh tuyệt vời trên Github, nhưng bạn sẽ thường phải tìm kiếm xung quanh và tự mình kiểm tra chúng.

Thật khó để tìm thấy các trang web cung cấp tải xuống và trình diễn miễn phí cũng như các ví dụ về tập lệnh. Tài nguyên mới yêu thích của tôi là CodeVisally, danh mục các công cụ phát triển, plugin, thư viện và những thứ gọn gàng khác do người dùng gửi. Bố cục được thiết lập giống như một thư viện trong đó mỗi trang bao gồm một liên kết đến sản phẩm, ảnh chụp màn hình demo và một số chi tiết khác.

Bộ sưu tập bao gồm hàng trăm ví dụ về mã mẫu HTML / HTML5, thư viện CSS3 và chắc chắn cũng có rất nhiều công cụ jQuery. Tôi cũng thấy đây là một trang web tuyệt vời để gửi mã nguồn mở của riêng bạn tới công chúng. Tên của bạn được gắn với trình, ngoài ra bạn có thể đặt liên kết đến trang web của riêng mình nơi người dùng có thể truy cập mã.

API ứng dụng web

Một xu hướng rất phổ biến trong phát triển web hiện đại là xây dựng các API như một ứng dụng của bên thứ ba. Hầu hết các thương hiệu mạng xã hội chính thống bao gồm phân khúc tài liệu và API hoạt động ngay trên trang web của họ. Ngoài ra, có rất nhiều lớp trình bao bọc miễn phí trên Github được viết bằng tất cả các ngôn ngữ lập trình phụ trợ chính.

Các nhà phát triển nên cảm thấy thoải mái khi làm việc với các loại thư viện mã này khi chúng đang có nhu cầu. Sử dụng hệ thống OAuth, bạn có thể nhanh chóng xây dựng cơ sở người dùng từ nhiều ứng dụng này. Tôi đã liệt kê bên dưới chỉ một vài tham chiếu đến các API trực tuyến phổ biến và tài liệu đầy đủ của chúng.

API Twitter
API ứng dụng đám mây
API Instagr.am
API eBay
API của API
API lừa bóng
API Github

Tận dụng các nguồn lực này vào các dự án mới bất cứ khi nào có thể. Web đang trở nên kết nối nhiều hơn và người dùng luôn đổ xô vào ứng dụng lớn tiếp theo. Bạn có thể tuyển dụng hàng ngàn thành viên tận tâm hơn cho ứng dụng của mình khi khách truy cập của bạn không cần đăng ký tài khoản hoàn toàn mới và thay vào đó có thể đăng ký trực tiếp qua Twitter hoặc Facebook.

Tài nguyên hỏi đáp

Kinh nghiệm có lợi nhất giữa các nhà phát triển là đặt câu hỏi và học các kỹ thuật mới. Cộng đồng nhà phát triển luôn rất hữu ích cho người mới và sẵn sàng cung cấp chuyên môn của họ trong nhiều tình huống. Nếu bạn có bất kỳ cuộc đấu tranh hoặc câu hỏi cụ thể nào về một dự án, hãy tìm kiếm thông qua Google cho diễn đàn của nhà phát triển web có liên quan.

Cá nhân tôi phải khuyên bạn nên tham gia cộng đồng Stack Exchange nếu bạn chưa là thành viên. Điều này bao gồm các trang web tuyệt vời như Stack Overflow và Super User, nơi bạn có thể nhận trợ giúp lập trình về mọi thứ. Các thành viên cộng đồng có kiến thức về tất cả các ngôn ngữ web chính bao gồm jQuery và các lớp PHP nhỏ hơn.

Một mẹo nhỏ mà tôi học được là tìm kiếm thông qua Google và xem vấn đề của bạn đã được giải quyết chưa. Nhập một vài từ khóa vào tìm kiếm Google của bạn và nối thêm hậu tố trang web: stackoverflow.com. Tất cả các kết quả tìm kiếm được trả về sẽ là các câu hỏi từ trong kho lưu trữ Stack Overflow - nếu bạn may mắn, bạn có thể tìm thấy chính xác giải pháp cho vấn đề hiện tại của mình.

Kiểm tra tốc độ trang trực tuyến

Công cụ mới này do Google Developers đưa ra đã thực sự ấn tượng. Ứng dụng Page Speed Online sẽ phân tích nội dung trang web của bạn và tạo báo cáo phân tích về tốc độ của bạn. Điều này bao gồm các giải pháp khả thi để giảm thời gian tải và giữ khách truy cập của bạn trên trang web lâu hơn.

Nó cũng có thể giúp bạn xác định các vấn đề với tỷ lệ thoát và chuyển đổi thấp hơn. Google Analytics là điều bắt buộc đối với bất kỳ trang web nào, nhưng tôi cảm thấy rằng Tốc độ trang chỉ đạt được mức phân tích cao hơn.

Đầu ra báo cáo được xếp hạng từ mức ưu tiên cao đến thấp và thường bao gồm nhiều mục khác nhau. Nếu bạn hiểu các thiết lập LAMP và làm việc trên các máy chủ Apache thì bạn cũng có thể xem xét mô-đun mod_pagespeed. Nó tự động thực hiện nhiều tối ưu hóa trên trang web của bạn để giảm thời gian tải và lưu trữ dữ liệu web quan trọng (hình ảnh, biểu tượng, tập lệnh).

Phần mềm dành cho nhà phát triển tốt nhất

Giữa hai hệ điều hành phổ biến nhất, bạn có thể tìm thấy hàng tá chương trình. Từ phần mềm đồ họa đến trình soạn thảo mã nguồn và IDE, có nhiều tài nguyên cho các nhà phát triển web lựa chọn. Nhưng nếu bạn đang tìm kiếm các đề xuất phổ biến, tôi đề xuất các tiêu đề sau.

Mac OS X

Panic là một công ty phần mềm đã tạo ra Coda - cho đến nay là ứng dụng phát triển web tốt nhất cho Mac. Bạn có quyền truy cập vào trình chỉnh sửa mã nguồn, thiết bị đầu cuối và máy khách FTP nơi bạn có thể thay đổi trực tiếp các tệp máy chủ. Coda cũng hỗ trợ một danh sách dài các cú pháp tô sáng cho các ngôn ngữ như HTML, XML, CSS, JavaScript, PHP, SQL và nhiều ngôn ngữ khác.

Tuy nhiên, nếu bạn cần một giải pháp miễn phí, bạn nên kiểm tra Komodo Edit. Phần mềm được phát triển cho Windows và Mac, mã nguồn mở và hoàn toàn miễn phí để tải xuống. Nó bao gồm tất cả các hỗ trợ tương tự để làm nổi bật cú pháp và nhiều tính năng tương tự như Coda (không có FTP không may). TextWrangler là một giải pháp miễn phí khác mà bạn có thể muốn thử, cũng chỉ là một trình soạn thảo văn bản đơn giản.

Để có ứng dụng FTP miễn phí, hãy xem Cyberduck trên Mac App Store. Mặc dù cá nhân tôi thích một giải pháp thay thế trả phí như Yummy FTP hoặc Transmit.

Microsoft Windows

Bộ phần mềm Adobe luôn xuất hiện trong đầu bạn khi bạn nghĩ về thiết kế và phát triển web. Người dùng Windows có rất nhiều lựa chọn thay thế cho Dreamweaver và nhiều trong số đó hoàn toàn miễn phí.

Notepad ++ là một ví dụ tuyệt vời về một số phần mềm Win32 mã nguồn mở. Dự án vẫn đang được phát triển tích cực và phát hành các bản cập nhật thường xuyên (gần như hàng tháng). Tôi yêu giao diện theo thẻ của họ và hỗ trợ rất nhiều plugin bổ sung. Như tôi đã đề cập ở trên, Komodo Edit cũng được cung cấp cho Windows XP / Vista / 7, vì vậy bạn có thể thử thay thế.

Các nhà phát triển web trên Windows cũng không phải không có máy khách FTP. Filezilla có lẽ là sự thay thế miễn phí phổ biến nhất. Để thay thế, hãy xem danh sách khách hàng FTP miễn phí của chúng tôi cùng với các công cụ tương tự.

Tài nguyên Dev hữu ích khác

100 công cụ phát triển web cần thiết
Tốt nhất năm 2011: Các hướng dẫn và plugin jQuery hữu ích nhất
Hướng dẫn về Ruby on Rails dành cho người mới bắt đầu phát triển web
7 xu hướng phát triển web thú vị cho năm 2011

Phần kết luận

Cho đến nay, quý đầu tiên của năm 2012 đã khởi động với một tiếng nổ! Chúng tôi đã thấy một số nội dung tuyệt vời đổ ra từ các nhà thiết kế và nhà phát triển web từ khắp nơi trên thế giới. Các chuyên gia xây dựng cho web có rất nhiều công cụ theo ý của họ so với 1-2 năm trước.

Tôi hy vọng rằng sự tổng hợp lớn các công cụ và tài nguyên này sẽ thúc đẩy phương pháp của bạn phát triển tốt hơn. Tôi thích làm việc với các nhà phát triển web và tìm hiểu về các dự án mới mọi lúc. Tuy nhiên, chỉ có rất nhiều chỗ cho các tài nguyên mới mà chúng tôi có thể bao gồm, vì vậy tôi chắc chắn đã bỏ lỡ một vài viên đá quý. Nếu bạn có ý tưởng hoặc đề xuất cho các tài nguyên dành cho nhà phát triển web có liên quan, hãy cho chúng tôi biết trong khu vực thảo luận bài.