LẬP TRÌNH ỨNG DỤNG DI ĐỘNG ĐA NỀN TẢNG VỚI FLUTTER

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 DI ĐỘNG ĐA NỀN TẢNG VỚI FLUTTER Công ty thực tập: Lecle Vietnam Người phụ trách: Tạ Phi Phụng Thực tập sinh: Vi Hữu Đức TP Hồ Chí Minh, tháng 06 năm 2022 LỜI MỞ ĐẦU Ở thời điểm tại, với tốc độ phát triển chóng mặt khoa học cơng nghệ đại ta thấy mức độ phổ biến, cung tiện dụng điện thoại thông minh điều phủ nhận với hàng tỉ người dùng tồn giới Và qua thấy ngành công nghiệp ứng dụng dành cho thiết bị di động ngày việc thiếu với 2.1 triệu ứng dụng App Store 3.2 triệu ứng dụng Google Play Store hai ơng lớn Apple Google cịn tăng lên nhanh nhiều tương lai Và với tốc độ phát triển nhanh chóng cơng nghệ đại ngày ứng dụng ngày trau chuốt ngày đẹp để đáp ứng nhu cầu người dùng Tuy nhiên với thời điểm trước để phát triển ứng dụng cho hai tảng lớn ta phải phát triển với hai module riêng biệt cho tảng, gây nên việc tốn nhiều chi phí để phát triển bảo trì Và nhận điều khái niệm lập trình đa tảng đời với khả phát triển ứng dụng cho nhiều tảng khác với source nguồn Có nhiều frameworks đa tảng khác như: Ionic, Xamarin, React Native, Adobe Phonegap gần Flutter ông lớn Google Mặc dù framework mẻ nhiên với hỗ trợ phát triển từ Google khơng phủ nhận phát triển nhanh chóng framework Trên giới có nhiều lập trình viên theo framework với xu hội nhập lập trình viên Việt Nam khơng phải ngoại lệ, góp phần tất yếu cho việc hội nhập với công nghệ xu giới cho ứng dụng Việt Nam Các ứng dụng sinh để phục vụ cho nhu cầu tất yếu sử dụng điện thoại thông minh không phân biệt lứa tuổi, sử dụng điện thoại thơng minh với tảng mà họ thích Android hay iOS với ứng dụng phát triển phù hợp với lứa tuổi nhu cầu họ, ứng dụng phát triển cách nhanh chóng với source code vô tiện lợi Và nhận thấy tiềm ngành công nghiệp ứng dụng di động mạnh việc phát triển ứng dụng đa tảng, đặc biệt mạnh framework đa tảng Flutter em định lựa chọn Flutter để làm định hướng cho đường phát triển ứng dụng di động Sau năm học tập trường, em có mong muốn trải nghiệm công việc thực tế, trau dồi nhiều kinh nghiệm có ích cho thân, tham gia phát triển ứng dụng môi trường chuyên nghiệp, em thực dự định thực tập học kì Và cơng ty em lựa chọn Lecle Vietnam, công ty cịn nhiên cơng ty Hàn Quốc với môi trường trẻ trung động chuyên nghiệp giúp em thực dự định NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức LỜI CẢM ƠN Lời đầu tiên, em muốn gửi lời cảm ơn chân thành đến công ty Lecle Vietnam cho em có hội thực tập trải nghiệm thực tế công ty Qua tháng thực tập công ty với hướng dẫn nhiệt tình anh chị mentor trainer, sinh viên thực tập chúng em tiếp thu kiến thức quan trọng cần thiết cho trình phát triển ứng dụng di động kiến thức tảng để làm việc công ty định hướng cho thân cách chuyên nghiệp Em biết ơn em muốn gửi lời cảm ơn sâu sắc đến anh chị dành thời gian, cơng sức để hướng dẫn, dạy giúp em hồn thành trình thực tập theo dự định Em xin gửi lời cảm ơn đặc biệt đến anh Tạ Phi Phụng, người training Flutter cho em hướng dẫn, giúp đỡ khó khăn cơng việc vượt qua khó khăn việc làm quen với môi trường làm việc quy trình làm việc cơng ty Anh người hướng dẫn cho em tư làm việc định hình quy trình làm việc thực dự án để em làm việc thuận lợi tránh sai sót hơn; cảm ơn anh Huỳnh Bảo Quốc người training cho em kiến thức cần thiết mà em cần có cho cơng việc việc làm việc với backend Restful API, Firebase, sử dụng dịch vụ; cảm ơn anh Nguyễn Phi Ân người hướng dẫn cách lập trình giao diện với Flutter sử dụng package để dự án tốt hơn, sửa lỗi sai lập trình giao diện xử lý logic Flutter để giúp em cải thiện lỗi sai thường mắc phải để em rút kinh nghiệm lập trình giao diện Flutter tốt hơn; em gửi lời cảm ơn đến anh Lâm Xuân Triết người chia sẻ giúp em củng cố lại kiến thức cần thiết để giúp em áp dụng dự án; em xin cảm ơn anh chị thuộc team design, backend QA/QC hướng dẫn hỗ trợ em hoàn thành tốt dự án giao; cuối em xin gửi lời cảm ơn đến anh Nguyễn Mạnh Hùng Project Manager mobile team người cho em thêm kiến thức cần thiết mà em cần để giúp em bước đường định hướng trở thành Project Manager anh tương lai Và với đóng góp dẫn anh chị em hồn thành sản phẩm tham gia vào phát triển module thời gian thực tập Em xin gửi lời cảm ơn chân thành đến thầy cô khoa Cơng nghệ phần mềm nhiệt tình tạo điều kiện hỗ trợ em thực báo cáo Vi Hữu Đức TPHCM, 15/06/2022 NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức NHẬN XÉT CỦA KHOA NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức MỤC LỤC LỜI MỞ ĐẦU LỜI CẢM ƠN NHẬN XÉT CỦA KHOA 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 Lecle Vietnam Sản phẩm công ty: Chương 2: Nội dung thực tập Tìm hiểu cơng ty kỹ công ty: .7 Nghiên cứu kỹ thuật: .8 2.1 2.2 2.3 2.4 2.5 Các công cụ làm việc: Tìm hiểu ngơn ngữ Dart: Tìm hiểu kiến trúc tổ chức project Flutter: 10 Tìm hiểu Firebase package Flutter: 11 Lập trình ứng dụng với Flutter cho tảng di động Android iOS: 12 Thực project: 15 Lịch làm việc: 15 Chương 3: Chi tiết project 20 Giới thiệu ứng dụng thương mại điện tử: 20 1.1 1.2 Nội dung ứng dụng: 20 Cách sử dụng: 23 Thực hiện: 24 Kế hoạch: 24 Chương 4: Tổng kết trình thực tập 25 Kết đạt được: 25 Những khó khăn gặp phải trình thực tập: 25 Kinh nghiệm có sau trình thực tập: 26 TÀI LIỆU THAM KHẢO 27 NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức Chương 1: Giới thiệu công ty thực tập Giới thiệu công ty Lecle Vietnam Công ty Lecle thành lập năm 2014 với trụ sở Hàn Quốc, sau mở rộng văn phịng sang thị trường Singapore Mỹ, sau năm 2017 cơng ty định thành lập văn phịng Việt Nam Cơng ty có chuyên môn lĩnh vực Web, Blockchain trước native app (Android, iOS) sau chuyển hướng sang Flutter Sau năm thành lập công ty xây dựng chỗ đứng vững thị trường Mỹ, Singapore, Hàn Quốc Việt Nam với lĩnh vực Blockchain với khách hàng Mỹ Singapore, khách hàng Hàn Quốc Việt Nam với lĩnh vực Web Mobile Với văn phòng đặt quốc gia thị trường lớn hàng đầu Mỹ, Hàn Quốc, Singapore Việt Nam, công ty gia công cung cấp phần mềm cho lĩnh vực Web, Block Chain, Mobile cho quốc gia với 200 nhân viên làm việc văn phịng cơng ty Sản phẩm công ty: Công ty Lecle cung cấp ứng dụng Web Mobile cho khách hàng Hàn Quốc Việt Nam, cơng ty cịn có dự án mảng Blockchain cho khách hàng Mỹ Singapore với nhiều khách hàng thân quen hợp tác lâu dài với công ty Công ty tiên phong việc chuyển đổi cập nhật công nghệ cho Blockchain có Flutter cho ứng dụng di động Nhờ hợp tác với khách hàng lâu năm với đội ngũ nhân lực tốt, cơng ty có số sản phẩm hệ thống server riêng công ty để tạo gitlab riêng công ty để quản lý source code, ngồi server cịn sử dụng cho dự án khách hàng họ có nhu cầu Ngồi cơng ty gia cơng sản phẩm cho số khách hàng lớn KPlaza, Unity, … NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức Chương 2: Nội dung thực tập Đợt thực tập này, sinh viên thực tập với chủ đề “Lập trình ứng dụng di động đa tảng với Flutter” nhằm mục đích giúp sinh viên đào tạo tồn diện lập trình ứng dụng di động đa tảng với Flutter, đồng thời rèn luyện kỹ làm việc nhóm, giao tiếp, quản lý thời gian, cơng việc 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 chun 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 tổ chức công ty số thơng tin cần biết q trình thực tập việc quản lý source code, thông tin tài khoản, … Ngày đến công ty em nghe anh chị ban nhân trình bày q trình thành lập phát triển cơng ty (như trình bày phần trên), đồng thời giới thiệu để nhân viên thực tập làm quen với toàn nhân viên team khác, thành viên team hướng dẫn thực tập, ban lãnh đạo công ty để tạo gắn kết, thân mật qua giới thiệu quy trình làm việc từ cao đến thấp cơng ty, cách tổ chức cơng ty Ngồi nhân viên thực tập giới thiệu qua cách thức quy trình làm việc cơng ty thời gian làm, quy định công ty ban hành mà nhân viên phải tuân thủ, cách sử dụng email cơng việc, ngồi cịn có thông tin tài khoản nhân viên email, gitlab, … Kết quả: Hiểu thêm công ty Lecle Vietnam, q trình thành lập phát triển, ngồi làm quen với nhân công ty, thành viên team hướng dẫn ban lãnh đạo để tạo thân thiết gắn kết nhân viên công ty Và qua có thêm kỹ việc quản lý email, tài khoản công việc thời gian làm việc, từ làm việc có kế hoạch, kỷ luật trách nhiệm tuân thủ điều lệ công ty NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 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ụ cần thiết sử dụng trình làm việc Trong thời gian làm quen đầu supervisor hướng dẫn cho thực tập sinh tìm hiểu cơng cụ giúp ích cho cơng việc khơng mà sau Một số phần mềm Slack – dùng cho làm việc nhóm, Firebase Console – Một nơi vô cần thiết để sử dụng dịch vụ Firebase quản lý ứng dụng đăng ký, Visual Studio Code Android Studio – hai cơng cụ lập trình vơ phổ biến tiện lợi cho việc lập trình Flutter số plugin cần thiết cho IDE Thực hiện: Thực hành việc cài đặt môi trường, IDE sử dụng phần mềm nêu Kết quả: Thực tập sinh thực lập trình vơ tiện lợi với công cụ chuyên dụng cung cấp hồn tồn miễn phí tiện lợi, cơng cụ dễ dàng kết nối với nhau, so sánh việc sử dụng IDE để qua chọn IDE thích hợp làm việc lâu dài tùy vào hoàn cảnh u cầu cơng việc 2.2 Tìm hiểu ngơn ngữ Dart: Nội dung: Thực tập sinh training nhắc lại ngơn ngữ lập trình Dart với kiến thức quan trọng để sử dụng cho Flutter (Dart ngôn ngữ cốt lõi Flutter) - Lập trình hướng đối tượng: Trainer nhắc lại củng cố kiến thức lập trình hướng đối tượng tính đóng gói, trừu tượng, kế thừa, đa hình Ngồi thực tập sinh cịn số điểm khác biệt OOP mà Dart dùng so với ngơn ngữ khác - Lập trình bất đồng bộ: Thực tập sinh trainer hướng dẫn phương pháp lập trình bất đồng Dart Đây kỹ thuật sử dụng nhiều không NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức thể thiếu Flutter để xử lý thao tác bất đồng tải file, đọc data từ database, … Ngồi thực tập sinh cịn giải thích rõ chế Isolate Async lập trình bất đồng để phân biệt dùng lúc, đồng thời thấy điểm mạnh, điểm yếu chúng - Làm việc với API: Các trainer Flutter team hướng dẫn cách để làm việc với API thông qua Dart với thư viện Dart cung cấp thư viện từ pub.dev Qua thực tập sinh biết cách gửi request đến API, nhận kết trả đánh chặn liệu để xử lý (có thể dùng số trường hộp debug xử lý data trước data lưu trữ lại, …) - Null safety: Các trainer hướng dẫn cho thực tập sinh kiến thức vô hay Flutter đưa vào thời gian gần lấy cảm hứng từ ngơn ngữ lập trình Kotlin là null safety, qua giúp thực tập sinh hiểu tầm quan trọng việc giúp ta tránh lỗi liên quan đến liệu null lập trình Nhờ vào điều giúp cho thực tập sinh tránh giảm thiểu tối đa rủi ro gặp phát triển dự án cho sau - Giao tiếp Dart Native code: Các trainer hướng dẫn cách để ngôn ngữ Dart giao tiếp với ngơn ngữ cho lập trình native Java, Kotlin (Android) Swift, Object-C (iOS) Qua giúp cho thực tập sinh hiểu chế để ngơn ngữ Dart gọi sử dụng code từ Native code cho Flutter project để hỗ trợ thư viện Flutter khơng cung cấp tính Native code (VD: lấy version hệ điều hành, dạng thao tác điện thoại mà người dùng cài đặt (như nút ấn, gesture, …), Thực hiện: - Tham gia đầy đủ buổi training công ty - Thực thực hành để kiểm tra kiến thức training tạo class sử dụng phần hướng đối tượng Dart theo yêu cầu trainer, thực việc gọi API đơn giản từ API mẫu công ty để xem kết cấu trúc API, tạo thực phương thức tải ảnh máy cho phần lập trình bất đồng NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 10 - Thực việc gọi native code đơn giản để nắm quy trình thao tác - Ngồi phải tìm hiểu thêm tài liệu mạng để nắm rõ thêm phần hướng dẫn Kết quả: 2.3 - Nâng cao kỹ lập trình kiến thức cần có ngơn ngữ lập trình Dart - Có kiến thức quan trọng cho việc lập trình UI xử lý logic Flutter dựa ngơn ngữ Dart Tìm hiểu kiến trúc tổ chức project Flutter: Thời gian: ngày (1 tuần) Nội dung: Thực tập sinh training mơ hình mà cơng ty sử dụng cho project, tìm hiểu số design pattern, SOLID principle tìm hiểu mơ hình phát triển dự án liên quan - Mơ hình phát triển ứng dụng: Mơ hình tìm hiểu MVVM (Model – View – ViewModel) Đây mơ hình phát triển ứng dụng vơ phổ biến nhiều công ty sử dụng dự án họ, thực tập sinh tìm hiểu kiến thức mơ hình để hiểu mơ nắm bắt cấu trúc mơ hình Ngồi thực tập sinh cịn nghe sơ qua mơ MVC hay MVP ưu, khuyết điểm chúng hiểu nên dùng mơ hình MVVM - Tìm hiểu cấu trúc trainer module dựa trên: Tiến hành tìm hiểu kiến thức kiến thức viết liên quan nơi trainer dựa để viết module code tái sử dụng hướng dẫn cho thực tập sinh sau Đây viết cung cấp kiến thức đầy đủ tổng quan mơ hình mà trainer sử dụng để giúp thực tập sinh hình dung phần cấu trúc sử dụng project module - Tìm hiểu SOLID principle: Thực tập sinh yêu cầu tìm hiểu quy ước SOLID để qua hiểu rõ tẩm quan trọng việc có quy ước viết code cho NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 14 nhiều Widget thông qua việc quản lý state Widget cho hiệu quả, qua tối ưu phần mềm hai tảng để tạo trải nghiệm tốt cho người dùng tiết kiệm nhiều thời gian nhà phát triển - Cơ chế hoạt động Flutter tảng này: Trainer giải thích cho thực tập sinh thêm chế mà Flutter vẽ giao diện mà developer lập trình lên hai tảng Android iOS thơng qua canvas qua Flutter tùy biến để vẽ giao diện theo ý muốn, qua cung cấp Widget vô đẹp bắt mắt cho developer người dùng Flutter sử dụng công cụ để vẽ giao diện hai tảng dựa vào Skia mạnh render engine C++ (Nguồn: flutter.dev) - Lập trình ứng dụng cho tảng Android iOS sử dụng Flutter: Để lập trình Flutter có hiệu suất cao lập trình viên phải cố gắng để tối ưu số lượng widget, cố gắng module lại thứ dùng nhiều dự án màu sắc, font chữ… Vì trước tiến hành dự án thực tập sinh trainer yêu cầu chuẩn bị thứ tái sử dụng dự án giảm thiểu lượng code xuống tối đa Khi ứng dụng trở module với việc code tái sử dụng nhiều nơi sau thuận tiện cho việc quản lý sửa lỗi Thực hiện: - Tham gia đầy đủ buổi training công ty - Tạo ứng dụng từ Flutter cho tảng với kiến thức củng cố chuyên sâu tảng native Android iOS - Tìm hiểu thêm kiến thức mạng để nắm rõ kiến thức hướng dẫn Kết quả: - Có thể hiểu rõ cách thức Flutter hoạt động tảng native di động Android iOS qua triển khai ứng dụng Flutter tốt cho tảng với kiến thức hướng dẫn (giúp dự án hoạt động tốt với dòng điện thoại khác tảng) NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 15 Thực project: Sau khoảng tháng training thực hành, thực tập sinh nắm kiến thức Flutter, Firebase, Flutter package and widgets Trong tháng thứ hai thứ ba, trainer hướng dẫn thực tập sinh áp dụng kiến thức học để thực project e-commerce app đa tảng Android iOS dựa Flutter Chi tiết đồ án nói phần sau Lịch làm việc: Tuần Mức độ Công việc Người hướng dẫn hoàn thành - Làm quen với nhân viên Anh Tạ Phi Phụng 100% công ty, cách tổ chức, quy trình làm việc cơng ty Nhận xét người hướng dẫn Sinh viên hoà đồng, tiếp thu quy trình nhanh - Làm quen với cơng cụ làm việc công ty - Học cách trao đổi, làm việc qua email tài khoản công ty cung cấp (quản lý source code, xin phép, …) - Ôn tập lại bổ sung Anh Tạ Phi Phụng thêm kiến thức cần thiết quan trọng ngơn ngữ Dart (lập trình bất đồng bộ, thao tác API, …) 100% Nắm đủ kiến thức Sinh viên thực hành lại kiến thức có, góp ý để cải thiện cách làm tốt 100% Sinh viên hoàn thành đầy đủ yêu cầu củng cố thêm kiến thức - Thực hành kiến thức hướng dẫn củng cố - Làm test nhỏ kiến thức hướng dẫn - Tìm hiểu Firebase Anh Tạ Phi Phụng dịch vụ NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 16 - Củng cố bổ sung kiến thức IDE để lập trình Flutter - Tìm hiểu củng cố package Flutter từ nơi tìm đến việc quản lý ứng dụng package vào dự án chun mơn thực tiễn khác - Tìm hiểu mơ hình phát triển dự án design pattern lập trình - Tìm hiểu, hỏi đáp cấu trúc tổ chức project mà công ty áp dụng dựa - Tiến hành tạo project tổ chức thử theo mơ hình hướng dẫn - Tìm hiểu RESTful API Anh Tạ Phi Phụng Postman - Áp dụng kiến thức API thực số ứng dụng 100% Sinh viên biết cách nghiên cứu kiến thức áp dụng vào thực tế - Lên kế hoạch thực dự Anh Tạ Phi Phụng án giao 100% Sinh viên biết cách vận dụng kiến thức học Nền tảng để tự học hỏi thêm sau 100% Áp dụng cải thiện phương pháp lập trình sẵn có hướng dẫn thêm Sinh viên dần hình thành thói quen cách làm việc riêng - Viết Widget tái sử dụng module code - Tạo lớp cần thiết theo mơ hình tổ chức dự án hướng dẫn - Tìm hiểu thêm kiến thức mơ hình design pattern Giai đoạn 1: Anh Tạ Phi Phụng - Tiến hành tạo giao diện đăng nhập ban đầu theo module code mô hình tìm hiểu NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 17 - Tiến hành liên kết project với Firebase thêm dịch vụ vào dự án - Test thử dịch vụ sau thêm - Đăng ký, thiết lập liên kết ứng dụng tảng Facebook, Google - Hoàn thiện giao diện đăng nhập với việc thực chức đăng nhập dựa dạng social login giao Facebook Google Giai đoạn 1(tiếp): Anh Tạ Phi Phụng 100% Sinh viên tự độc lập tìm phương pháp làm việc, áp dụng tốt dẫn gợi ý người hướng dẫn Bước đầu để chuẩn bị cho giai đoạn làm việc thực tế 100% Sinh viên thực cơng việc mang tính phức tạp vận dụng nhiều kiến thức lúc - Hoàn thành giao diện trang đăng ký, đăng nhập thiết lập tài khoản - Tiến hành thực việc tạo bảng quản lý thông tin Firebase cho ứng dụng thông tin người dùng, quản lý thông tin đăng nhập - Tiến hành test thử việc tương tác với bảng liệu lập chỉnh lại bảng liệu để ứng dụng hoạt động logic - Test nhiều thiết bị khác nhau, đảm bảo giao diện tính khơng bị lỗi Giai đoạn 1(tiếp): - Tích hợp module đăng nhập, đăng ký vào source dự án NHD: Tạ Phi Phụng Anh Tạ Phi Phụng SVTT: Vi Hữu Đức 18 - Sửa lỗi logic test case tester leader phản hồi - Sửa lỗi giao diện sau designer kiểm tra Giai đoạn 2: - Tìm hiểu nghiên cứu dịch vụ Google Map API - Thực module Map Service áp dụng kiến thức tìm hiểu Google Map API 10 Giai đoạn 2(tiếp):: Anh Tạ Phi Phụng 100% Anh Tạ Phi Phụng 100% - Nghiên cứu design wireframe cho phần Bản đồ ứng dụng Sinh viên tự độc lập tìm phương pháp làm việc, áp dụng tốt dẫn gợi ý người hướng dẫn Bước đầu để chuẩn bị cho giai đoạn làm việc thực tế Sinh viên biết cách vận dụng kiến thức học Nền tảng để tự học hỏi thêm sau - Lên kế hoạch thiết kế hình logic liên quan - Tiến hành đưa phương hướng ý tưởng thực với người hướng dẫn thành viên khác nhóm - Đưa giải pháp hiệu ý kiến với tiến độ dự án 11 Giai đoạn 2(tiếp): - Tiến hành thực hình giao tích hợp module Map Service tạo trước vào dự án Sinh viên biết cách vận dụng kiến thức học Nền tảng để tự học hỏi thêm sau - Áp dụng logic theo yêu cầu dự án hình liên quan NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 19 12 Giai đoạn 2(tiếp): Anh Tạ Phi Phụng 100% Sinh viên biết cách giải vấn đề khắc phục lỗi Anh Tạ Phi Phụng 100% Hoàn thành đầy đủ tiêu người hướng dẫn đặt để kết thúc trình học hỏi giai đoạn thực tập Trang bị thêm cho thân sinh viên kỹ tự học, làm việc độc lập tự phát triển - Sửa lỗi logic test case tester leader phản hồi - Sửa lỗi giao diện sau designer kiểm tra - Cải thiện trải nghiệm người dùng 13 - Báo cáo cuối đợt thực tập NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 20 Chương 3: Chi tiết project Giới thiệu ứng dụng thương mại điện tử: Đề tài ứng dụng thực tập anh chị nhóm training giao thực module đăng ký, đăng nhập dành cho người dùng quản lý thông tin cá nhân thông qua Social Login dịch vụ đồ sử dụng Google Map API Áp dụng module làm vào dự án thương mại điện tử 1.1 Nội dung ứng dụng: Nội dung ứng dụng sử dụng thơng tin đăng nhập sẵn có hệ thống mạng xã hội Google, Facebook, Apple, Naver… để đăng nhập lưu trữ thông tin cá nhân mà không cần tạo tài khoản Ứng dụng cho phép người đăng nhập thơng qua cách thức đăng nhập phổ biến dựa vào dạng đăng nhập với Facebook, Google Apple Sau đăng nhập người dùng dùng thông tin cá nhân lưu trữ tảng thành liệu cho ứng dụng Tính giúp người dùng liên kết tài khoản mạng xã hội với ứng dụng thương mại điện tử, cải thiện tính tiện dụng cho người dùng tăng phổ biến cho ứng dụng thương mại điện tử Bên cạnh tính đó, áp dụng tính đồ sử dụng Google Map API cung cấp Google Đa số người dùng smartphone sử dụng dịch vụ Google map nhiều mục đích khác ứng dụng áp dụng dịch vụ vừa phù hợp với yêu cầu ứng dụng vừa có độ xác cao người dùng dễ sử dụng NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 21 Nhóm hình đăng nhập Social Login NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 22 Nhóm hình sử dụng tính Google Map NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 23 1.2 Cách sử dụng: Mô tả: Người dùng đăng nhập vào ứng dụng thông qua phương thức cung cấp sẵn Google, hay Facebook (Apple Kakao phát triển sau) Sau đăng nhập người dùng xem người dùng khác đăng nhập vào ứng dụng, thông tin thông tin public từ tài khoản mà người dùng đăng nhập tên, ảnh đại diện, ngày tháng năm sinh người dùng đồng ý yêu cầu quyền cho liệu Tính sử dụng Google Map giúp người dùng kiểm tra trạng thái đơn hàng vị trí, khoảng cách người giao hàng so với người dùng Tóm tắt: - Đăng nhập: Người dùng chọn phương thức đăng nhập triển khai Google Facebook để đăng nhập vào ứng dụng - Thông tin người dùng: Mặc định thông tin đăng nhập từ người dùng lấy từ tài khoản tên ảnh đại diện Người dùng cập nhật lại muốn - Google Map: kiểm tra trạng thái đơn hàng người giao hàng Kết quả: - Người dùng đăng nhập Google: + Thông tin đăng nhập gồm ảnh đại diện tên dựa theo tài khoản Google mà người dùng đăng nhập + Các thơng tin thay đổi lưu trữ lại người dùng thay đổi - Người dùng đăng nhập Facebook: + Thông tin đăng nhập gồm ảnh đại diện tên người dùng đặt Facebook + Các thơng tin cập nhật lưu trữ lại người dùng thay đổi - Người dùng sử dụng tính Google Map tích hợp: + Kiểm tra tình trạng đơn hàng người dùng đặt trước + Kiểm tra vị trí người giao hàng đơn hàng trạng thái giao NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 24 Thực hiện: Thành viên thực hiện: - Vi Hữu Đức Và giúp đỡ trainer từ Mobile team Kế hoạch: Giai đoạn 1: - Hoàn thành giao diện đăng nhập ứng dụng - Tiến hành học hỏi làm việc với Firebase + Đầu tiên tạo project đăng kí ứng dụng Firebase + Học hỏi cách thiết lập đăng nhập ứng dụng với Firebase + Học hỏi cách sử dụng package Flutter cho việc đăng nhập chuẩn bị theo hướng dẫn cần thiết để ứng dụng đăng nhập thông qua Firebase + Học cách tạo ứng dụng Facebook developer để đăng nhập thơng qua Facebook + Học hỏi việc tạo bảng quản lý thông tin Firebase - Tiến hành chạy ứng dụng sử dụng phần đăng nhập Kết quả: - Kết quả: Ứng dụng đăng nhập với dạng “social login” Google Facebook thông qua Firebase - Lấy thông tin người dùng tiến hành lưu vào bảng tạo để quản lý thông tin người dùng Firebase - Tạo project Firebase đăng ký ứng dụng đăng ký ứng dụng Facebook developer Giai đoạn 2: - Thực module Google Map - Thực UI cho ứng dụng hình sử dụng Google Map - Tích hợp Google Map vào dự án - Sửa lỗi hoàn thiện NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 25 - Chỉnh sửa giao diện tính theo yêu cầu trainer - Hoàn thiện việc lưu trữ thông tin lên Firebase truy xuất thông tin từ Firebase Kết quả: - Người dùng sử dụng Google Map cho số chức phù hợp với yêu cầu ứng dụng - Nâng cao trải nghiệm người dùng Chương 4: Tổng kết trình thực tập Kết đạt được: Kết đạt sau q trình thực tập: - Hồn thiện tính xác thực, đăng nhập đăng ký, áp dụng vào dự án thực tế tham gia vào trình phát triển ứng dụng thực tế công ty - Hiểu thêm kiến thức chuyên sâu Flutter - Hiểu cách sử dụng Firebase tích hợp dịch vụ vào project - Hồn thành tốt thời gian thực tập trở thành nhân viên thức cơng ty Những khó khăn gặp phải q trình thực tập: Một số khó khăn sinh viên gặp phải q trình thực tập cơng ty: - Khó khăn mặt di chuyển cơng ty có vị trí địa lý xa nhà - Khó khăn ngày đầu làm quen với quy trình làm việc sinh viên chưa trải nghiệm môi trường thực tế trước - Khó khăn mặt giao tiếp, trao đổi công việc vào ngày đầu chưa quen biết toàn thành viên team - Khó khăn việc trao đổi dự án ngày đầu với PM sinh viên chưa nắm rõ quy trình làm việc thực tế cơng ty - Khó khăn ngày đầu việc quản lý source code dự án Gitlab công ty NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 26 Kinh nghiệm có sau q trình thực tập: Sau trình thực tập em rút cho thân kinh nghiệm quý báu cho thân đề tài thực tập, kinh nghiệm quan trọng cho đường công việc sau này: - Học hỏi quy trình làm việc tổ chức công ty thực tế - Học hỏi thêm kiến thức Flutter cách làm việc với Firebase - Biết số quy trình, nguồn nhân lực giải rủi ro - Học hỏi cách tổ chức quản lý source code cho việc cho dễ dàng bảo trì phát triển thuận tiện cho việc đọc hiểu có người tham gia vào dự án - Học cách sử dụng công cụ để trao đổi giao tiếp, hỏi đáp công việc có thắc mắc để cơng việc sn sẻ - Học cách dùng Gitlab để quản lý source code, raise issue - Học kỹ mềm giao tiếp báo cáo để báo cáo công việc trao đổi công việc với thành viên nhóm PM - Học hỏi quy trình làm việc theo Scrum, quản lý task công việc theo Sprint NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 27 TÀI LIỆU THAM KHẢO For Flutter widgets: https://flutter.dev/docs https://www.youtube.com/channel/UCwXdFgeE9KYzlDdR7TG9cMw https://medium.com For Flutter packages: https://medium.com https://pub.dev https://stackoverflow.com For Firebase: https://firebase.google.com/docs https://blog.logrocket.com/flutter-push-notifications-with-firebase-cloud-messaging/ For social login: https://medium.com/flutter-community/flutter-facebook-login-77fcd187242 https://medium.com/flutterdevs/google-sign-in-with-flutter-8960580dec96 NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức 28 TỔNG KẾT Như thời gian thực tập cơng ty tháng, em hoàn thành ứng dụng chạy tảng Android iOS với source code Ứng dụng có đầy đủ tính để ban đầu có tính module source code tái sử dụng lại dự án khác Do có đủ thời gian để hồn thành nên ứng dụng có giao diện đầy đủ, trau chuốt hoàn thiện tính thực cách đầy đủ Và với việc source code ứng dụng có tính module hóa nên việc bảo trì, tái sử dụng phát triển thêm hồn tồn thực có thêm thời gian Em xin chân thành cảm ơn anh chị Mobile team công ty Lecle hỗ trợ, dẫn sửa lỗi sai q trình hồn thành ứng dụng em để ứng dụng em hoàn thiện giúp em học nhiều kiến thức chun mơn lẫn đức tính phong cách làm việc NHD: Tạ Phi Phụng SVTT: Vi Hữu Đức ... tập này, sinh viên thực tập với chủ đề ? ?Lập trình ứng dụng di động đa tảng với Flutter? ?? nhằm mục đích giúp sinh viên đào tạo tồn di? ??n lập trình ứng dụng di động đa tảng với Flutter, đồng thời... người dùng Flutter sử dụng công cụ để vẽ giao di? ??n hai tảng dựa vào Skia mạnh render engine C++ (Nguồn: flutter. dev) - Lập trình ứng dụng cho tảng Android iOS sử dụng Flutter: Để lập trình Flutter. .. Wikipedia) - Tạo ứng dụng Flutter: Thực tập sinh trainer nhắc lại cách tạo ứng dụng Flutter bản, cách sử dụng công cụ biên dịch, chạy ứng dụng Flutter máy ảo Android, iOS thiết bị thực tế hai tảng