Xin chào, mình là Moon.
Đây là bài viết đầu tiên của mình trên nền tảng Viblo. Mình chỉ muốn đem những gì mình học được, diễn giải lại theo cách nghĩ của mình, với ngôn từ dễ hiểu, thân thương, gần gũi, và mong rằng, sẽ giúp ích phần nào đó cho mọi người.
Đôi chút về mình. Mình là sinh viên năm 3 chuyên ngành công nghệ thông tin tại một đại học tư thục. Mình đã bắt đầu vào chuyên ngành. Trong đó có môn Lập trình cho thiết bị di động. Trường mình dạy công nghệ Flutter. Đây là một công nghệ lập trình cross platform (đa nền tảng) mới, chưa có nhiều trường đại học dạy về công này. Mình rất khó khăn trong việc tìm tài liệu học tập cả tiếng Việt lẫn tiếng Anh. Tại thời điểm mình viết bài này, chưa xuất hiện một chương trình đào tạo, một giáo trình bài bản tiếng Việt nào về công nghệ này. Mình cũng kém tiếng Anh nữa, nên việc đọc docs từ trang chủ Flutter và xem video tiếng Anh trên youtube là việc quá sức đối với mình.
Mình tin rằng có nhiều bạn gặp khó khăn giống mình (hoặc không). Mình viết bài này (có thể là một series) về những gì mình học được, làm được với Flutter. Đây giống như là một note, story ghi lại quá trình học của mình hơn là một tutorial. Mình không muốn viết vào đây những kiến thức lý thuyết khô khan, hàn lâm. Khả năng của mình cũng không cho phép mình làm việc đó. Mình chỉ muốn viết mọi thứ theo cách hiểu, theo cách nghĩ, và theo ngôn từ của mình.
Luyên thuyên đủ rồi, bắt đầu vào chủ đề chính luôn thôi.
Tại sao lại là Flutter?
Lý do chính chắc bởi vì trường mình dạy Flutter. Flutter là lựa chọn bắt buộc. Nếu không học mình sẽ trượt môn và đóng tiền học lại vì đây là môn chuyên ngành bắt buộc. Bố mẹ ở quê sẽ rất buồn về mình.
Lý do tiếp theo có lẽ là Flutter là một công nghệ lập trình cross platform. Hiểu đơn giản, lập trình cross platform có nghĩa là bạn tạo ra ứng dụng trên nhiều nền tảng khác nhau chỉ từ một codebase duy nhất (single codebase). Flutter hỗ trợ các nền tảng sau:
- Window
- MacOS
- Linux
- Android
- IOS
- Web
- Có thể hỗ trợ các nền tảng khác nữa mà mình không biết. Nhưng biết nó hỗ trợ bằng này nền tảng cũng quá đủ rồi.
Nghe thật diệu kỳ đúng không? Trước đây, khi code xong cho android, nếu muốn build thêm cho IOS, người ta phải dịch code sang IOS (đương nhiên phải học thêm Swift hoặc Objective C của Apple, hoặc không nếu đã biết). Với fluter, bạn chỉ cần code một lần duy nhất, việc build ra các nền tảng khác Flutter sẽ lo hết cho bạn.
Đương nhiên, cái gì dành cho số đông cũng không thể tối thiểu bằng việc cá nhân hóa. Quần áo mua không thể vừa vặn bằng quần áo may được. Mọi thứ đều là sự đánh đổi. Build đa nền tảng, cái lợi là code ít hơn, nhưng phải đánh đổi bằng hiệu năng so với việc code riêng cho từng nền tảng.
Ngoài Flutter, còn một công nghệ nổi tiếng khác cũng có tính năng cross platform, dó là React native. Kiến trúc của hai công nghệ này khác nhau, nhưng điểm chung là đều cần phải có một bộ dịch để dịch code sang kiến trúc của các nền tảng khác nhau. Về hiệu năng thì theo trí nhớ của mình, flutter có hiệu năng cao hơn một chút so với react native.
Đôi nét về Flutter
Flutter là một framework do Google phát triển vào năm ... (mình không nhớ nữa, hình như lần phát hành phiên bản ổn định đầu tiên năm 2018) dựa trên ngôn ngữ lập trình Dart (cũng có Google phát triển). Mình có cảm giác như kiểu Google tạo ra Dart với mục đích chính để xây dựng một framework nào đó ấy.
Flutter là một UI framework với cú pháp ngoặc ngôn ngữ C (C-style), hỗ trợ lập trình hướng đối tượng với cú pháp như Java, xây dựng giao diện với cơ chế Widget, giống với tư duy code HTML/CSS.
Nếu bạn nào đã học chắc môn Nhập môn lập trình (hoặc tên khác nhưng nội dung tương đương, đại loại là môn lập trình đầu tiên ở trường đại học), Lập trình hướng đối tượng và Xây dựng ứng dụng web thì học sang Flutter bạn sẽ tiếp cận được rất là dễ dàng. Mình học trên lớp thì buổi đầu quét sạch cú pháp của lập trình Dart, buổi thứ hai quét sạch hướng đối tượng trong Dart, buổi thứ ba chuyển sang Flutter.
Có cần học Dart trước khi học Flutter không?
Mình nghĩ là có. Một chút chút.
Don't worry nếu bạn đã nắm chắc ba môn mình vừa đề cập. Bạn có thể viết ngay chương trình Hello World đầu tiên bằng Flutter mà không cần biết Dart là gì. Nhưng để việc học mượt mà hơn, có lẽ mình sẽ viết 1 (hoặc 2 gì đó) bài đi nhanh toàn bộ cú pháp cơ bản của Dart.
Còn nếu bạn chưa nắm chắc ba môn kia, mình nghĩ có lẽ bạn chưa thực sự phù hợp để tìm hiểu Flutter. Nói gì nói, đây vẫn là một môn chuyên ngành của trường mình, và không phải một sinh viên mới vào trường hoặc một sinh viên năm 3 nhưng rỗng kiến thức có thể học được. Học môn chuyên ngành mà dễ thế thì quê mình đua nhau bán nhà cho con cái đi học đại học hết rồi.
Viết chương trình Hello World đầu tiên
Bước 1: Cài đặt môi trường
Mình dùng Windows 11 nên trong bài mình sẽ hướng dẫn trên Windows 11.
Để chạy được Flutter, máy của bạn cần có 2 thứ sau:
- Android Studio
- Flutter SDK
- [Optional] Một text editor bất kỳ (recommend neovim nhưng mình sẽ hướng dẫn trên VSCode)
Mình coi như máy bạn chưa có gì. Nếu máy bạn đã có công cụ tương ứng, vui lòng bỏ qua bước cài công cụ đó.
[Optional] Nếu gặp lỗi trong quá trình setup và chạy, recommend gỡ cài đặt cả 3 công cụ như trên và tải lại từ đầu theo hướng dẫn của mình.
Bước 1.1: Tải scoop
Bước 1.1.1: Tải scoop
Ở đây, mình dùng scoop để quản lý mọi thứ. Hiểu đơn giản, scoop là một trình quản lý cài đặt gói (ứng dụng, phần mềm) trên Windows. Nếu Python có pip, Nodejs có npm, Lua có Luarocks thì Windows có scoop. Đây là một trình quản lý gọn nhẹ, tập trung.
Chúng ta sử dụng scoop để cài đặt tất cả các công cụ còn lại.
Để cài đặt scoop, mở Windows terminal và thực hiện lệnh sau:
Set-ExecutionPolicy RemoteSigned -Scope CurrentUser
irm get.scoop.sh | iex
Thông thường, bất kỳ một công cụ nào cài đặt trên máy đều cung cấp lệnh thường là:
[name_tool] --version
để kiểm tra xem công cụ đó đã được cài đặt thành công trên máy chưa. Scoop cũng không ngoại lệ. Để kiểm tra xem scoop đã được cài đặt chưa, gõ lệnh:
scoop --version
Nếu kết quả xuát hiện như hình dưới, hoặc tương tự (miễn không phải những dòng chữ đỏ lòm) nghĩa là scoop đã được cài đặt thành công
Bước 1.1.2: Tải Git
Tại sao phải tải Git?
Kệ đi, mình bảo tải thì cứ tải.
Để tải git, sử dụng lệnh sau:
scoop install git
Bước 1.1.3: Thêm bucket extras
Mặc định scoop chỉ có bucket main. Hiểu đơn giản, bucket là các kho lưu trữ ứng dụng, giống như kiểu chợ ứng dụng CH Play trên Android hoặc App Store trên IOS.
Bucket main có số lượng ứng dụng hạn chế. Chúng ta cần thêm bucket extras để tải được nhiều thứ hay ho hơn.
Để thêm bucket extras, ta sử dụng lệnh sau:
scoop bucket add extras
Ở bước 1.1.2, mình muốn các bạn tải Git vì việc thêm bucket yêu cầu Git.
Bước 1.2: Tải VSCode
Scoop lợi ở chỗ bạn không cần lên trình duyệt gõ ứng dụng cần tải, chọn version phù hợp, download, giải nén hoặc chạy file thực thi (executable). Với scoop, bạn chỉ cần một lệnh duy nhất.
Để tải VSCode, sử dụng lệnh sau:
scoop install vscode
Đến đây, chắc bạn cũng hình dung ra cú pháp để tải một thứ gì đó qua scoop (nếu scoop hỗ trợ, bởi không phải ứng dụng nào scoop cũng hỗ trợ, nhất là những ứng dụng thiên về đồ họa).
Cú pháp chung để tải một ứng dụng qua scoop như sau:
scoop install [name_app]
Để xem danh sách ứng dụng đã cài đặt qua scoop, sử dụng lệnh sau:
scoop list
Để update ứng dụng đã tải, sử dụng lệnh sau:
scoop update [name_app]
Note: Không update thủ công các ứng dụng được cài đặt bởi scoop. Chỉ update qua một và chỉ một cách thức: Sử dụng lệnh update mình đề cập ở trên.
Bước 1.3: Tải Flutter
Để tải Flutter, sử dụng lệnh sau
scoop install flutter
Để kiểm tra xem Flutter đã cài đặt thành công chưa, sử dụng lệnh sau:
Kiểm tra kiến thức: Sử dụng lệnh kiểm tra một
công cụ đã được cài đặt thành công chưa để kiểm tra flutter
Bước 1.4: Cài đặt Android Studio
Để cài đặt Android Studio, sử dụng lệnh sau:
scoop install android-studio
Sau khi cài đặt thành công Android Studio, thực hiện các bước sau để mở:
- Ấn phím Windows (có biểu tượng cửa sổ)
- Gõ "android"
- Cửa sổ hiện ra có ứng dụng Android Studio, click chuột vào ứng dụng
Sau khi mở ứng dụng, cần thực hiện trình tự setup như sau: