Logo Zephyrnet

Xây dựng, vận chuyển và duy trì hệ thống thiết kế với đèn nền

Ngày:

Ngày nay, hệ thống thiết kế là một công việc toàn bộ. Các cơ quan được thuê để tạo ra chúng. Các nhóm nội bộ được thành lập để xử lý, vận chuyển chúng để các nhóm khác có thể sử dụng và giúp đảm bảo chúng làm được điều đó. Hệ thống thiết kế không phải là lỗi mốt, chúng là sự phát triển tích cực của cách thiết kế kỹ thuật số được thực hiện. Backlight là công cụ phát triển tất cả trong một cuối cùng cho các hệ thống thiết kế.

Tôi nghĩ thật thú vị khi bắt đầu nghĩ về điều này khi kết thúc. Tình huống tốt nhất cho một hệ thống thiết kế cho các trang web là gì? Tôi nghĩ đó là khi bạn đã xuất bản một hệ thống thiết kế có phiên bản lên npm. Bằng cách đó, các nhóm có thể kéo nó vào như một phụ thuộc vào dự án và sử dụng nó. Làm thế nào để bạn làm điều đó? Hệ thống thiết kế của bạn có trên GitHub và bạn xuất bản từ đó. Làm thế nào để bạn làm điều đó? Bạn làm việc trên hệ thống thiết kế của mình thông qua một môi trường phát triển được đẩy lên GitHub. Đèn nền là gì? Đó là môi trường phát triển.

Tạo ra một hệ thống thiết kế hoàn chỉnh trong vài giây

Muốn xem tôi làm điều đó không?

Bạn không để chọn một mẫu ban đầu, nhưng thật kỳ diệu khi thấy tất cả các khả năng. Backlight không đặc biệt kiên quyết về công nghệ bạn muốn sử dụng cho hệ thống. Các thành phần Lit và Web? Tuyệt quá. Phản ứng và Cảm xúc? Mát lạnh. Chỉ Vue? Tất cả đều tốt. Nunjucks và Sass? Điều đó hoạt động.

Có một hệ thống thiết kế khởi động thực sự mang lại cho bạn một cơ hội ở đây. Nếu bạn sành sỏi với việc sử dụng một thứ gì đó có sẵn và sau đó tùy chỉnh nó, bạn sẽ tắt và chạy cực kỳ nhanh chóng. Một cái gì đó mà bạn có thể cho rằng sẽ mất vài tuần để tìm ra và giải quyết xong sẽ được thực hiện ngay lập tức. Và nếu bạn muốn được tùy chỉnh 100% về mọi thứ, điều đó vẫn hoàn toàn nằm trên bàn.

Đưa nó lên GitHub

Ngay cả khi bạn vẫn chỉ đang thử nghiệm, tôi nghĩ thật dễ dàng và ấn tượng khi bạn có thể tạo repo GitHub (hoặc GitLab) và đẩy đến nó trong một vài cú nhấp chuột.

Đối với tôi, đây là thời điểm nó thực sự trở thành hiện thực. Đây không phải là một số công cụ của bên thứ ba, nơi mọi người 100% buộc phải sử dụng nó và bạn sẽ bị khóa vào nó mãi mãi và nó chỉ thực sự hữu ích khi mọi người mua công cụ của bên thứ ba. Backlight chỉ áp dụng các phương pháp thực hành tiêu chuẩn ngành và làm cho chúng dễ dàng và thuận tiện hơn để làm việc.

Sau đó, chuyển nó vào sổ đăng ký.

Như tôi đã nói ở trên, đây là thời điểm quan trọng đối với bất kỳ hệ thống thiết kế nào. Khi bạn gửi nó đến một cơ quan đăng ký gói như NPM or Các gói GitHub, điều đó có nghĩa là bất kỳ ai hy vọng sử dụng hệ thống thiết kế của bạn hiện có thể cài đặt và sử dụng nó như bất kỳ phụ thuộc nào khác.

Trong Backlight, đây chỉ là một vấn đề của việc nhấp vào một vài nút.

Với tư cách thành viên PRO, bạn có thể thay đổi phạm vi thành tổ chức của riêng mình. Bạn sẽ sớm xử lý tất cả các bản phát hành hệ thống thiết kế của mình ngay từ đây, bao gồm các phiên bản chính, phụ và vá lỗi.

Tạo thành phần

Tôi chưa bao giờ sử dụng Backlight trước đây, không ai giúp tôi và tôi cũng không đọc bất kỳ tài liệu nào (mạnh mẽ). Tôi chỉ cần nhấp vào xung quanh và tạo một Thành phần mới một cách dễ dàng. Trong trường hợp của tôi ở đây, tôi đã tạo một Nunjucks mới macro, đã tạo một số kiểu SCSS, sau đó tạo bản demo về nó dưới dạng “câu chuyện” Storybook. Tất cả những gì tôi đã làm là tham khảo một thành phần hiện có để xem tất cả nó hoạt động như thế nào.

Tất nhiên, là một trong những người tạo ra CodePen, tôi đánh giá cao chất lượng IDE trong trình duyệt cho tất cả những điều này. Nó chạy lại các thay đổi mã của bạn (trông giống như một quy trình Vite) siêu nhanh, cảnh báo hữu ích cho bạn về bất kỳ lỗi nào.

Bây giờ vì đây là một Hệ thống thiết kế nghiêm túc rất thực tế, tôi sẽ không đẩy trực tiếp thành phần mới này lên master trong kho lưu trữ của chúng tôi, đầu tiên nó trở thành một nhánh, và sau đó tôi cam kết điều đó. Tôi sẽ không phải biết bất cứ điều gì về Git để giải quyết vấn đề này, hãy xem nó dễ dàng như thế nào:

Xin chào, các bên liên quan!

Hệ thống thiết kế là mối quan tâm của nhiều người cũng như mối quan tâm về công nghệ. Hệ thống thiết kế cần được nói đến. Tôi thực sự đánh giá cao cách tôi có thể chia sẻ Backlight với bất kỳ ai, ngay cả khi họ chưa đăng nhập. Chỉ cần sao chép một liên kết chia sẻ (mà không ai có thể đoán được) và bạn sẽ đi.

Có rất nhiều ở đây.

Bạn có thể quản lý toàn bộ hệ thống thiết kế tại đây. Bạn đang quản lý mọi thứ từ cấp mã thông báo nguyên tử cho đến xây dựng các trang mẫu và ghép hệ thống lại với nhau. Theo nghĩa đen, bạn đang viết mã để xây dựng tất cả những thứ này, bao gồm các mẫu, câu chuyện và thử nghiệm, ngay tại đó trong Backlight.

Còn những người trong nhóm của bạn, những người thực sự không thể bị thuyết phục rời bỏ môi trường phát triển tại địa phương của họ thì sao. Backlight hiểu điều này, và nó không bắt buộc họ phải làm như vậy! Đèn nền có một CLI cho phép phát triển cục bộ, bao gồm quay một máy chủ để xem trước công việc đang hoạt động.

Nhưng nó không dừng lại ở đó. Bạn có thể xây dựng tài liệu cho mọi thứ ngay trong Backlight. Hệ thống thiết kế thường được giải thích tốt nhất bằng lời! Và các hệ thống thiết kế có thể thực sự bắt đầu cuộc sống (hoặc sống song song) trong phần mềm hoàn toàn tập trung vào thiết kế như Figma, Sketch hoặc Adobe XD. Có thể liên kết các tài liệu thiết kế ngay trong Backlight, giúp chúng dễ tìm và có tổ chức hơn nhiều.


Tôi rất ấn tượng! Lúc đầu, tôi không chắc chắn về việc tạo ra một công cụ muốn trở thành một công cụ hoàn chỉnh cho các hệ thống thiết kế, biết rằng toàn bộ thế giới đó phức tạp như thế nào, nhưng Backlight thực sự mang lại theo cách mà tôi thấy rất hài lòng, đặc biệt là với vai trò của một nhà phát triển, nhà thiết kế và người quản lý front-end.

tại chỗ_img

Tin tức mới nhất

tại chỗ_img

Trò chuyện trực tiếp với chúng tôi (chat)

Chào bạn! Làm thế nào để tôi giúp bạn?