BÁO CÁO THỰC TẬP LẬP TRÌNH ỨNG DỤNG KẾT NỐI CAMERA IP TRÊN ANDROID

1 TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA CÔNG NGHỆ PHẦN MỀM BÁO CÁO THỰC TẬP LẬP TRÌNH ỨNG DỤNG KẾT NỐI CAMERA IP TRÊN ANDROID Công ty thực tập : KiteMetric Người phụ trách : Phạm Hoàng Hải Thực tập sinh : Đoàn Thị Thanh Hiếu TP Hồ Chí Minh, tháng 06 năm 2022 Thầy Phạm Hồng Hải Sinh viên Đoàn Thị Thanh Hiếu LỜI MỞ ĐẦU Ngày nay, phổ biến thiết bị di động tác động lớn đến phát triển ứng dụng chạy tảng di động khác Với tốc độ phát triển vô mạnh mẽ, ngành phát triển ứng dụng di động nhân tố kích thích phát triển cơng nghệ thông tin giới, phần cứng phần mềm Sau khoảng thời gian trau dồi kiến thức kỹ ghế nhà trường, với mong muốn thử sức, áp dụng kiến thức, kỹ sẵn có, muốn có kinh nghiệm từ dự án thực tế, muốn tiếp xúc văn hóa làm việc môi trường thuộc lĩnh vực công nghệ thông tin, nên em định tìm nơi phù hợp để thực tập Sau khoảng thời gian cân nhắc trao đổi với đại diện cơng ty, em có hội thực tập công ty KiteMetric – doanh nghiệp trẻ, động Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu LỜI CẢM ƠN Chỉ thời gian ngắn, nhờ dẫn, hỗ trợ nhiệt tình thầy phụ trách giúp cho em tiếp thu kiến thức quan trọng để làm ứng dụng di động Chân thành cảm ơn bạn team internship hỗ trợ lẫn nhau, khắc phục lỗi để hoàn thiện ứng dụng Kết nối camera IP Android Cũng xin cảm ơn thầy cô khoa Công nghệ phần mềm nhiệt tình hỗ trợ, tạo điều kiện em làm báo cáo Cuối cùng, em xin trân trọng gửi lời cảm ơn Công ty KiteMetric tạo điều kiện cho em có hội thực tập cơng ty Em xin chân thành cảm ơn! Đồn Thị Thanh Hiếu TpHCM, ngày 17 tháng 06 năm 2022 Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu NHẬN XÉT CỦA KHOA Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu MỤC LỤC MỤC LỤC Chương 1: Giới thiệu công ty thực tập Giới thiệu công ty KiteMetric Sản phẩm công ty Chương 2: Nội dung thực tập 10 Tìm hiểu cơng ty kỹ công ty 10 Nghiên cứu kỹ thuật 10 Thực project 15 Lịch làm việc 15 Chương 3: Chi tiết project 17 Giới thiệu ứng dụng 17 Thực 22 Kế hoạch 22 TÀI LIỆU THAM KHẢO 23 TỔNG KẾT 24 Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu Chương 1: Giới thiệu công ty thực tập Hình 1: Logo cơng ty KiteMetric Giới thiệu công ty KiteMetric KiteMetric thành lập năm 2012 công ty tư vấn công nghệ với sứ mệnh hỗ trợ doanh nghiệp thực hóa từ ý tưởng thành sản phẩm chất lượng cao - Về dịch vụ Web & Mobile development: Thiết kế xây dựng sản phẩm với hiệu cao với trải nghiệm người dùng tuyệt vời nhiều tảng - Về dịch vụ Machine Learning: xây dựng ứng dụng AI để tự động hóa tác vụ thủ cộng, cải thiện kinh doanh với trí thơng minh theo hướng liệu - Về dịch vụ User Experience: thiết kế mockups, thử nghiệm ý tưởng để xác thực ý tưởng đưa thiết kế UI/UX sáng tạo để mang lại độc đóa sản phẩm - Về dịch vụ Technology Consulting: Giúp định hình ý tưởng bạn, xác định rào cảng kỹ thuật, đề xuất giải pháp công nghệ phù hợp cho dự án Websit công ty: https://kitemetric.com/ Email công ty: hello@kitemetric.com Điện thoại: 028 6651 7777 Địa chỉ: 4th Floor, AGA Building, 72/24 Phan Dang Luu Street, Ward 5, Phu Nhuan District, Ho Chi Minh City, Vietnam Sản phẩm công ty Những công nghệ mà công ty KiteMetric sử dụng bao gồm: Nodejs, Java, Python, Javascript, ReactJS, VueJS, Docker, Kubernetes, native (iOS, Android, Windows) / cross-platform (React Native) mobile app development Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu Về mảng Máy học: Deep learning frameworks (Tensorflow, PyTorch, Caffe2), fundamental machine learning algorithms, object detection, recognition, tracking, video, and image processing Những sản phẩm bật công ty KiteMetric: FaceSwap ứng dụng thú vị cho phép người dùng thay khuôn mặt nhân vật tiếng ảnh khuôn mặt họ cách sử dụng ảnh từ máy ảnh Ứng dụng có sẵn Android iOS với nửa triệu người dùng Hình 2: Giao diện FaceSwap Blanket Inc công ty khởi nghiệp tài trợ tốt thành lập trung tâm Thành phố New York KiteMetric giúp Blanket xây dựng mắt sản phẩm từ ngày Sản phẩm ứng dụng dành cho thiết bị di động áp dụng hỗn hợp thuật toán để thực nhiệm vụ, đo lường khen thưởng hiệu suất nhân viên, đồng thời giúp tăng cường hiệu quản lý nhà hàng hoạt động hàng ngày họ Thầy Phạm Hoàng Hải Sinh viên Đồn Thị Thanh Hiếu Hình 3: Giao diện ứng dụng blanket Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu Bên cạnh cịn sản phẩm khác như: - Coinmarket: https://kitemetric.com/case-studies/coin-market/ - Vinasun Taxi: https://kitemetric.com/case-studies/vinasun/ - Foresight: https://kitemetric.com/case-studies/foresight/ - Tapviral: https://kitemetric.com/case-studies/tapviral/ Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu 10 Chương 2: Nội dung thực tập Triển khai team internship phát triển ứng dụng Kết nối camera IP Android nhằm mục đích giúp sinh viên thực tập đào tạo toàn diện cách thức tạo ứng dụng Android từ lúc lên ý tưởng sản phẩm hoàn thiện đời; bên cạnh cịn rèn luyện kỹ mềm làm việc nhóm, thuyết trình, giao tiếp q trình phát triển sản phầm Tại cơng ty, sinh viên có hội học tập, khám phá làm việc môi trường phát triển ứng dụng di động chuyên nghiệp, động Tìm hiểu công ty kỹ công ty Thời gian: ngày Nội dung: Giới thiệu công ty, cách thức tổ chức công ty Được nghe người phụ trách giới thiệu công ty, trình thành lập phát triển (như nhắc đến trên), quy trình làm việc từ cao xuống thấp, cách thức tổ chức cơng ty Ngồi ra, thực tập sinh giới thiệu cách thức làm việc công ty thời gian làm, quy định cần phải tuân thủ, cách sử dụng email công việc… Giới thiệu thành viên team internship nghe người phụ trách trình bày ý tưởng sản phẩm thực q trình thực tập cơng ty Giới thiệu cơng cụ, nguồn tài liệu hỗ trợ q trình học tập làm việc công ty Kết quả: Hiểu thêm văn hóa, q trình thành lập phát triển cơng ty KiteMetric Có thêm kỹ việc sử dụng email công việc, làm việc có kế hoạch, có kỷ luật, có trách nhiệm Nghiên cứu kỹ thuật 2.1 Các công cụ làm việc Thời gian: ngày Nội dung: Tìm hiểu công cụ sử dụng trình làm việc Trong thời gian này, supervisor hướng dẫn thực tập sinh tìm hiểu cơng cụ giúp ích cho cơng việc sau Một số phần mềm số như: Jira: sử dụng làm việc nhóm, sử dụng để theo dõi công việc, tiến độ làm việc quản lý dự án Figma: ứng dụng gồm nhiều công cụ thiết kế mạnh mẽ tảng website Với Figma, người dùng sáng tạo khơng giới hạn giao diện người dùng Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu 11 (UI/UX), thiết kế tạo mẫu, tạo đăng mạng xã hội nhiều dự án thiết kế khác Github: hệ thống quản lý dự án phiên code, hoạt động giống mạng xã hội cho lập trình viên Các lập trình viên clone lại mã nguồn từ repository Github dịch vụ máy chủ repository cơng cộng, người tạo tài khoản để tạo kho chứa riêng để làm việc Android Studio: IDE thức sử dụng phát triển ứng dụng Android dựa IntelliJ IDEA Chức Android Studio cung cấp giao diện giúp người dùng tạo ứng dụng xử lý công cụ file phức tạp sau hậu trường 2.2 Thực hiện: Thực hành sử dụng phần mềm nêu Kết quả: Cài đặt thành công ứng dụng, sử dụng chức ông cụ, phần mềm hỗ trợ cho tác vụ dự án Tìm hiểu ngơn ngữ Dart, Flutter Thời gian: 10 ngày (2 tuần) Nội dung: Tìm hiểu khái niệm, thuật ngữ Dart, kiến thức framework Flutter ❖ Dart: nắm kiến thức như: - Biến, câu lệnh điều khiển - Vòng lặp - Hàm - Lập trình hướng đối tượng - Các thư viện ❖ Flutter - Nắm lịch sử, ưu nhược điểm - Kiến trúc Flutter framework - Widget: • Bất thứ dựng Flutter, nằm Widget • Widget mơ tả ứng dụng trơng dựa cấu hình trạng thái chúng • Khi trạng thái Widget thay đổi, Widget build lại • Các widget lồng vào xây dựng ứng dụng - Stateless widget • Stateless Widget khơng có state • Cơng việc hiển thị thơng tin giao diện người dùng Thầy Phạm Hồng Hải Sinh viên Đồn Thị Thanh Hiếu 12 • Khi tạo StatelessWidget yêu cầu phải extends class StatelessWidget phải bao gồm phương thức build - Statefull widget • Stateful widget cung cấp thơng tin cấu hình state object ▪ State thơng tin mà kích hoạt q trình rebuild widget thay đổi suốt vòng đời widget ▪ Sử dụng phương thức setState để kích hoạt q trình rebuild widget • Khi tạo StatefulWidget cần tạo class đại diện cho state object widget ▪ Widget phải extends class StatefulWidget cần phương thức createState() để cung cấp State cho StatefulWidget ▪ State object: phải bao gồm phương thức build - Inherited Widgets • Inherited Widget nơi lưu trữ data cung cấp data cho widget widget tree • Tất widget Inherited Widget truy cập vào Inherited Widget để lấy data - Tuỳ chỉnh widget - Các xử lý phổ biến flutter: xử ly navigation, - Meterial UI, Theme - Static UI - Dynamic UI - Storage: tìm hiểu thuật ngữ, khái niệm như: Future, async, await, Shared Preference, File System, SqLite - State management Thực hiện: - Tham gia đầy đủ buổi training công ty, meeting báo cáo tiến độ, kết tìm hiểu nhóm internship - Làm thực hành, kiểm tra kiến thức học Kết quả: - Tiếp thu kiến thức ngơn ngữ Dart, framework Flutter Có kiến thức quan trọng cho việc lập trình mobile sau Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu 13 - 2.3 Ngồi cịn biết thêm số quy tắc việc viết code cho chuẩn, dễ đọc, dễ hiểu Tìm hiểu teamplate Flutter Boilerplate Nội dung: Các kiến thức template boilerplate để tạo ứng dụng di động đơn giản - Cách thức tạo project flutter theo teamplate boilerplate Tải project clone project với link bên dưới: https://github.com/zubairehman/flutter-boilerplate-project.git Chạy câu lệnh bên dưới: flutter pub get flutter packages pub run build_runner build delete-conflictingoutputs - Cấu trúc thư mục: • Cấu trúc thư mục lõi: flutter-app/ |- android |- build |- ios |- lib |- test • Cấu trúc thư mục lib: Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu 14 lib/ |- constants/ |- data/ |- stores/ |- ui/ |- utils/ |- widgets/ |- main.dart |- routes.dart Trong đó: constants - Chứa giá trị không thay đổi dù có thực thao tác app data - Chứa phương thức, thuộc tính liên quan đến data Điển hình api đặt vào stores - Các file tập hợp hàm mà hàm sử dụng bên UI ui  -  Chứa thư mục mà thư mục screen util  - Chứa function phổ biến ứng dụng widgets - Chứa widget thường tái sử dụng cho ứng dụng Button, TextField … routes.dart - Chứa tất routes ứng dụng main.dart - File thực thi ứng dụng Tất cài đặt cài đặt file theme, routes, title, Thực hiện: - Tham gia tìm hiểu báo cáo cho bạn team internship Tìm kiếm tài liệu mạng để tìm hiểu thêm Kết quả: - Biết cách thức tạo ứng dụng android sử dụng framework Flutter theo template boilerplate Nắm kiến trúc thư mục, tổ chức tài nguyên template boilerplate Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu 15 Thực project Nhờ hỗ trợ tận tình thầy Phạm Hồng Hải, bạn Nguyễn Trọng Thuận thành viên team internship mà sau 12 tuần vừa tìm hiểu vừa thực hành, thực tập sinh nắm kiến thức Dart, Flutter, áp dụng kiến thức đạt vào dự án thực tế Chi tiết đồ án nói phần sau Lịch làm việc Tuần Mức Nhận xét độ người hồn hướng dẫn thành Cơng việc Người hướng dẫn Sprint 1: - Tìm hiểu cơng ty, cách tổ chức công ty - Làm quen với làm việc: Jira, Figma, Android Studio, Github - Học cách trao đổi, làm việc qua email - Lên kế hoạch cho dự án Sprint 2: - Tìm hiểu ngơn ngữ lập trình Dart - Tìm hiểu Flutter Thầy Phạm Hoàng Hải, Thầy Nguyễn Tấn Trần Minh Khang Sprint 3: - Tìm hiểu ngơn ngữ lập trình Dart - Tìm hiểu Flutter - Tìm hiểu template boilerplate Sprint 4: - Khảo sát, thu thập yêu cầu - Phân tích yêu cầu ứng dụng Thầy Phạm Hoàng Hải, Thầy Nguyễn Tấn Trần Minh Khang 100% Sprint 5: - Thiết kế UI/UX Thầy Phạm Hoàng Hải, Thầy Nguyễn Tấn Trần 100% Minh Khang Thầy Phạm Hoàng Hải 100% Thầy Phạm Hoàng Hải, Thầy Nguyễn Tấn Trần Minh Khang 100% Thầy Phạm Hoàng Hải, Thầy Nguyễn Tấn Trần 100% Minh Khang Đạt cầu yêu Đạt cầu yêu Đạt cầu yêu Đạt cầu yêu Đạt cầu yêu Sinh viên Đoàn Thị Thanh Hiếu 16 10 11 12 Sprint 6: - Điều chỉnh thiết kế UI/UX - Khởi tạo project theo teamplate boilerplate push lên github Sprint 7: - Triển khai thực giao diện ứng dụng Sprint 8: - Kết nối camera với ứng dụng Sprint 9: - Xây dựng sở liệu theo template boilerplate Sprint 10: - Hiện thực chức ứng dụng Sprint 11: - Thực chức validate Sprint 12: - Kiểm thử hoàn thiện sản phẩm Thầy Phạm Hoàng Hải Thầy Phạm Hoàng Hải, Thầy Nguyễn Tấn Trần 100% Minh Khang Thầy Phạm Hoàng Hải, Thầy Nguyễn Tấn Trần Minh Khang Thầy Phạm Hoàng Hải, Thầy Nguyễn Tấn Trần Minh Khang Thầy Phạm Hoàng Hải, Thầy Nguyễn Tấn Trần Minh Khang Thầy Phạm Hoàng Hải, Thầy Nguyễn Tấn Trần Minh Khang Thầy Phạm Hoàng Hải, Thầy Nguyễn Tấn Trần Minh Khang Thầy Phạm Hoàng Hải, Thầy Nguyễn Tấn Trần Minh Khang Đạt cầu yêu 100% Đạt cầu yêu 100% Đạt cầu yêu 100% Đạt cầu yêu 100% Đạt cầu yêu 100% Đạt cầu yêu 100% Đạt cầu yêu Sinh viên Đoàn Thị Thanh Hiếu 17 Chương 3: Chi tiết project Giới thiệu ứng dụng 1.1 Giới thiệu Ngày này, không Việt Nam nhiều nước khác giới trải qua thời kỳ khó khăn dịch bệnh dẫn đến lạm phát, thiếu hụt việc làm, kinh tế suy thoái khiến có vấn nạn trộm cắp, cướp đoạt xảy nhiều hơn, để tiện cho việc truy tìm cung cấp chứng cho quan chức nhiều hộ gia đình lắp ráp camera Bên cạnh đó, nhiều hộ gia đình lắp ráp camera khơng đề phịng trộm cắp cịn sử dụng cho nhiều mục đích khác Chính phố biến camera nên việc phát triển ứng dụng cho việc truy cập vào camera, quản lý, giám sát, phát bất thường xảy ngày tăng Chính team internship giao phó triển khai Ứng dụng kết nối Camera IP Android Team internship sử dụng framework Flutter – framework dựa ngơn ngữ lập trình Dart - Google phát triển, nhóm triển khai ứng dụng theo template boilerplate – teamplate hệ thống lại thư mục, tệp chứa kiến trúc ứng dụng, app theme, ràng buộc dependencies tối thiểu để tạo ứng dụng từ giúp cho lập trình viên dễ quản lý source code giúp giảm thiểu thời gian cài đặt phát triển cách sử dụng code mẫu tránh viết lại từ đầu Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu 18 1.2 Danh sách hình ❖ Màn hình Splash ❖ Màn hình Home Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu 19 ❖ Màn hình Thêm camera Thầy Phạm Hồng Hải Sinh viên Đoàn Thị Thanh Hiếu 20 ❖ Màn hình Thêm group camera Thầy Phạm Hồng Hải Sinh viên Đoàn Thị Thanh Hiếu 21 Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu 22 Thực thành viên team internship: - Trần Lê Bảo Châu Phan Thị Hồng Cúc Đoàn Thị Thanh Hiếu Trần Văn Bảo Kế hoạch Giai đoạn – Tìm hiểu: - Tìm hiều cơng cụ làm việc: Jira, Figma, Android Studio, Github Tìm hiểu ngơn ngữ Dart Tìm hiểu framework Flutter Tìm hiểu teamplate boilerplate Kết quả: - Hoàn thành tất các yêu cầu Giai đoạn – Triển khai dự án: - Thực khảo sát, thu thập yêu cầu Triển khai phân tích yêu cầu Thiết kế liệu Triển khai dự án theo teamplate Boilerplate Hiện thực hóa giao diện Kết nối camera với ứng dụng Xây dựng liệu theo teampate boilerplate Hiện thực hóa chức ứng dụng: thêm, xóa, sửa camera, tạo nhóm camera xóa, sửa nhóm camera Hiện thực chức lưu trữ hình ảnh video hiển thị ứng dụng Thực chức validate Kiểm thử, hoàn thiện sản phẩm bàn giao Kết quả: Đã hoàn thành toàn hầu hết công việc Tuy nhiên chức lưu trữ hình ảnh video hiển thị ứng dụng chưa thực hóa Thầy Phạm Hồng Hải Sinh viên Đoàn Thị Thanh Hiếu 23 TÀI LIỆU THAM KHẢO Ngôn ngữ Dart https://dart.dev/ Framework Flutter https://flutter.dev/ Boilerplate https://github.com/zubairehman/flutter-boilerplate-project Jira https://www.atlassian.com/software/jira Figma https://www.figma.com/ Android Studio https://developer.android.com/studio/intro Scrum https://www.scrum.org/resources/what-is-scrum Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu 24 TỔNG KẾT Như vậy, tháng thực tập nhóm hồn thành Ứng dụng Kết nối Camera IP chạy tảng Android Ứng dụng có đầy đủ tính đề ban đầu Do thời gian có hạn, thêm vào giai đoạn dịch bệnh diễn biến phức tạp, trao đổi trực tiếp giải vấn đề kịp thời nên nhóm trì hõa lâu, ứng dụng cịn đơn giản chất lượng mang tính tương đối Tuy vậy, ứng dụng mở rộng thời gian tới với chức tích hợp AI Trong q trình làm việc học tập cơng ty, bạn team internship thầy phụ trách góp phần giúp cho em có kinh nghiệm bổ ích, giúp em khắc phục lỗi triển khai ứng dụng Điều khiến em trân trọng biết ơn Chân thành cảm ơn hướng dẫn hỗ trợ tận tình thầy phụ trách Phạm Hồng Hải, cảm ơn cơng ty KiteMetric cho em hội thực tập này, hội áp dụng kiến thức học vào dự án thực tế, từ giúp em trau dồi kinh nghiệm, kỹ cịn thiếu sót, quan trọng định hướng nghề nghiệp tương lại Thầy Phạm Hoàng Hải Sinh viên Đoàn Thị Thanh Hiếu ... Chương 2: Nội dung thực tập Triển khai team internship phát triển ứng dụng Kết nối camera IP Android nhằm mục đích giúp sinh viên thực tập đào tạo toàn diện cách thức tạo ứng dụng Android từ lúc... triển ứng dụng cho việc truy cập vào camera, quản lý, giám sát, phát bất thường xảy ngày tăng Chính team internship giao phó triển khai Ứng dụng kết nối Camera IP Android Team internship sử dụng. .. Hiện thực hóa giao diện Kết nối camera với ứng dụng Xây dựng liệu theo teampate boilerplate Hiện thực hóa chức ứng dụng: thêm, xóa, sửa camera, tạo nhóm camera xóa, sửa nhóm camera Hiện thực