Tạo các bài thơ haiku về các sản phẩm của Google bằng PaLM API và Flutter

1. Trước khi bắt đầu

Một trong những bước đột phá thú vị nhất của công nghệ học máy (ML) là AI tạo sinh. Công nghệ này có thể tạo ra những hình ảnh, văn bản, âm thanh tuyệt vời và thậm chí là video dựa trên văn bản hoặc câu lệnh đơn giản của người dùng. Đặc biệt, với việc phát hành PaLM API, Google hỗ trợ nhà phát triển xây dựng những danh mục ứng dụng có trải nghiệm người dùng thú vị, được cải tiến bằng công nghệ PaLM.

Trong lớp học lập trình này, bạn sẽ tạo một ứng dụng sử dụng API PaLM để tạo thơ haiku dựa trên tên sản phẩm của Google. Bạn cũng dùng Flutter để tạo một ứng dụng đa nền tảng cho thấy thơ haiku.

Điều kiện tiên quyết

  • Kiến thức cơ bản về Mô hình ngôn ngữ lớn (LLM), chẳng hạn như tính năng đặt câu lệnh
  • Kiến thức cơ bản về cách phát triển Flutter bằng Dart

Kiến thức bạn sẽ học được

  • Cách sử dụng PaLM API của Google.
  • Cách tạo ứng dụng Flutter đa nền tảng để hiển thị kết quả.

Bạn cần có

2. Bắt đầu thiết lập

Tải mã khởi động xuống

  1. Chuyển đến kho lưu trữ GitHub.
  2. Nhấp vào Mã > Tải tệp zip xuống để tải tất cả mã nguồn cho lớp học lập trình này.
  3. Giải nén tệp zip đã tải xuống để giải nén thư mục gốc codelabs-main. Bạn chỉ cần thư mục con haiku-generator, trong đó có các thư mục sau:
  • Các thư mục từ step0 đến step3 chứa mã khởi đầu mà bạn sẽ xây dựng cho từng bước trong lớp học lập trình này.
  • Thư mục finished chứa mã nguồn đã hoàn tất cho ứng dụng mẫu hoàn chỉnh.

Tải các phần phụ thuộc của dự án xuống

  1. Trong VS Code, hãy nhấp vào File > (Tệp >) Mở thư mục > lớp học lập trình-chính > haiku_generator > bước0 > thư viện > main.dart.
  2. Nếu bạn thấy hộp thoại VS Code nhắc bạn tải các gói cần thiết xuống cho ứng dụng khởi đầu, hãy nhấp vào Get package (Tải gói).

Hộp thoại VS Code nhắc bạn tải các gói cần thiết xuống cho ứng dụng khởi đầu.

  1. Nếu bạn không thấy hộp thoại VS Code nhắc bạn tải các gói cần thiết xuống cho ứng dụng khởi đầu, hãy mở cửa sổ dòng lệnh, sau đó chuyển đến thư mục step0 rồi chạy lệnh flutter pub get.

Chạy ứng dụng khởi đầu

  1. Trong VS Code, hãy đảm bảo rằng Trình mô phỏng Android hoặc Trình mô phỏng iOS được thiết lập đúng cách và xuất hiện trên thanh trạng thái.

Ví dụ: dưới đây là những gì bạn thấy khi sử dụng Pixel 5 với Trình mô phỏng Android:

Thanh trạng thái với Pixel 5 được chọn làm thiết bị

Sau đây là những gì bạn thấy khi sử dụng iPhone 13 với Trình mô phỏng iOS:

Thanh trạng thái với iPhone 13 được chọn làm thiết bị

  1. Nhấp vào a19a0c68bc4046e6.png Bắt đầu gỡ lỗi. Ứng dụng sẽ chạy trên Trình mô phỏng Android hoặc Trình mô phỏng iOS.

Khám phá ứng dụng khởi đầu

Trong ứng dụng khởi đầu, hãy lưu ý những nội dung sau:

  • Giao diện người dùng khá đơn giản.
  • Có một trình đơn thả xuống cho phép người dùng chọn một sản phẩm cụ thể của Google.
  • Sau khi người dùng chọn nút Generate haiku! (Tạo bài thơ haiku!), ứng dụng Flutter sẽ gửi lời nhắc tích hợp sẵn đến điểm cuối PaLM API để tạo ra các bài thơ haiku.
  • Ứng dụng sẽ hiện các bài thơ haiku được tạo trong tiện ích văn bản sau khi nhận được phản hồi. Tuy nhiên, nếu bạn chọn Generate haiku! (Tạo haiku!), thì sẽ không có gì xảy ra cả vì ứng dụng chưa thể giao tiếp với PaLM API.

Ứng dụng khởi đầu trên iOS Ứng dụng khởi đầu trên Android

3. Thiết lập quyền truy cập vào PaLM API

Bạn cần có khoá API để sử dụng PaLM API. Tại thời điểm lớp học lập trình này xuất bản, PaLM API vẫn đang ở chế độ xem trước ở chế độ riêng tư.

  • Để thiết lập quyền truy cập vào PaLM API, hãy làm theo tài liệu này để tạo khoá API, sau đó ghi lại khoá để sử dụng sau trong lớp học lập trình này.

4. Thêm trình đơn các sản phẩm của Google

Mục tiêu của bạn là tạo thơ haiku cho các sản phẩm của Google. Trong thời gian chạy, người dùng ứng dụng có thể linh động chọn một sản phẩm trong danh sách tên sản phẩm được điền sẵn.

Để thêm danh sách sản phẩm của Google vào ứng dụng, hãy làm theo các bước sau:

  1. Trong VS Code, hãy chuyển đến tệp step1/lib/data/repositories/product_repository_impl.dart.
  2. Trong phần nội dung của hàm getAllProducts(), hãy thêm biến sau dùng để lưu trữ một mảng tên sản phẩm của Google:

product_repository_impl .dart

var productData = [
  {'productName': 'Google Search'},
  {'productName': 'YouTube'},
  {'productName': 'Android'},
  {'productName': 'Google Maps'},
  {'productName': 'Gmail'}
];

5. Gửi yêu cầu đến PaLM API và giải mã phản hồi

Tên sản phẩm do người dùng chọn được kết hợp với mẫu câu lệnh sau:

Context: You are an awesome haiku writer. 
Message content: Write a cool haiku about {product name}.

Để gửi yêu cầu này đến điểm cuối của API PaLM nhằm tạo một bài haiku, hãy làm theo các bước sau:

  1. Trong VS Code, hãy chuyển đến tệp step2/lib/data/repositories/poem_repository_impl.dart.
  2. Trong phần nội dung của hàm getPoems(), hãy thêm mã sau:

poem_repository_impl.dart

// TODO: Replace YOUR_API_KEY with your API key.
var apiKey = 'YOUR_API_KEY';
const haikuCount = 5;

final url = Uri.parse(
   'https://generativelanguage.googleapis.com/v1beta2/models/chat-bison-001:generateMessage?key=$apiKey');
final headers = {'Content-Type': 'application/json'};
final body = jsonEncode({
 "prompt": {
   "context": "You are an awesome haiku writer.",
   "examples": [
     {
       "input": {"content": "Write a haiku about Google Photos."},
       "output": {
         "content":
             "Google Photos, my friend\nA journey of a lifetime\nCaptured in pixels"
       }
     }
   ],
   "messages": [
     {"content": "Write a cool haiku for $productName"}
   ]
 },
 "candidate_count": haikuCount,
 "temperature": 1,
});

try {
 final response = await http.post(url, headers: headers, body: body);
 if (response.statusCode == 200) {
   final decodedResponse = json.decode(response.body);
   String haikus = 'Here are $haikuCount haikus about $productName:\n\n';
   for (var i = 0; i < haikuCount; i++) {
     haikus += '${i + 1}.\n';
     haikus += decodedResponse['candidates'][i]['content'] + '\n\n';
   }
   return haikus;
 } else {
   return 'Request failed with status: ${response.statusCode}.\n\n${response.body}';
 }
} catch (error) {
 throw Exception('Error sending POST request: $error');
}

Thay thế chuỗi YOUR_API_KEY bằng khoá API trước đó.

Sau khi nhận được và giải mã thành công câu trả lời, tiện ích văn bản trong giao diện người dùng sẽ hiển thị các bài thơ haiku đã tạo.

6. Chạy ứng dụng trên nền tảng di động

  1. Trong VS Code, hãy đặt thiết bị mục tiêu thành một thiết bị Android hoặc iOS.
  2. Nhấp vào a19a0c68bc4046e6.png Start debugging (Bắt đầu gỡ lỗi) rồi chờ ứng dụng tải.
  3. Chọn một sản phẩm trong trình đơn thả xuống rồi chọn Tạo haiku!. Ứng dụng sẽ hiện một bài thơ haiku về sản phẩm đã chọn.

Ứng dụng đã hoàn thiện trên iOS Ứng dụng hoàn chỉnh trên Android

7. Chạy ứng dụng trên nền tảng dành cho máy tính

Ngoài Android và iOS, Flutter cũng hỗ trợ các nền tảng dành cho máy tính, bao gồm cả Linux, macOS và Windows.

Chạy ứng dụng trên Linux

  1. Trong Mã VS, hãy đặt thiết bị mục tiêu thành Linux (linux-x64).
  2. Nhấp vào a19a0c68bc4046e6.png Start debugging (Bắt đầu gỡ lỗi) rồi chờ ứng dụng tải.
  3. Chọn một sản phẩm trong trình đơn thả xuống rồi chọn Tạo bài thơ haiku!.

Ứng dụng đã hoàn thiện trên Linux

Chạy ứng dụng trên macOS

Đối với macOS, bạn cần thiết lập các quyền thích hợp vì ứng dụng gửi yêu cầu HTTP đến phần phụ trợ. Để biết thêm thông tin, hãy xem bài viết Quyền và Hộp cát ứng dụng.

Để chạy ứng dụng trên macOS, hãy làm theo các bước sau:

  1. Trong tệp step3/macos/Runner/DebugProfile.entitlementsstep3/macos/Runner/Release.entitlements, hãy thêm mã sau:

DebugProfile.entitlements | Release.entitlements

<key>com.apple.security.network.client</key>
<true/>
  1. Trong Mã VS, hãy đặt thiết bị mục tiêu thành macOS (darwin) .
  2. Nhấp vào a19a0c68bc4046e6.png Start debugging (Bắt đầu gỡ lỗi) rồi chờ ứng dụng tải.
  3. Chọn một sản phẩm trong trình đơn thả xuống rồi chọn Tạo bài thơ haiku!.

Ứng dụng đã hoàn thiện trên macOS

Chạy ứng dụng trên Windows

  1. Trong VS Code, hãy đặt thiết bị mục tiêu thành Windows (windows-x64).
  2. Nhấp vào a19a0c68bc4046e6.png Start debugging (Bắt đầu gỡ lỗi) rồi chờ ứng dụng tải.
  3. Chọn một sản phẩm trong trình đơn thả xuống rồi chọn Tạo bài thơ haiku!.

Ứng dụng đã hoàn thiện trên Windows

8. Chạy ứng dụng trên nền tảng web

Bạn cũng có thể thêm dịch vụ hỗ trợ web cho ứng dụng Flutter. Theo mặc định, nền tảng web này sẽ tự động được bật cho các ứng dụng Flutter, vì vậy, bạn chỉ cần khởi chạy nền tảng này.

Để chạy ứng dụng trên nền tảng web, hãy làm theo các bước sau:

  1. Trong Mã VS, hãy đặt thiết bị mục tiêu thành Chrome (web-javascript).
  2. Nhấp vào a19a0c68bc4046e6.png Bắt đầu gỡ lỗi, sau đó chờ ứng dụng tải trong Google Chrome.
  3. Chọn một sản phẩm trong trình đơn thả xuống rồi chọn Tạo bài thơ haiku!.

Ứng dụng hoàn chỉnh trên web

9. Xin chúc mừng

Bạn đã xây dựng một ứng dụng full stack tạo ra các bài thơ haiku về các sản phẩm của Google! Mặc dù ứng dụng chỉ tạo bài thơ haiku cho một số sản phẩm của Google, nhưng bạn có thể dễ dàng thay đổi câu lệnh và tạo văn bản mà bạn muốn. Giờ đây, khi đã biết cách sử dụng PaLM API, bạn có thể tạo ra những ứng dụng tuyệt vời bằng sức mạnh đáng kinh ngạc của các mô hình ngôn ngữ lớn!

Tìm hiểu thêm