Bạn có bao giờ ước có một ứng dụng web hoặc tiện ích mở rộng cho phép bạn tạo và chia sẻ các nguyên mẫu giao diện người dùng một cách nhanh chóng không?
Tất cả chúng ta làm! Tất cả chúng ta đều có ý tưởng về cách chúng ta muốn các trang web hoặc ứng dụng của mình trông và cảm nhận.
Vì vậy, bạn đã nghĩ ra một thiết kế thực sự tuyệt vời và không thể nhớ chính xác bạn đã làm nó như thế nào?
Bây giờ bạn phải tìm cách chia sẻ nó. Quá trình này có thể mất vài ngày, thậm chí vài tuần nếu bạn đang cố gắng chia sẻ một thiết kế khá phức tạp.
Không có lý do gì để chờ đợi để tạo nguyên mẫu ứng dụng web của bạn. Tạo chúng ngay bây giờ với Dabblet.
Kéo và thả các phần tử, kiểu và lưu nó. Gửi nó cho một nhà thiết kế để xem xét hoặc chỉ cần sao chép nó vào một bản trình bày. Khả năng là vô tận.
Dabblet là gì?
Sử dụng vọc, bạn có thể thử nghiệm với các đoạn mã CSS và HTML nhỏ trong thời gian thực.
Bạn sẽ không cần bất kỳ tiền tố nào trong mã CSS của mình khi sử dụng điều này. GitHub gists cho phép bạn lưu trữ nội dung của mình, đăng nó trên các trang web khác và chia sẻ nó với những người khác.
Đây là một cách tuyệt vời để chia sẻ các đoạn mã với các nhà phát triển khác và nhận phản hồi.
Nó hoạt động như thế nào?
Ngay sau khi mã được nhập, đầu ra trực quan sẽ hiển thị ngay trên đầu nó. JavaScript là sự miễn trừ duy nhất, xem xét việc chạy nó trên mỗi lần nhấn phím sẽ rất khó chịu và thậm chí có thể khiến trình duyệt không sử dụng được trong một số tình huống nhất định.
Sử dụng tùy chọn “Chạy JS” trong tab JavaScript hoặc phím tắt (Ctrl + Enter hoặc Cmd + Enter) sẽ chạy JavaScript khi Dabblet chạy. Menu tùy chọn cho phép bạn thay đổi phong cách này.
Là một nhà phát triển, bạn có thể chuyển đổi giữa viết mã bằng cả ba ngôn ngữ này đồng thời hoặc xem thành phẩm.
Tính năng
Sau đây là các tính năng của Dabblet mà bạn nên biết:
Chỉnh sửa CSS nhanh: Bạn có thể nhanh chóng thêm, chỉnh sửa và xóa các thuộc tính CSS. Các thay đổi sẽ được phản ánh trên trang trong thời gian thực.
Đánh dấu cú pháp: Mã CSS và HTML được đánh dấu cú pháp, giúp dễ đọc và dễ hiểu. Mã cũng sẽ được xác nhận khi bạn nhập. Bạn cũng có thể chọn ẩn hộp mã nếu muốn.
Tự động hoàn thành: Dabblet cung cấp tính năng tự động hoàn tất cho các thuộc tính và giá trị CSS. Điều này có thể rất hữu ích khi bạn đang tạo hoặc chỉnh sửa bảng định kiểu.
Các biểu định kiểu CSS được tạo sẵn: Bạn có thể truy cập các bảng định kiểu CSS được tạo sẵn từ các trang web phổ biến. Chúng có thể được sử dụng để thêm các kiểu vào trang web của riêng bạn một cách nhanh chóng và dễ dàng.
Hỗ trợ Gist: Dabblet hỗ trợ GitHub Gists, cho phép bạn lưu trữ và chia sẻ các đoạn mã của mình với người khác một cách dễ dàng.
Xem trước trực tiếp: Bạn có thể xem kết quả thay đổi mã của mình trong thời gian thực mà không cần tải lại trang. Ví dụ: nếu bạn thay đổi màu sắc của văn bản, bạn sẽ thấy sự thay đổi được phản ánh trên văn bản khi bạn nhập.
Các phím tắt bàn phím: Dabblet có các phím tắt cho các tác vụ thông thường, chẳng hạn như thêm quy tắc kiểu mới hoặc nhận xét.
Nhiều chế độ xem: Dabblet cung cấp nhiều chế độ xem, cho phép bạn xem mã và kết quả song song hoặc trên và dưới nhau.
Ưu điểm
- CSS nhanh
- Ngay cả khi bạn đã đăng nhập, bạn vẫn có thể lưu ở chế độ ẩn danh.
- Trình xem trước giá trị CSS nội tuyến cho các thông số khác nhau như góc, màu sắc, thời lượng, v.v.
- Mọi thứ đều là XHR-ed, vì vậy trang không bao giờ làm mới, ngay cả khi bạn lưu.
- Rất nhiều phím tắt.
- Tất cả mã được định dạng tự động (ngoại trừ dấu xuống).
- Tài liệu vững chắc từ khi bắt đầu.
Nhược điểm
- Giao diện hơi choáng ngợp lúc đầu, nhưng bạn sẽ quen với nó.
- Không có tính năng quản lý cấp dự án (chưa).
Tích hợp Dabblet
Bất kỳ nền tảng nào cũng cần tích hợp với các dịch vụ khác, và Dabblet cũng không ngoại lệ. Sau đây là một số tích hợp mà Dabblet cung cấp:
Google Analytics
Bạn có thể dễ dàng thêm mã theo dõi Google Analytics của mình vào các trang Dabblet. Điều này sẽ cho phép bạn theo dõi số lượt xem trang và các số liệu thống kê khác cho chiếc Dabblet của mình.
Ubuntu
Dabblet có thể được sử dụng để tạo các chủ đề Ubuntu. Bạn có thể tạo một Dabblet mới, thêm CSS và mã HTML và xem trước chủ đề trong trình duyệt web.
DigitalOcean
Một công ty lưu trữ đám mây độc nhất vô nhị cung cấp dịch vụ điện toán đám mây cho các doanh nghiệp, cho phép họ phát triển hoạt động của mình hiệu quả hơn.
Dabblet làm gì với nó?
Giờ đây, bạn có thể tạo, quản lý và triển khai Dabblet của mình trên Không gian DigitalOcean.
Điều này cho phép bạn giữ tất cả các đoạn mã của mình ở một nơi và giúp bạn dễ dàng chia sẻ chúng với những người khác.
Các lựa chọn thay thế cho Dabblet
Các lựa chọn thay thế luôn có sẵn và trong cùng một bối cảnh, đây là một vài lựa chọn để người ta cân nhắc khi nói đến Dabblet:
pastebin.com
Các lập trình viên thường sử dụng trang web để lưu mã nguồn hoặc các đoạn dữ liệu cấu hình. Tuy nhiên, bất kỳ ai cũng có thể đặt bất kỳ văn bản nào vào khoảng trống được cung cấp.
Thùng rác
JS Bin là một công cụ kiểm tra miễn phí cho JavaScript. Kết quả có thể được chia sẻ thông qua một URL ngắn khi Javascript đã được nhập vào một ngăn và HTML trong ngăn kia. Sử dụng menu cho phép bạn chọn từ một số thư viện JS thường được sử dụng nhất.
CssDeck
Công cụ này rất hữu ích để tạo và trao đổi các trường hợp thử nghiệm với những người khác có thể giúp bạn trong nỗ lực viết mã của bạn. Với các tùy chọn khác nhau, bạn thậm chí có thể cộng tác trong các dự án ngay lập tức với các lập trình viên khác.
Người đào mỏ
Plunker là một nền tảng kỹ thuật số, nơi các nhà phát triển web có thể động não, cộng tác và chia sẻ suy nghĩ của họ.
Ví dụ: bạn có thể bắt đầu bằng câu “Xin chào cả thế giới!” lập trình bằng bất kỳ ngôn ngữ nào và thêm các đoạn mã, dấu xuống và ảnh chụp màn hình để tạo ra trải nghiệm học tập phong phú.
Từ cuối cùng
Kết luận, Dabblet là một công cụ hữu ích cho các nhà phát triển web, đặc biệt là những người đang tìm cách nhanh chóng và dễ dàng kiểm tra mã của họ.
Với nhiều tính năng và tích hợp khác nhau của nó, thật khó để tìm thấy một ứng dụng cho nền tảng này.
Hãy thử ngay hôm nay!
Bình luận