openplanning

Lập trình Dart với công cụ trực tuyến DartPad

  1. DartPad là gì?
  2. Các thư viện được hỗ trợ
  3. Tạo ứng dụng Dart Command-line
  4. Tạo ứng dụng Dart HTML
  5. Tạo ứng dụng Flutter
  6. Nhúng DartPart vào Website

1. DartPad là gì?

Thông thường để học một ngôn ngữ mới bạn cần phải cài đặt một IDE. Với ngôn ngữ lập trình Dart đó là Android Studio hoặc Visual Studio Code,..
Nếu bạn đang cần tìm kiếm một công cụ chỉ để học ngôn ngữ Dart thì DartPad dành cho bạn. DartPad là một công cụ mã nguồn mở, có thể chạy trên một trình duyệt hiện đại bất kỳ, nó sẵn sàng cho việc viết code mà không cần cài đặt thêm bất kỳ một mở rộng nào khác.
Mã nguồn của DartPad được chia sẻ trên GitHub:
Trên trình duyệt, truy cập vào một trong các địa chỉ dưới đây:
Giao diện của DartPad mà bạn nhìn thấy mặc định được sử dụng cho ngôn ngữ Dart. Nó rất đơn giản, cửa sổ bên trái dành cho việc viết code, cửa sổ bên phải in ra kết quả của chương trình. Ngoài ra nó cũng cung cấp các ví dụ mẫu để tham khảo.

2. Các thư viện được hỗ trợ

DartPad là một công cụ trực tuyến, các thư viện mà nó hỗ trợ đã được tích hợp sẵn trong công cụ này tại máy chủ. Hiện tại công cụ này chỉ hỗ trợ một vài thư viện cơ bản và phổ biến, và không hỗ trợ việc tích hợp các thư viện khác từ bên ngoài. Dù sao để phát triển các ứng dụng trong thực tế bạn vẫn cần một IDE chuyên dụng.
Các thư viện Dart được hỗ trợ:
  • dart:*
Các thư viện Flutter cơ bản được hỗ trợ:
  • flutter
  • dart:ui
Các thư viện không được hỗ trợ:
Danh sách các thư viện được hỗ trợ có thể thay đổi trong các phiên bản tiếp theo của DartPad, bạn có thể cập nhập thông tin này trong liên kết dưới đây:

3. Tạo ứng dụng Dart Command-line

Để tạo một ứng dụng Dart command-line. Sử dụng "New Pad":
  • Nhấn vào nút "New Pad" và xác nhận rằng bạn muốn huỷ bỏ tất cả các thay đổi trên cửa sổ "Pad" hiện tại.
  • Một hộp thoại được mở ra, chọn biểu tượng "Dart" và đảm bảo rằng bạn không lựa chọn tuỳ chọn "HTML".
  • Nhấn nút "Create" để tạo ứng dụng.
Ứng dụng được tạo ra với một đoạn code mẫu, xoá hết nội dung này và thay thế bởi code của bạn, chẳng hạn:
void main() {
  for (var char in 'hello'.split('')) {
    print(char);
  }
}
Nhấn vào nút "Run" để chạy ứng dụng và xem kết quả trên cửa sổ Console.

4. Tạo ứng dụng Dart HTML

Để tạo một ứng dụng Dart HTML. Sử dụng "New Pad":
  • Nhấn vào nút "New Pad" và xác nhận rằng bạn muốn huỷ bỏ tất cả các thay đổi trên cửa sổ "Pad" hiện tại.
  • Một hộp thoại được mở ra, chọn biểu tượng "Dart" và lựa chọn tuỳ chọn "HTML".
  • Nhấn nút "Create" để tạo ứng dụng.
DartPad tạo ra ứng dụng để xử lý file HTML:

5. Tạo ứng dụng Flutter

Tiếp theo, để tạo một ứng dụng Flutter, bạn thực hiện các bước sau:
  • Nhấn vào nút "New Pad" và xác nhận rằng bạn muốn huỷ bỏ tất cả các thay đổi trên cửa sổ "Pad" hiện tại.
  • Một hộp thoại được mở ra, chọn biểu tượng "Flutter".
  • Nhấn nút "Create" để tạo ứng dụng.
Xem thêm:
  • Các hướng dẫn lập trình Flutter

6. Nhúng DartPart vào Website

Nếu bạn có một website hướng dẫn lập trình Dart bạn có thể nhúng DartPad vào trang web của bạn, điều này cho phép người dùng có thể chạy trực tiếp ví dụ của bạn trên website. Bài viết dưới đây hướng dẫn cách nhúng DartPad vào một trang web và cách tuỳ chỉnh để phù hợp với trường hợp sử dụng của bạn:

Các hướng dẫn lập trình Dart

Show More

Các bài viết mới nhất

Show More