Báo cáo thực tập lập trình ứng dụng di động với flutter

Sau khoảng thời gian học tập tại trường, mong muốn có thêm kinh nghiệm thực tế, tham gia vào môi trường phát triển phần mềm chuyên nghiệp, em quyết định chọn Vitalify Asia – một công ty

KHOA CÔNG NGHỆ PHẦN MỀM



BÁO CÁO THỰC TẬP LẬP TRÌNH ỨNG DỤNG DI ĐỘNG VỚI FLUTTER

Công ty thực tập: Vitalify Asia Người phụ trách: Nguyễn Thị Nhi (BPM) Thực tập sinh: Nguyễn Dương Tùng

Thành phố Hồ Chí Minh, 08/08/2022

NỘI DUNG

LỜI CẢM ƠN 4

NHẬN XÉT CỦA KHOA 5

A CHƯƠNG 1: Giới thiệu công ty thực tập 6

1 Giới thiệu chung 6

2 Sản phẩm & dịch vụ của công ty 6

B CHƯƠNG 2: Nội dung thực tập 8

1 Tìm hiểu công ty và các kỹ năng cơ bản trong công ty 8

2 Nghiên cứu kỹ thuật 8

3 Tìm hiểu và tập huấn quy trình làm việc, kiến thức mới 9

3.1 Các công cụ và quy trình làm việc 9

3.2 Tìm hiểu về Framework Flutter 9

3.3 Tìm hiểu về Firebase 11

C CHƯƠNG 3: Thực hiện dự án 13

1 Thực hiện dự án 13

2 Lịch làm việc 13

D CHƯƠNG 4: Chi tiết dự án 16

1 Giới thiệu 16

2 Thực hiện 18

3 Kế hoạch 18

3.1 Giai đoạn 1 18

3.2 Giai đoạn 2 19

3.3 Giai đoạn 3 19

TỔNG KẾT 20

DANH MỤC TÀI LIỆU THAM KHẢO 21

LỜI MỞ ĐẦU

Việt Nam trong những năm qua phát triển mạnh mẽ về khoa học, kỹ thuật và đặt biệt là công nghệ thông tin, nhờ những chính sách cởi mở, thúc đẩy phát triển, số hoá hiện đại hoá Ví dụ điển hình và gần nhất chính là các ứng dụng kiểm soát và hỗ trợ người dân chống dịch trong đại dịch Covid 19 đã góp phần không nhỏ vào thành công đẩy lùi dịch bệnh

Với xu thế phát triển các ứng dụng trên thiết bị di động, các chính sách thúc đẩy phát triển ứng dụng công nghệ cao Những công ty phát triển phần mềm với sứ mệnh tạo

ra các sản phẩm của trí tuệ Việt – “made in Vietnam” ngày càng được chú trọng và tạo điều kiện phát triển và em cho rằng sẽ là xu thế trong tương lai Vì lý do này, em quyết định chọn lập trình ứng dụng di động làm định hướng học tập, phát triển sự nghiệp sau này

Sau khoảng thời gian học tập tại trường, mong muốn có thêm kinh nghiệm thực

tế, tham gia vào môi trường phát triển phần mềm chuyên nghiệp, em quyết định chọn Vitalify Asia – một công ty có nền tảng đa quốc gia, chuyên nghiệp và cởi mở để làm nền tảng đầu tiên trong con đường sự nghiệp

Trân trọng cảm ơn, và chúc sức khoẻ

Đồng thời, trân trọng cảm ơn thầy cô trong khoa Công nghệ phần mềm đã nhiệt tình hỗ trợ, tạo điều hiện để em thực hiện bài báo cáo

Nguyễn Dương Tùng – 20/08/2022

NHẬN XÉT CỦA KHOA

A CHƯƠNG 1: Giới thiệu công ty thực tập

1 Giới thiệu chung

• Tên công ty: Vitalify Á Châu (Vitalify Asia)

• Địa chỉ: 224A Điện Biên Phủ, Phường 6, Quận 3, Thành phố Hồ Chí Minh

• Trang web: https://www.vitalify.asia/

• Điện thoại: 028 3932 6293

Vitalyfy Asia được thành lập vào năm 2008, là một công ty outsourcing tập trung vào mảng phát triển phần mềm trên ứng dụng di động với sứ mạng “đưa những giá trị hạnh phúc thông qua internet”

Vitalify Asia có mục tiêu trở thành một công ty chuyên nghiệp có thể đảm nhận các

dự án mang tầm vóc quốc tế Chính sách phát triển của công ty đó là: mỗi nhân sự từ kỹ

sư, quản lý,… có trách nhiệm mở rộng vai trò và phạm vi công việc, tinh thần trách nhiệm của chính bản thân để mang lại giá trị cho người dùng với cấu trúc tổ chức phân thành các nhóm nhỏ ưu tú

Sau hơn 10 năm thành lập, Vitalify Asia bước vào một giai đoạn thử thách mới nhằm nâng cao hơn nữa giá trị kỹ thuật của công ty tại Việt Nam Mục tiêu tạo ra những sản phẩm “made in Vietnam” tiêu chuẩn quốc tế

2 Sản phẩm & dịch vụ của công ty

Vitalify Asia nhận gia công phát triển web và ứng dụng di động cho phù hợp với yêu cầu của tôt chức và doanh nghiệp Đội nhóm của Vitalify Asia có tính chất đa quốc gia, có thể hoạt động từ xa, Vitalify Asia cam kết mang đến những sản phẩm với giá trị bền vững và nhanh chóng cho doanh nghiệp

Vitalify Asia có kinh nghiệm phát triển các hệ thống, ứng dụng trên đa dạng các lĩnh vực, với khả năng hoạt động real-time bao gồm nhiều gia đoạn phát triển khác nhau

từ lên kế hoạch, vận hành và phát triển, cập nhật về sau

Các sản phẩm của Vitalify Asia có thể kể đến như sau:

NativeCamp

Nền tảng trực tuyến gia sư dạy tiếng anh chuyên sâu Native Camp là một trong những nền tảng trường học tiếng anh lớn nhất tại Nhật Bản Native Camp giúp người dùng học tập tiếng Anh với tất cả 4 kỹ năng: nghe, nói, đọc, viết ngoài ra còn có các chức năng đánh giá, kiểm tra khả năng tiếng Anh, học trực tiếp với giáo viên hoặc thông qua các tài nguyên có sẵn

Các sản phẩm ứng dụng game

Vitalify Asia phát triển nhiều tựa game giải trí trên thiết bị di động với lối chơi đơn giản Một số trong đó có sử dụng công nghệ AR tăng cường thực tế ảo như Face Emotion – Xác định cảm xúc, Zombie Doors AR

B CHƯƠNG 2: Nội dung thực tập

Trong khoảng thời gian thực tập tại công ty, sinh viên có cơ hội học tập thêm các kiến thức chuyên môn, tiếp xúc với các quy trình thực hiện dự án, giải quyết các vấn đề phát sinh trong một dự án thực tế Sinh viên được nâng cao kĩ năng phần tích yêu cầu, đặt câu hỏi, tương tác trực tiếp với khách hàng và các thành viên trong đội phát triển Ngoài ra, sinh viên còn có cơ hội phát triển các kỹ năng mềm như nghiên cứu thông tin, thuyết trình, giao tiếp

1 Tìm hiểu công ty và các kỹ năng cơ bản trong công ty

Thời gian: 2 ngày

Nội dung: Giới thiệu về công ty, cơ cấu tổ chức của công ty, các chấm công, tính

lương, quyền lợi và văn hoá làm việc của công ty

Sinh viên được giới thiệu về cơ cấu tổ chức của công ty, cách phân đội nhóm, cách thức tiếp nhận dự án của đội nhóm, cách tiếp nhận và giải quyết các task nhiệm vụ và báo cáo hàng ngày

Trong thời gian này, sinh viên được công ty đánh giá sơ lược về khả năng để chuyển về các đội nhóm phù hợp với năng lực Sinh viên được cấp quyền truy cập các tài nguyên nội bộ, chỉ dẫn của công ty, email domain riêng để tương tác với hệ thống của khách hàng

Kết quả: Có hiểu biết về cơ cấu hoạt động của công ty, quy trình phát triển phần

mềm Scrum, cách tham gia các cuộc họp nội bộ và với khách hàng, cách tiếp nhận nhiệm

vụ và báo cáo hàng ngày

2 Nghiên cứu kỹ thuật

Thời gian: 3 ngày

Nội dung: Trong thời gian chờ đợi được phân vào đội nhóm thực hiện dự án thực

tế cũng như chờ các tài khoản nội bộ được kích hoạt, sinh viên được giao tìm hiểu về các cơ chế cơ bản của Flutter như state là gì? widget là gì? Phân biệt tính chất của widget tree, render tree,… Tìm hiểu về thư viện MobX và kiến trúc BloC dùng để quản lý state của một ứng dụng Flutter một cách đơn giản và tường minh

Kết quả: Hiểu rõ hơn về Flutter, nắm bắt được các lý thuyết hoạt động của

Framework này Hiểu biết về thư viện MobX và kiến trúc BloC về cách thức vận hành cũng như xây dựng ứng dụng demo

3 Tìm hiểu và tập huấn quy trình làm việc, kiến thức mới

3.1 Các công cụ và quy trình làm việc

Thời gian: 4 ngày

Nội dung: Sau khi tiếp nhận các tài khoản nội bộ Sinh viên được hướng dẫn

về DevOps, CI/CD, các nguyên tắc, quy ước trong mã nguồn và cách làm việc với GitLab, quá trình review mà merge mã nguồn Sinh viên được yêu cầu đọc và review trước mã nguồn, tài liệu của dự án trước khi chính thức nhận nhiệm vụ thao tác trực tiếp trên mã nguồn

Thực hiện: Tham gia buổi hướng dẫn, đọc các tài liệu liên quan đến các công

cụ được sử dụng để phát triển dự án

Kết quả: Hiểu được tổng quan về dự án, các tác nhân trong và ngoài có liên

quan, hiểu được mã nguồn và các quy ước chung khi thao tác trên dự án Hiểu biết về DevOps, CI/CD và cách thao tác với GitLab

3.2 Tìm hiểu về Framework Flutter

Thời gian: 2 ngày

Nội dung: Được giao nhiệm vụ tìm hiểu các lý thuyết hoạt động của Flutter,

cách thức vận hành của một ứng dụng Flutter Các nội dung chính được tóm tắt như sau:

Widget: “Mọi thứ trong Flutter đều là Widget” – một câu nói nổi tiếng trong tài liệu chính thức của Flutter, khi học trên trường, em cũng cho rằng như vậy, tuy nhiên khi tìm hiểu sâu hơn thì Widget dường như là một bản thiết kế, Flutter dựa vào bản thiết kế này để render ra các thành phần UI, các thành phần này thực chất là Element và RenderObject

Element: Là đại diện cho instance của một Widget tại một vị trí cụ thể trong

hệ thống cây, đây là thành phần UI thật để hiển thị trên màn hình

RenderObject: Chịu trách nhiệm căn chỉnh kích thước, sắp xếp vị trí, canh chỉnh, hoàn thiện tô màu cho Element

Quan hệ giữa Element, Widget và State: Trong hàm runApp, ta truyền vào một Widget Tree với MyApp là root Widget Flutter sẽ đi từ rôt đến hết cây, mỗi Widget trên cây sẽ gọi hàm createElement để tạo các Element và từ đó tạo nên Element Tree Stateful Widget sẽ tạo ra Stateful Element tham chiếu đến state cụ thể và Stateless Widget sẽ tạo ra Stateless Element và chỉ tham chiếu đến Widget

Quan hệ giữa Widget, Element và RenderObject: mỗi RenderObjectElement khi được gắn lên Element Tree sẽ nhờ widget mà nó đang nắm giữ gọi hàm createRenderObject() để tạo ra object renderObject và nó sẽ nắm giữ tham chiếu của renderObject Từ renderObject sẽ nhờ các hàm paint, performLayout để tạo nên giao diện hiển thị

Quá trình rebuild: Mỗi lần Widget bị rebuild, Element sẽ so sánh Widget và State xem có gì khác so với ban đầu không rồi đưa đến quyết định xây dựng lại

Cơ chế Hot reload: Khi thực hiện bất kì thay đổi nào trong mã thì có thể thấy chúng ngay lập tức mà không cần phải khởi động lại ứng dụng bằng cơ chế thay đổi thêm bớt mã ngay trong run time giúp tiết kiệm thời gian

Thực hiện: Đọc tài liệu, tham gia buổi hướng dẫn, chia sẽ kiến thức

Kết quả: Có hiểu biết sâu hơn về cách thức vận hành của Framework Flutter,

các ưu điểm và hạn chế so với các Framework khác, khi nào và trong tình huống nào thì nên dùng Framework này

3.3 Tìm hiểu về Firebase

Thời gian: 1 ngày

Nội dung: Tìm hiểu về các dịch vụ của Firebase mà dự án đang sử dụng như: Authentication, Firebase Cloud Messaging Nội dung chính được tóm tắt như sau:

Phone authentication: Cho phép ứng dụng được đăng nhập sử dụng số điện thoại để xác thực Một SMS sẽ được gửi đến người dùng theo số điện thoại mà người dùng cung cấp, chứa một mã số duy nhất Khi mã số này được xác thực bởi Firebase, người dùng chuyển thành trạng thái đã đăng nhập

Firebase Cloud Messaging: Là một giải pháp đa nền tảng giúp dễ dàng gửi các đoạn thông báo nhanh chóng và tiết kiệm Server sẽ nhận đoạn tin nhắn cần thông báo đến người sử dụng ứng dụng Firebase sẽ chịu trách nhiệm gửi đến các thiết

bị có cài đặt ứng dụng thông qua một mã gọi là Token

Thực hiện: Đọc tài liệu, tham gia buổi hướng dẫn, chia sẽ kiến thức

Kết quả: Biết phương thức hoạt động của dịch vụ Authentication và Firebase

Cloud Messaging được cung cấp bởi Firebase

C CHƯƠNG 3: Thực hiện dự án

1 Thực hiện dự án

Trong khoảng thời gian 1 tháng được hướng dẫn và thực hiện công việc trực tiếp trên dự án thực tế, sinh viên có những hiểu biết sâu sắc hơn về quy trình phát triển phần mềm Scrum, các kiến thức kỹ thuật liên quan đến phát triển ứng dụng cross platform Cách tiếp nhận feedback nội bộ cũng như từ khách hàng để hoàn thiện sản phẩm, đảm bảo chất lượng sản phẩm cao nhất

2 Lịch làm việc

hướng dẫn

Mức độ hoàn thành

Nhận xét của người hướng dẫn

1

Tìm hiểu về công ty, các tổ

chức sắp xếp đội nhóm của

công ty

Làm quen với các công cụ

giao tiếp, hệ thống của công

ty

Học cách tham gia các cuộc

họp, báo cáo hàng ngày

Bùi Bình Trung 100% Hoàn thành tốt

báo cáo, cách push code và

pull request trên GitLabs

Nguyễn Thị Nhi 100% Hoàn thành tốt

3

Tham gia họp Daily Scrum

Tham gia họp lấy ý kiến và

Huỳnh Văn Trận

100% Hoàn thành tốt

4

Tham gia họp Daily Scrum

Tham gia họp lấy ý kiến và

Huỳnh Văn Trận

100% Hoàn thành tốt

5

Tham gia họp Daily Scrum

Tham gia họp lấy ý kiến và

Huỳnh Văn Trận

100% Hoàn thành tốt

6

Tham gia họp Daily Scrum

Tham gia họp lấy ý kiến và

Huỳnh Văn Trận

100% Hoàn thành tốt

7

Tham gia họp Daily Scrum

Tham gia họp lấy ý kiến và

Huỳnh Văn Trận

100% Hoàn thành tốt

8

Hoàn thành các tài liệu thực

tập

Tham gia các cuộc họp

review, đánh giá quá trình

thực tập và các chức năng đã

thực hiện

Nguyễn Thị Nhi 100% Hoàn thành tốt

D CHƯƠNG 4: Chi tiết dự án

1 Giới thiệu

Tên Project: dgHome

Mô tả: Là phần mềm được phát triển bởi Vitalify Asia dành cho đối tác là

Mitsubishi và Vinhome Ứng dụng giúp quảng bá sản phẩm là các căn hộ của Vinhome bao gồm các hình ảnh, bài viết liên quan, xem 3D mô phỏng căn hộ, chăm sóc khách hàng, xem báo giá dự tính,…

Một số hình ảnh của phần mềm:

- Đọc, tìm hiểu các tài liệu khởi tạo của dự án

- Đọc, tìm hiểu bản thiết kế UI/UX của ứng dụng

- Đọc, tìm hiểu các framework, thư viện liên quan của dự án

3.2 Giai đoạn 2

- Tham gia chính thức vào dự án với quy trình làm việc Scrum, tham gia họp

kế hoạch đầu tuần, daily scrum, họp cuối tuần đánh giá

- Nhận các nhiệm vụ phù hợp với năng lực

- Nhận đánh giá và hướng dẫn từ cấp trên trực tiếp

- Sửa các lỗi phát sinh (nếu có) trong quá trình release sản phẩm cho khách hàng

3.3 Giai đoạn 3

- Đánh giá kết quả thực tập

- Hoàn thành tài liệu thực tập

TỔNG KẾT

Trong khoảng thời gian thực tập ngắn, em đã có thêm những kiến thức và kĩ năng thực tế, có cơ hội áp dụng những gì đã học trên ghế nhà trường Tuy còn nhiều thiếu sót

và non nớt về kinh nghiệm, em cho rằng công việc thực tập đầu tiên này sẽ là nền tảng,

bệ phóng cho con đường sự nghiệp trong tương lai

Một lần nữa, chân thành cảm ơn các anh chị tại công ty Vitalify Asia đã tận tình

hỗ trợ và giúp đỡ trong quá trình thực tập & các thầy cô khoa Công nghệ phần mềm đã tạo điều kiện để em có thể hoàn thành kì thực tập

DANH MỤC TÀI LIỆU THAM KHẢO

Flutter Document, truy cập 05/08/2022, từ https://flutter.dev/

FlutterFire Overview, truy cập 06/08/2022, từ