Tài nguyên mới cho các nhà thiết kế và phát triển web (tháng 5 năm 2017)

Một bộ sưu tập các tài nguyên web hữu ích là thứ mà một nhà phát triển web thực sự mong muốn có trong bộ công cụ của mình. Vì vậy, bản thân là một nhà phát triển, tôi cố gắng giới thiệu với bạn tài nguyên phát triển web tốt nhất và mới nhất mỗi tháng.

Bộ sưu tập của tháng này bao gồm một ứng dụng miễn phí thú vị để ghi hình, một vài khung dựa trên ngôn ngữ Thiết kế Vật liệu, một vài thư viện để kiểm tra Hiệu suất, CLI và nắm trong tay các tài nguyên tiện dụng khác của chúng tôi. Vì vậy, hãy kiểm tra từng cái một trong những điều sau đây.

Bấm để biết thêm tài nguyên

Tìm toàn bộ bộ sưu tập tài nguyên được đề xuất của chúng tôi và các công cụ thiết kế và phát triển web tốt nhất hiện có.

Kap

Kap là một ghi màn hình nhỏ gọn cho MacOS. Nó là một ứng dụng mã nguồn mở, được xây dựng với công nghệ web. Một điều mà tôi yêu thích trong ứng dụng này là nó cung cấp chuyển đổi video ngay lập tức. Kap là một thay thế tuyệt vời để ghi lại bản demo trực tiếp của ứng dụng hoặc trang web của bạn.

Sizzy

Sizzy là một công cụ phát triển để kiểm tra trang web đáp ứng của bạn trong nhiều kích thước khung nhìn trên một màn hình. Đây là một ứng dụng siêu tiện dụng so với Trình giả lập di động tích hợp của Chrome. Sizzy cũng là một tiện ích mở rộng của Chrome.

Giao diện người dùng

Một Thư viện UI dựa trên nguyên tắc Thiết kế Vật liệu và được xây dựng trên Vue.js 2.0, Muse UI được tích hợp các Công cụ thiết kế vật liệu như Appbar, Thẻ và Hộp thoại. Nó thật tuyệt khung để xây dựng và chạy UI nhanh chóng.

WP-CLI nâng cao

Tôi là một fan hâm mộ lớn của WP-CLI và sử dụng nó hầu như mỗi ngày trong công việc của tôi là một nhà phát triển WordPress. Tuy nhiên, chỉ gần đây tôi mới phát hiện ra rằng WP-CLI cho phép bạn tạo một giàn giáo PHP UnitTest cho một chủ đề! Đây là danh sách sử dụng nâng cao WP-CLI từ Người duy trì WP-CLI, Daniel Bachhuber, bản thân anh ấy.

Nguyệt

Lunacy là một Trình xem tệp phác thảo độc lập cho Windows. Nó hoạt động tuyệt vời với tệp Phác thảo có chứa văn bản, hình ảnh raster, thậm chí độ dốc và bóng. Nó không yêu cầu kết nối với internet, do đó, các nhà phát triển có thể làm việc trên các tệp Phác thảo từ bất cứ đâu. Và nó hoàn toàn miễn phí.

K6

Vấn đề tốc độ trong hầu hết mọi khía cạnh của ứng dụng web. Nhưng làm thế nào để bạn đo tốc độ của trang web của bạn? Tốt, câu trả lời là K6. Nó mô phỏng lưu lượng truy cập vào trang web của bạn và tải trang web trong một khoảng thời gian nhất định như thể đó là lưu lượng truy cập thực. Nói tóm lại, K6 là Đơn vị cho hiệu suất.

Dịch vụ kiểm tra

Một danh sách tuyệt vời các ứng dụng web để kiểm tra nhiều thứ như DNS, Tải, Tốc độ, SEO, Bảo mật và SSL. Nhiều trong số các công cụ này là miễn phí, tuy nhiên, có một vài dịch vụ cao cấp được liệt kê trong đó cung cấp các tính năng nâng cao cho người dùng.

SVGito

Là một công cụ web nhỏ để tối ưu hóa SVG đã được tạo từ ứng dụng Phác thảo. Dán mã SVG của bạn lên trang web và nó sẽ trả lại mã được tối ưu hóa ngay lập tức.

Launchaco

Tìm một cái tên tuyệt vời cho khởi nghiệp của bạn đã khó, và có được một trình xử lý tên người dùng có sẵn trên phương tiện truyền thông xã hội thậm chí còn khó hơn. Launchaco là một công cụ tiện dụng mà cho phép bạn tìm tên miền, tên người dùng cho các phương tiện truyền thông xã hội khác nhau như Twitter, Facebook, Instagram, v.v. và giúp bạn tạo ra một logo đẹp của doanh nghiệp của bạn.

Đáng ghét

Một bộ sưu tập hình ảnh động độc đáo được thực hiện bằng CSS. Xin đừng chạy hoạt hình, nếu trái tim và tâm trí của bạn không đủ mạnh để xem nó.

CSS Cheat Sheet

Học CSS Grid có thể khá đáng sợ khi nói đến một số thuộc tính mới, một đơn vị đo lường mới, và gần như là một mô hình hoàn toàn mới để xây dựng bố cục web. Công cụ này, như tên của nó, là để giúp bạn đặt chân lên khỏi mặt đất với CSS Grid.

Hộp làm việc

Hộp làm việc là một sáng kiến mới từ Google để xây dựng Ứng dụng web lũy tiến (PWA). Nó giống với Yeoman hoặc Tạo ứng dụng React theo cách mà bạn có thể hoàn thành mọi thứ và sẵn sàng trong một dòng lệnh.

Mavo

Mavo là một dự án nguồn mở mới từ Lea Verou. Đây là một thư viện bật đánh dấu HTML trần và một vài thuộc tính tùy chỉnh vào một ứng dụng web hoạt động. Mavo dễ theo dõi hơn so với các thư viện khác như Backbone, Vue.js hoặc React khi nó cho phép người dùng ít hiểu biết về công nghệ để xây dựng ứng dụng web nhanh chóng và dễ dàng.

UI vật liệu

Simlar to Muse UI, nó là một Khung UI dựa trên ngôn ngữ Thiết kế theo chiều. Điều này tuy nhiên được xây dựng bằng React. Bây giờ tùy thuộc vào sở thích của bạn; nếu bạn ở với nhóm Vue.js hoặc nhóm React.

Hình ảnh lười biếng

Hình ảnh lười biếng là một yếu tố HTML tùy chỉnh để tải hình ảnh theo yêu cầu. Yếu tố yêu cầu này cung cấp thêm .hoạt động đối tượng trong Element Object mà bạn có thể sử dụng để kích hoạt hình ảnh để tải trong bất kỳ sự kiện hoặc tương tác người dùng như bạn cần.

Mac CLI

Đây là một công cụ tiện lợi để quản lý MacOS của bạn thông qua Terminal. Đơn giản chỉ cần gõ cập nhật mac để cập nhật MacOS. Hoặc, gõ trình bày mac nơi sẽ chuẩn bị máy Mac của bạn (thu nhỏ tất cả các ứng dụng, đóng trình duyệt, gửi tệp từ máy tính để bàn và tải xuống thùng rác và đặt chế độ không làm phiền) trước khi trình bày. Thật tuyệt!

Giữ bạn tỉnh táo

KeepingYouAwake là một tiện ích thanh menu cho MacOS để ngăn máy Mac của bạn vào chế độ ngủ trong một khoảng thời gian đã đặt hoặc miễn là nó được kích hoạt. Bạn có thể cài đặt ứng dụng này bằng Homebrew.

Nguồn cấp dữ liệu JSON

Cuối cùng! Đây là một đặc tả tiêu chuẩn để phân phối nguồn cấp nội dung trong JSON định dạng. Đã có một plugin WordPress> được xây dựng để thực hiện. Điều này sẽ làm cho cuộc sống của các nhà phát triển web dễ dàng hơn. Chúng ta hãy chỉ nói lời tạm biệt với XML.

Carbon

Nói tóm lại, Carbon là Moment.js của PHP. Đây là thư viện PHP để tạo và thao tác chuỗi ngày và thời gian.

SpeedRacer

Khác công cụ kiểm tra đơn vị hiệu suất. Trong khi K6 sẽ thực hiện kiểm tra tải bằng cách gửi Người dùng Virut để mô phỏng lượt truy cập và lưu lượng truy cập, SpeedRacer sẽ đánh giá hiệu suất kết xuất trang trên trình duyệt. SpeedRacer có thể là người bạn đồng hành tốt với K6.