Báo cáo thực tập xây dựng ứng dụng MOBILE đ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 XÂY DỰNG ỨNG DỤNG MOBILE ĐA NỀN TẢNG VỚI FLUTTER Công ty thực tập : Gonosen Quốc tế – Stage Group VN Thực tập sinh : Nguyễn Quang Khang -17520617 Lớp : SE501.L11 TP Hồ Chí Minh, ngày 29 tháng năm 2021 LỜI MỞ ĐẦU Ngày nay, ngành công nghiệp Mobile Software phận thiếu ngành công nghiệp phần mềm Ngày điện thoại di động thông minh trở thành phần thiếu nhiều người sống ngày Tiến công nghệ trải nghiệm người dùng thúc đẩy phát triển thị trường thiết kế ứng dụng di động Cùng với xu phát triển giới, Việt Nam ngoại lệ Trong thời đại 4.0 tương lai, tất mọi người sở hữu sử dụng smartphone thường xuyên công việc hầu hết dịch vụ đời sống xã hội Do đó nhu cầu phát triển ứng dụng di động ngày phát triển mạnh mẽ Hiện nay, cạnh tranh mạnh mẽ công nghiệp mobile tạo rất nhiều hệ điều hành khiến cho việc phát triển ứng dụng di dộng gặp không ít khó khăn việc phải tạo ứng dụng sử dụng được tất hệ điều hành Đó chính lý Cross-flatform đời giúp tạo những ứng dụng có thể chạy nhiều hệ điều hành khác Trong đó Flutter những Framework đời thu hút rất nhiều mobile developer dễ sử dụng, biên dịch nhanh , rất nhiều tính nổi trội để tạo những ứng dụng cross-flatform chất lượng Sau ba năm học tập trường, mong muốn có thêm kinh nghiệm thực tế, muốn được tham gia thực tập môi trường chuyên nghiệp, nên định nộp đơn thực tập hè Vì vậy, em định chọn Gonosen Quốc tế - môi trường lý tưởng, đại, chuyên nghiệp nơi tuyệt vời cho developer trẻ có thể thể học hỏi được nhiều kĩ việc phát triển phần mềm hệ thống lớn LỜI CẢM ƠN Trân trọng gửi lời cảm ơn Công ty Gonosen Quốc tế tạo điều kiện cho em có hội được thực tập công ty Chỉ thời gian ngắn, nhờ dẫn nhiệt tình leader team developer đầy kinh nghiệm giúp đỡ tận tình để tạo ứng dụng hoàn chỉnh cho khách hàng Chân thành cảm ơn anh chị nhóm Flutter Developer bỏ nhiều thời gian,công sức để hướng dẫn em hoàn thành đợt thực tập Đặc biệt cảm ơn anh Lê Hồng Hiển tất mọi người công ty tạo điều kiện giúp đỡ tận tình suốt thời gian thực tập công ty Cũng xin cảm ơn thầy 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 Nguyễn Quang Khang TpHCM, ngày 29 tháng năm 2021 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 Gonosen Quốc tế Sản phẩm mobile công ty Chương 2: Nội dung thực tập Tìm hiểu cơng ty kỹ công ty Nghiên cứu kỹ thuật 2.1 Các công cụ làm việc 2.2 Thiết kế UI với figma cho sẵn 2.3 Fetch api với Graphql Flutter 2.4 Tìm hiểu sử dụng thư viện Flutter 2.5 Kiểm thử fix lỗi trước Commit cho leader 2.6 Tìm hiểu Source Tree (Desktop Git) sử dụng thành thạo Thực project Chương 3: Chương 3: Chi tiết project 10 Giới thiệu app Liberlove 10 Thực 10 Kế hoạch 10 Các hình: 10 4.1 Đăng nhập , đăng kí, đổi mật khẩu, quên mật khẩu: 10 4.2 Màn hình Home: 12 4.3 Màn hình Friend: 13 4.4 Màn hình Chat: 13 4.5 Màn hình Profile: 14 4.6 Màn hình Edit Profile: 15 4.7 Màn hình Edit Setting: 16 4.8 Màn hình Confession Post: 17 Chương 1: Giới thiêu công ty thực tập Giới thiệu công ty Gonosen Quốc tế Gonosen Quốc Tế công ty Stage Group Nhật Bản Kinh doanh lĩnh vực Tư vấn Web, Lập kế hoạch, tạo trang Web, Lập kế hoạch, tạo ứng dụng Smartphone, Giải pháp SEO,… Sản phẩm mobile công ty Gonosen Quốc Tế công ty Product nên tạo nhiều ứng dụng di động hầu hết được release Nhật Bản: - LiberLove – ứng dụng hẹn hò giành cho cộng đồng LGBT - Friend – mạng xã hội tìm bạn bè chơi game - YasuTV- Nền tảng livestream , giao lưu - mạng xã hội - … Chương 2: Nội dung thực tập Đợt thực tập với chủ đề “Lập trình ứng dụng đa tảng với Flutter” tạo ứng dụng theo yêu cầu khách hàng , đồng thời rèn luyện những kỹ mềm làm việc nhóm, thuyết trình, giao tiếp,và mơ hình quản lý Agile Tại cơng ty, sinh viên có hội được học tập, khám phá làm việc môi trường phát triển ứng dụng mobile chun nghiệp 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 Được nghe người phụ trách giới thiệu cơng ty, q 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 còn được 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… Nghiên cứu kỹ thuật 1.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ẽ đượ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ụ sẽ giúp ích cho công việc sau Một số phần mềm số đó Android Studio/Visual Code , Source Tree (Desktop Git) , Flutter for IDE Thực : Tải cài đặt phần mềm nêu Kết : Cài đặt thành công Flutter cho IDE chạy test thành công first project 1.2 Thiết kế UI với figma cho sẵn - 1.3 Fetch api với Graphql Flutter - 1.4 Dựa thiết kế figma từ team design và code tạo các màn hình giống figma với Flutter Thực các luồng flow theo file figma và feed back từ khách hàng (nếu có) Thực thi các chức và các Animation theo yêu cầu khách hàng Tìm hiểu nghiệp vụ ứng dụng luồng ứng dụng Tự nghiên cứu phương thức Graphql Flutter Query,mutation, subscription,… Tìm hiểu và sử dụng thư viện của Flutter 1.5 Đọc hiểu thực thi thư viện vào ứng dụng theo yêu cầu khách hàng Sửa code thư viện Flutter có sẵn cho phù hợp với yêu cầu khách hàng Tích cực tìm hiểu thư viện có sẵn Flutter pub.dev để trách lãng phí thời gian viết lại chương trình tương tự từ đầu Kiểm thử và fix lỡi trước Commit cho leader - 1.6 Thực check lại tất trường hợp có thể xảy lỗi fix Nghiên cứu tìm xảy lỗi Tìm hiểu Source Tree (Desktop Git) và sử dụng thành thạo - Pull, Push , Merge code Commit theo nội dung làm để tiện theo dõi sửa chữa Trao đổi với đồng nghiệp trước Merge code để không bị mất code người khác Thực project Sau tháng học tập làm việc, em team tạo được ứng dụng hoàn chỉnh release cho khách hàng thời hạn theo hợp đồng Lịch làm việc: Tuần Công việc - - - Người hướng dẫn Tìm hiểu công Anh Lê Hồng Hiển ty, cách tổ chức công ty Làm quen với SourceTree (Desktop Git) Cách thức liên lạc qua email cơng ty, skyper, github Tìm hiểu cách tổ Anh Long chức Project Xem tham khảo cách quản lý source code, format code đồng nghiệp Các quy tắc commit code , merge code, Mức độ hoàn thành Nhận xét người hướng dẫn 10 11 12 13 … - Lập trình UI với Flutter - Tìm hiểu Animation , package cần dùng - Lập trình hình chính app - Test fix lỗi - Tiếp tục hoàn thành chức UI - Giao sản phẩm cho khách hàng tiếp tục sửa lại theo feedback (nếu có) Giai đoạn API: - Tìm hiểu graphQL - Thảo luận với thành viên team database, yêu cầu Frontend - Mock api , tạo api ảo imple thời gian đợi Backend tạo api - Imple api vào chức app - Imple api vào chức app - Giao cho khách hàng fix theo feedback - Test fix bug lần cuối , bở sung chức tốn theo yêu cầu Sếp,… - Release app Anh Lê Hồng Hiển Anh Long Anh Lê Hồng Hiển Anh Long Anh Lê Hồng Hiển Anh Long Anh Lê Hồng Hiển Anh Long Anh Lê Hồng Hiển Anh Long Anh Lê Hồng Hiển Anh Long Anh Lê Hồng Hiển Anh Long Anh Lê Hồng Hiển Anh Long Anh Lê Hồng Hiển Anh Long Anh Lê Hồng Hiển Anh Long Anh Lê Hồng Hiển Anh Long 10 Chương 3: Chi tiết project Giới thiệu app Liberlove LiberLove lấy ý tưởng tương tự Tinder, mạng xã hội tìm kiếm bạn bè, hẹn hò giành cho những người thuộc cộng đồng LGBT Nhật Bản Thực thành viên Flutter Developer: - Lê Hồng Hiển (backend) Long (front-end) Nguyễn Quang Khang (front-end) Kế hoạch -Giai đoạn 1: Tạo UI theo figma ● thành viên Front-end hoàn thành UI chức chính app ● Test fix bug ● Gửi cho khách hàng review sửa UI theo feedback khách hàng -Giai đoạn 2: Thảo luận tạo logic diagram, mối quan hệ table , nêu yêu cầu trả Front-end cần thiết để tạo API -Giai đoạn 3: Tạo api fetch api cho tất chức -Giai đoạn 4: ● Test fix bug , gửi cho sếp test => fix sửa theo feed back ● Gửi sản phẩm hoàn thiện cho khách hàng => fix sửa theo feedback Các hình: 4.1 Đăng nhập , đăng kí, đởi mật khẩu, qn mật khẩu: 11 12 4.2 Màn hình Home: 13 4.3 Màn hình Friend: 4.4 Màn hình Chat: 14 4.5 Màn hình Profile: 15 4.6 Màn hình Edit Profile: 16 4.7 Màn hình Edit Setting: 17 4.8 Màn hình Confession Post: 18 19 TÀI LIỆU THAM KHẢO For Flutter: https://flutter.dev/ https://pub.dev/ For Graphql: https://graphql.org/ 20 TỔNG KẾT Như vậy, vòng tháng, nhóm kịp hoàn thành ứng dụng LiberLove chạy Android Ios LiberLove có đầy đủ chức mà khách hàng đề Hiện nay, app được release sử dụng Nhật Bản Chân thành cảm ơn giúp đỡ anh nhóm Flutter Developer, tạo điều kiện thuận lợi công ty Gonosen Quốc Tế giúp em hoàn thành đợt thực tập doanh nghiệp đầy bổ ích 21 ... chơi game - YasuTV- Nền tảng livestream , giao lưu - mạng xã hội - … Chương 2: Nội dung thực tập Đợt thực tập với chủ đề “Lập trình ứng dụng đa tảng với Flutter? ?? tạo ứng dụng theo yêu cầu khách... vụ ứng dụng luồng ứng dụng Tự nghiên cứu phương thức Graphql Flutter Query,mutation, subscription,… Tìm hiểu và sử dụng thư viện của Flutter 1.5 Đọc hiểu thực thi thư viện vào ứng dụng. .. khó khăn việc phải tạo ứng dụng sử dụng được tất hệ điều hành Đó chính lý Cross-flatform đời giúp tạo những ứng dụng có thể chạy nhiều hệ điều hành khác Trong đó Flutter những Framework