Đề tài sử dụng nền tảng anvil works minh họa chương trình chuyển Đổi số nhị phân sang thập phân bằng python

CÁC THÀNH PHẦN Đây là hình ảnh của Anvil Editor, với các phần quan trọng nhất được đánh số: 1 .Trình duyệt ứng dụng được mở theo mặc định và có thể được tìm thấy bằng cách nhấp vào nút Ứ

BỘ CÔNG THƯƠNG TRƯỜNG ĐẠI HỌC CÔNG THƯƠNG TP.HCM

KHOA CÔNG NGHỆ THÔNG TIN

-o0o MÔN: ẢO HÓA VÀ ĐIỆN TOÁN ĐÁM MÂY

ĐỀ TÀI: SỬ DỤNG NỀN TẢNG ANVIL.WORKS MINH HỌA CHƯƠNG TRÌNH CHUYỂN ĐỔI SỐ NHỊ PHÂN

SANG THẬP PHÂN BẰNG PYTHON

TP.HCM, tháng 02 năm 2024

BỘ CÔNG THƯƠNG TRƯỜNG ĐẠI HỌC CÔNG THƯƠNG TP.HCM

KHOA CÔNG NGHỆ THÔNG TIN

MÔN: ẢO HÓA VÀ ĐIỆN TOÁN ĐÁM MÂY

GVHD: Phạm Tuấn Khiêm Lớp: Sáng thứ 5, Tiết 1-3 NHÓM THỰC HIỆN:

1 Trần Huỳnh Nghĩa – 2001215983

2 Trương Thị Ngọc Nhi – 2001216005

3 Nguyễn Thiện Nhân – 2001215999

4 Đinh Quang Cường - 2001215646

ĐỀ TÀI: SỬ DỤNG NỀN TẢNG ANVIL.WORKS MINH HỌA CHƯƠNG TRÌNH CHUYỂN ĐỔI SỐ NHỊ PHÂN

SANG THẬP PHÂN BẰNG PYTHON

MỤC LỤC

M c ụ l c ụ

LỜI MỞ ĐẦU 2

GIỚI THIỆU 3

CÁC THÀNH PHẦN 4

CÁC CHỨC NĂNG CHÍNH 5

THỰC HÀNH 21

LỜI MỞ ĐẦU

Trong thời đại số hóa ngày nay, việc phát triển ứng dụng web đang trở nên ngày càng phổ biến và cần thiết hơn bao giờ hết Tuy nhiên, việc xây dựng các ứng dụngweb đòi hỏi kiến thức vững vàng về nhiều ngôn ngữ lập trình như HTML, CSS, JavaScript cùng với việc hiểu về các framework và thư viện đi kèm Điều này đặc biệt gây khó khăn đối với những người mới bắt đầu hoặc những lập trình viên chuyên sâu vào một ngôn ngữ cụ thể Anvil.works ra đời như một giải pháp cho vấn đề này Đây là một nền tảng xây dựng ứng dụng web toàn diện chỉ bằng một ngôn ngữ duy nhất - Python Với sứ mệnh làm cho việc phát triển ứng dụng web trở nên dễ dàng và tiếp cận hơn đối với mọi người, Anvil.works không chỉ giảm bớt rào cản về kỹ thuật mà còn tạo ra một môi trường thân thiện cho việc sáng tạo IAnvil.works cung cấp một loạt các tính năng mạnh mẽ cho việc phát triển ứng dụng web như : Xây dựng ứng dụng tương tác hoàn chỉnh Với Anvil, bạn có thể tạo ra các ứng dụng web đa chức năng với các thành phần tương tác như form, button, table một cách dễ dàng Lưu trữ cơ sở dữ liệu và quản lý người dùng: Anvilcho phép bạn lưu trữ và quản lý dữ liệu của ứng dụng một cách thuận tiện thông qua các cơ sở dữ liệu tích hợp sẵn Sau khi hoàn thành, bạn có thể xuất bản ứng dụng của mình trực tuyến chỉ trong vài bước đơn giản Hỗ trợ đa nền tảng: Anvil cho phép bạn phát triển ứng dụng cho cả web và các thiết bị di động một cách linh hoạt Với chỉ một ngôn ngữ lập trình là Python, Anvi.works là lựa chọn lý tưởng cho cả những người mới bắt đầu và những người có kinh nghiệm Bằng cách loại

bỏ sự phức tạp của việc học nhiều ngôn ngữ và framework, Anvil giúp giảm thời gian và công sức cần thiết cho việc phát triển ứng dụng Bên cạnh đó Anvil.works

có một cộng đồng sôi nổi và hỗ trợ mạnh mẽ từ cộng đồng người dùng, giúp bạn giải quyết vấn đề nhanh chóng và hiệu quả Anvil.works không chỉ là một công cụ,

mà còn là một cách tiếp cận mới mẻ và sáng tạo cho việc phát triển ứng dụng web Với sự linh hoạt, dễ sử dụng và mạnh mẽ, Anvil mở ra cánh cửa cho mọi người để biến ý tưởng của họ thành hiện thực trên nền tảng web Hãy cùng tham gia vào cuộc cách mạng này và khám phá sức mạnh của Anvil.works ngay hôm nay!

CÁC THÀNH PHẦN

Đây là hình ảnh của Anvil Editor, với các phần quan trọng nhất được đánh số:

1 Trình duyệt ứng dụng được mở theo mặc định và có thể được tìm thấy bằng cách nhấp vào nút Ứng dụng trong Menu thanh bên Nó cho phép bạn chọn phần nào của ứng dụng bạn đang chỉnh sửa:

+ Mã máy khách (Client code) (giao diện người dùng và mã Python chạy trong trình duyệt web)

+ Mã máy chủ (Server code) (mã chạy trong môi trường Python phía máy chủ) + Assets (HTML, CSS và các tệp đã tải lên khác cho ứng dụng của bạn Việc chỉnhsửa những nội dung này là hoàn toàn không bắt buộc.)

2.Sidebar Menu là nơi bạn định cấu hình ứng dụng của mình, tìm nhật ký ứng dụngcũng như thêm các thư viện và tích hợp dựng sẵn như Bảng dữ liệu (Data Tables) , Quản lý người dùng (User management) , v.v

1 Form Editor : hiển thị giao diện người dùng của bạn và cho phép bạn kéo và thả các thành phần để tạo giao diện người dùng của mình

Trình chỉnh sửa biểu mẫu có ba chế độ:

+ Design View: cho bạn biết form của bạn sẽ trông như thế nào khi ứng dụng của bạn đang chạy

+ Code View: hiển thị cho bạn lớp Python mô tả cách form của bạn hoạt động

+ Split View: hiển thị cả thiết kế form và mã Python của bạn

2 Object Palette :cho phép bạn chỉnh sửa nhanh chóng và dễ dàng các thuộc tính được chỉnh sửa phổ biến nhất của thành phần

3 The Version History Panel : hiển thị lịch sử cam kết của ứng dụng và cho phép bạn tạo các nhánh mới và sao chép ứng dụng của mình bằng Git

4 The Background Tasks Panel : hiển thị mọi tác vụ đang chạy trong nền

5 App Console : sẽ xuất hiện sau khi chạy ứng dụng của bạn Nó hiển thị kết quả đầu ra của ứng dụng từ printcác câu lệnh và ngoại lệ

6 Run Button : chạy ứng dụng trong Trình chỉnh sửa và hiển thị Bảng điều khiển ứng dụng App Console(phím tắt: Ctrl-Enter) Nhấp vào menu dấu chấm sẽ cung cấp cho bạn tùy chọn chạy ứng dụng ở chế độ xem tách rời hoặc trong cửa sổ mới

7 Publish Button : cho phép bạn xuất bản ứng dụng của mình một cách công khai hoặc riêng tư Tại đây, bạn có thể thêm và định cấu hình môi trường cho ứng dụng của mình

8 Hộp công cụ Toolbox là nơi bạn chọn các thành phần mới để thêm vào giao diện người dùng của mình

9 Bảng Thuộc tính ( Properties Panel )cho phép bạn định cấu hình thành phần bạn

đã chọn trong Trình chỉnh sửa biểu mẫu (Bạn có thể chọn các thành phần bằng cách nhấp vào chúng.)

10 Cây thành phần (Component Tree ) hiển thị thứ bậc của các thành phần trong Biểu mẫu hiện tại và cho phép bạn di chuyển các thành phần trong Biểu mẫu

CÁC CHỨC NĂNG CHÍNH

Ở đây chúng ta hãy cùng tìm hiểu các chứng năng qua từng thành phần

Click ‘More components’ để xem thêm :

Phần Thành phần chủ đề ( Theme Elements ) của Hộp công cụ chứa các thành phần có kiểu dáng riêng chủ đề của ứng dụng hiện tại

2 Object Palette ( Bảng đối tượng )

Khi bạn thả hoặc chọn một thành phần trong trình thiết kế, bạn sẽ thấy Bảng đối tượng phía trên thành phần đó

Điều này cho phép bạn nhanh chóng và dễ dàng chỉnh sửa các thuộc tính được chỉnh sửa phổ biến nhất của thành phần:

Để chỉnh sửa danh sách đầy đủ các thuộc tính cho một thành phần đã chọn, bạn có thể vào Bảng thuộc tính hoặc bạn có thể đặt chúng trong mã Bạn cũng có thể sử dụng Bảng đối tượng để thiết lập trình xử lý sự kiện Đối với các thành phần có sự kiện, bạn sẽ thấy nút cho phép bạn thiết lập trình xử lý sự kiện cho sự kiện phổ biến nhất của thành phần Ví dụ: bạn có thể thiết lập clicksự kiện cho thành phần Nút từ Bảng đối tượng.

3 Bảng thuộc tính ( Properties Panel ) :

Đối với các thuộc tính không có trong Bảng đối tượng, bạn có thể sử dụng Bảng thuộc tính - bảng này chứa tất cả các thuộc tính cho thành phần được chọn

Bảng Thuộc tính được chia thành các phần phụ; nhiều thuộc tính không được hiển thị cho đến khi bạn nhấp vào nút ' moore ' cho phần phụ có liên quan (điều này giữcho Bảng Thuộc tính có độ dài có thể quản lý được) Mỗi Form đều có thuộc tính

Bạn có thể sửa đổi các thuộc tính của Biểu mẫu bằng Bảng Thuộc tính khi không

có thành phần nào được chọn Để sửa đổi tên thành phần trong mã Python của ứng dụng, hãy sử dụng nút chỉnh sửa bên cạnh thuộc tính name ở đầu Bảng thuộc tính (hoặc chỉnh sửa tên trong Bảng đối tượng )

4 Các sự kiện ( events )

Bạn cũng có thể thiết lập trình xử lý sự kiện cho các thành phần của mình trong Bảng thuộc tính Các sự kiện của mỗi thành phần được hiển thị ở cuối Bảng Thuộc tính Bạn có thể nhập tên của phương thức Python vào hộp và phương thức đó sẽ chạy khi sự kiện diễn ra Phương thức này phải là một phương thức của Biểu mẫu

mà thành phần đó đang bật

5 Trình chỉnh sửa biểu mẫu

Trình chỉnh sửa biểu mẫu có ba chế độ: Chế độ xem thiết kế, Chế độ xem mã và Chế độ xem phân tách Bạn chọn chế độ xem của mình bằng cách sử dụng các nút

ở đầu Trình chỉnh sửa biểu mẫu:

6 Chế độ xem thiết kế ( design )

Chế độ xem thiết kế cho bạn biết giao diện thiết kế của bạn sẽ trông như thế nào khi ứng dụng của bạn đang chạy Đây là nơi bạn kéo và thả các thành phần để tạo giao diện người dùng của mình Nó cũng hiển thị Bảng đối tượng , Hộp công cụ , Bảng thuộc tính và Cây thành phần

Menu Thanh bên chứa nhiều tùy chọn hơn để xây dựng và định cấu hình ứng dụng của bạn.

Đây là các tùy chọn được đưa ra trong Menu Thanh bên:

Ứng dụng : Chế độ xem mặc định Hiển thị Trình duyệt ứng dụng

Dữ liệu : Thêm và định cấu hình Bảng dữ liệu và Cơ sở dữ liệu

Cài đặt : Định cấu hình cài đặt cho ứng dụng của bạn:

+ Chung : Thay đổi tên, mô tả và logo ứng dụng của bạn

+ Phiên bản Python : Chọn phiên bản Python chạy trên máy khách và trên máy chủ

+ Phụ thuộc : Thêm các ứng dụng khác để sử dụng làm thư viện hoặc định cấu hình ứng dụng của bạn để sử dụng làm thư viện

Bảng dữ liệu : Cấu hình cài đặt cho Bảng dữ liệu

Cộng tác ( Collaboration ) : Định cấu hình chia sẻ và sao chép ứng dụng của bạn Nhật ký ứng dụng : Nhận nhật ký ngoại lệ vàprint()đầu ra chỉnh sửa từ ứng dụng của bạn, được phân chia theo phiên người dùng và danh sách các tác vụ nền hiện tại và trước đây

Chủ đề : Thay đổi bảng màu của ứng dụng và thêm vai trò CSS vào các thành phầnkiểu Tìm kiếm : Tìm kiếm thông qua ứng dụng của bạn

Tìm kiếm : Tìm kiếm thông qua ứng dụng của bạn

Nhấp vào nút dấu cộng màu xanh lam

sẽ hiển thị menu để thêm nhiều tính năng hơn cho ứng dụng của bạn, bao gồm the Email service, the Users service, the Uplink, App Secrets and built-in integrations:

8 Trinh duyệt ứng dụng :

Nó liệt kê các phần chính của ứng dụng của bạn:

Mã ứng dụng khách - Biểu mẫu , Mô-đun và Gói xác định thiết kế giao diện ngườidùng và hành vi phía máy khách của ứng dụng của bạn

Mã máy chủ - Mô-đun máy chủ chạy Python phía máy chủ an toàn

Nội dung - HTML, CSS và các tệp được tải lên khác cho ứng dụng của bạn

Bạn cũng có thể sử dụng các dấu chấm bên cạnh Biểu mẫu và Gói hiện có để thêm biểu mẫu và Gói mới cũng như xóa và đổi tên mọi thứ Đối với Biểu mẫu và Mô-đun, menu này cũng cho phép chọn nội dung sẽ chạy khi ứng dụng của bạn khởi động Biểu mẫu có một số tùy chọn khác: bạn có thể sao chép chúng hoặc nhấp vào 'sử dụng làm thành phần' để làm cho chúng xuất hiện trong Hộp công cụ dưới dạng Thành phần tùy chỉnh :

9 Bottom Panel

- App Console :

Bảng điều khiển ứng dụng sẽ xuất hiện sau khi bạn chạy ứng dụng của mình Nó hiển thị đầu ra của printcác câu lệnh trong ứng dụng của bạn Nó cũng hiển thị dấuvết từ các trường hợp ngoại lệ chưa được xử lý và (đôi khi) các thông báo từ hệ thống Anvil về ứng dụng của bạn

- Nhấp vào tab Tác vụ nền để xem các tác vụ hiện đang chạy.

Lịch sử phiên bản Tab Lịch sử phiên bản hiển thị các thay đổi gần đây đối với ứng dụng của bạn và cho phép bạn thêm và chuyển đổi nhánh cũng như sao chép ứng dụng của bạn bằng Git

10 Component tree ( Cây thành phần )

11 Code styles và xóa sản phẩm

Anvil sử dụng mã Python ở phía máy khách và máy chủ Trình chỉnh sửa sử dụng các kiểu trực quan khác nhau cho mã máy khách và máy chủ

Để xóa một ứng dụng, hãy đi tới Cài đặt bằng cách nhấn vào nút bánh răng của Menu thanh bên Bấm vào Xóa ứng dụng , trong phần Quản lý ứng dụng này (Manage this App )

Publish app

Đổi tên subdomain

Chạy web vừa publish

THỰC HÀNH

Đề tài : MINH HỌA CHƯƠNG TRÌNH CHUYỂN ĐỔI SỐ NHỊ PHÂN SANG

THẬP PHÂN BẰNG PYTHON

1 Giới thiệu

Trong thế giới của lập trình và khoa học máy tính, việc chuyển đổi giữa các hệ số

là một phần quan trọng và thường xuyên xảy ra Để giúp các nhà phát triển và những người quan tâm về lĩnh vực này, chúng tôi đã phát triển một công cụ đơn giản nhưng mạnh mẽ trên nền tảng Anvil.works, cho phép bạn chuyển đổi số thập phân sang số nhị phân, hệ 16 và ngược lại chỉ bằng 1 vài thao tác đơn giản

2 Các chức năng chính :

+ Chuyển Đổi Số Thập Phân sang Số Nhị Phân và Hệ 16: Công cụ cho phép bạn nhập số thập phân và chuyển đổi nó thành số nhị phân và hệ 16 ngay lập tức + Chuyển Đổi Số Nhị Phân và Hệ 16 sang Số Thập Phân: Ngoài ra, công cụ cũng

hỗ trợ chuyển đổi ngược lại, từ số nhị phân và hệ 16 về dạng số thập phân

+ Giao Diện Thân Thiện và Dễ Sử Dụng: Giao diện của công cụ được thiết kế đơn giản và dễ sử dụng, giúp bạn thực hiện các phép chuyển đổi một cách nhanh chóng

và thuận tiện

3 Yêu cầu kĩ thuật

+ Chuyển đổi chính xác qua lại theo từng hệ đã lựa chọn

+ Kiểm tra nhập đúng hệ số trước khi chuyển đổi ( VD : hệ nhị phân thì số nhập vào thì phải là 0 hoặc 1 )

+ Kiểm tra nhập vào có đúng là số hay không , nếu không đúng thì báo lỗi yêu cầu nhập lại

4 Hướng dẫn sử dụng :

+ Nhập số thập phân cần chuyển đổi hoặc số nhị phân/hệ 16 tùy thuộc vào loại chuyển đổi bạn muốn thực hiện

+ Chọn loại chuyển đổi từ menu drop-down

+ Nhấn nút "Chuyển đổi" để xem kết quả ngay lập tức

5 Code đề tài:

Hàm này để kiểm tra sự lựa chọn trước khi chuyển đổi

Hàm này sẽ được gọi khi nhấn nút chuyển đổi , hàm sẽ kiểm tra xem giá trị nhập vào có đúng với giá trị đã thiết lập

Chuyển đổi qua lại giữa các giá trị tùy theo lựa chọn

LỜI KẾT

Chúng tôi xin gửi lời cảm ơn chân thành đến thầy cô đã hướng dẫn để chúng tôi cótham gia và khám phá công cụ chuyển đổi số thập phân, nhị phân và hệ 16 trên nềntảng Anvil.works Đây là một cơ hội quý báu để chúng tôi tìm hiểu kiến thức và trải nghiệm công cụ này Trân trọng, !